ไฟล์รูปสมัยใหม่บนเว็บยุคนี้ต้องเน้นไว คุณภาพดี ซึ่งไฟล์สกุล WebP ตอบโจทย์ตรงนี้ครับ ซึ่งจริงๆ เราสามารถใช้ปลั๊กอินแปลงไฟล์รูปนามสกุลอื่่นให้เป็น WebP ได้ แต่มักจะมีข้อจำกัดให้ใช้ได้เพียงไม่กี่รูปเท่านั้น แล้วทำไมเราไม่เซฟภาพให้เป็น WebP ตั้งแต่ต้นเลยล่ะ ตามไปดูวิธีกันเลย
ไฟล์ WebP คืออะไร
ไฟล์ WebP เป็นไฟล์ภาพแห่งอนาคต เป็นรูปแบบไฟล์ภาพแบบโอเพนซอร์สที่พัฒนาโดย Google เปิดตัวครั้งแรกในปี 2010 WebP รองรับการบีบอัดทั้งแบบสูญเสีย (lossy) และแบบไม่สูญเสีย (lossless) ช่วยให้ไฟล์ภาพมีขนาดเล็กลงโดยไม่สูญเสียคุณภาพ เหมาะอย่างยิ่งสำหรับการใช้งานบนเว็บ
ข้อดีของ WebP
– ขนาดไฟล์เล็ก WebP ให้ขนาดไฟล์ที่เล็กกว่า JPEG ประมาณ 25-35% และเล็กกว่า PNG ประมาณ 26% ช่วยให้โหลดหน้าเว็บได้เร็วขึ้น ประหยัดแบนด์วิธ และลดการใช้ข้อมูล
– คุณภาพดี WebP ให้คุณภาพของภาพที่ใกล้เคียงกับ JPEG และ PNG
– รองรับการบีบอัดแบบไม่สูญเสีย WebP เหมาะสำหรับการเก็บรักษาภาพที่มีรายละเอียดสูง เช่น ภาพถ่าย โลโก้ หรือภาพกราฟิก
– รองรับภาพโปร่งใส WebP รองรับการบีบอัดภาพโปร่งใสเช่นเกียวกับไฟล์ PNG (alpha transparency) โดยไม่สูญเสียคุณภาพ
– รองรับการใช้งานบนเว็บ WebP รองรับโดยเบราว์เซอร์หลักๆ ทั้งหมด เช่น Chrome, Firefox, Safari, Edge และ Opera
– เหมาะสำหรับการทำคะแนน PageSpeed เนื่องจาก Google Page Speed มักจะแนะนำให้เราเลือกใช้ไฟล์ภาพแบบ WebP อยู่เสมอ ถ้าใครต้องการคะแนนดีๆ เราแนะนำให้คุณเลือกใช้ WebP ดีที่สุด
– รองรับภาพเคลื่อนไหว หรือ Animated WebP แต่ไฟล์เล็กกว่า Gif และ APNG
ดูจากข้อดีแล้วก็ไม่มีเหตุผลใดที่จะไม่ใช้นะครับ ดีซะขนาดนี้ ^ ^
วิธีแปลงเป็น WebP ด้วยโปรแกรม
ปัจจุบันโปรแกรมออกแบบกราฟิคส่วนใหญ่จะรองรับการ Export ไฟล์ภาพเป็นสกุล WebP แทบจะหมดแล้วครับ ที่ไม่ได้ก็จะมีพวกโปรแกรมยุคเก่าที่ไม่รองรับ แม้แต่ Photoshop เอง เพิ่งจะรองรับในเวอร์ชั่น 2022 รุ่นหลังๆ
การใช้ Photoshop แปลงภาพเป็น WebP
ใครที่ใช้เวอร์ชั่นต่ำกว่า 2022 จะ Export จากโปรแกรมเดิมๆ ไม่ได้ครับ จะต้องไปดาวโหลด Plugin เสริมที่แจกฟรีบนเว็บ github กันก่อน ซึ่งก็คือ “WebPShop” เวอร์ชั่นล่าสุดเป็น WebPShop 0.4.3 เลือกโหลดเป็นเวอร์ชั่น 64bit ซึ่งระบบวินโดวส์ปัจจุบันของแต่ละคนน่าจะเป็น 64 Bit กันอยู่แล้ว โดยจะรองรับทั้งระบบ Windows และ Mac ครับ
วิธีติดตั้ง
ให้ก๊อปปี้ไฟล์ไปไว้ในโฟลเดอร์ Plugin ของ Photoshop ครับ ซึ่งพาธอาจจะแตกต่างกันแล้วแต่เวอร์ชั่นที่แต่ละคนใช้ เช่น
Windows
C:\Program Files\Adobe\Adobe Photoshop CC (64 Bit)\Plug-ins
C:\Program Files\Adobe\Adobe Photoshop 2022\Plug-ins
C:\Program Files\Common Files\Adobe\Plug-Ins\CC
C:\Program Files\Common Files\Adobe\Plug-Ins\CC\File Formats
Mac
/Library/Application Support/Adobe/Plug-Ins/CC for Mac
/Library/Application Support/Adobe/Plug-Ins/CC
Applications/Adobe Photoshop/Plug-ins/
พาธของที่เก็บ Plugin Photoshop ก็จะประมาณนี้ครับ
ถ้าหากติดตั้งแล้วยังไม่เห็นตัวเลือก WebP ให้ลบไฟล์ทิ้ง แล้วลองรีสตาร์ทคอมใหม่แล้วลงใหม่ตามวิธีข้างต้นครับ
วิธีใช้งาน
ตอนเซฟไฟล์ภาพให้เราเลือก Save As แล้วเลือกนามสกุลเป็น WebP เท่านั้นเองครับ กำหนด Quality คุณภาพของไฟล์ภาพตามต้องการ
ส่วนใครที่ใช้ Photoshop เวอร์ชั่นปัจจุบันอยู่แล้วก็ Export จากโปรแกรมโดยตรงโดยไม่ต้องลงปลั๊กอินเสริม
การใช้ Affinity Photo แปลงภาพเป็น WebP
ถ้าใครใช้โปรแกรม Affinity Photo เป็นประจำก็สบายหน่อย เพราะโปรแกรมเขา Export เลือกเป็น Webp ได้เลย ไปที่เมนู File > Export เลือก WEBP กำหนดค่าได้ตามใจชอบ
สรุป
WebP เป็นรูปแบบไฟล์ภาพที่มีประสิทธิภาพสูง เหมาะสำหรับการใช้งานบนเว็บ เพราะช่วยให้โหลดหน้าเว็บได้เร็วขึ้น ประหยัดแบนด์วิธ และลดการใช้ข้อมูล แถมยังรองรับการบีบอัดทั้งแบบสูญเสียและแบบไม่สูญเสีย เหมาะสำหรับภาพหลากหลายประเภท และกำลังได้รับความนิยมเพิ่มมากขึ้น และเป็นตัวเลือกที่ดีสำหรับการแทนที่ JPEG และ PNG ลองใช้ WebP บนเว็บไซต์ของคุณกันนะครับ แล้วจะติดใจ
Related Posts
