Firefox 65 รองรับการแสดงผลรูปภาพในฟอร์แมท WebP แล้ว

เทคโนโลยีการบีบอัดไฟล์ WebP ที่ผลักดันโดย Google สามารถแสดงผลได้ใน Google Chrome Browser มานานแล้ว แต่สำหรับโปรแกรมท่องเน็ตเบราว์เซอร์ยี่ห้ออื่น ยังไม่รองรับการทำงานของ WebP จนล่าสุด Firefox เวอร์ชั่น 65 ที่ปล่อยอัพเดทมาเมื่อต้นปี 2019 ที่ผ่านมา ประกาศรองรับการทำงาน และแสดงผลรูปภาพ ที่เป็นฟอร์แมท (นามสกุล) .webp เรียบร้อย

คุณสมบัติรูปภาพ .webp บีบอัดขนาดไฟล์ลดลง 25-30% เทียบกับ .png หรือ .jpg

ไฟล์ฟอร์แมท .webp มาพร้อมคุณสมบัติการบีบอัดไฟล์แบบไม่สูญเสียคุณภาพ (lossless) ทำให้มีขนาดไฟล์เล็กกว่า .png หรือ .jpg แบบเดิม โดยในทางเทคนิต สามารถลดขนาดไฟล์ได้มากถึง 25-30 % เลยทีเดียว

แสดงรูปภาพ .webp ด้วยแท็ก HTML <picture>

ในการแทรกรูปภาพด้วยคำสั่ง HTML ไม่ได้ใช้แท็ก <img> แบบเดิม แต่ต้องครอบด้วยแท็ก <picture> อีกชั้นหนึ่ง เพื่อให้เบราว์เซอร์ตรวจสอบว่ารองรับ .webp หรือไม่ หากเบราว์เซอร์ที่ผู้ใช้ไม่รองรับ .webp ก็จะดึงฟอร์แมท .jpg หรือ .png ที่เราเตรียมไว้มาแสดงผลแทน

<picture>
  <source srcset="/path/to/image.webp" type="image/webp">
  <img src="/path/to/image.jpg">
</picture>

เบราว์เซอร์ที่รองรับ .webp (อัพเดท: มิถุนายน 2019)

ในอดีต .webp สามารถแสดงผลได้ในเบราว์เซอร์ Google Chrome แต่ก็ได้ขยายคุณสมบัตการแสดงผลไปยังเบราว์เซอร์อื่นๆ จนล่าสุด (อัพเดท: มิถุนายน 2019) .webp สามารถแสดงผลได้ในเบราว์เซอร์สำคัญเกือบทั้งหมด ดูได้จากตารางต่อไปนี้

ตารางแสดงเบราว์เซอร์ที่รองรับ .webp (อัพเดท: มิถุนายน 2019)
เบราว์เซอร์ WebP WebP & alpha WebP Animation
Chrome (Desktop) 17+ 23+ 32+
Chrome for Android 25+ 25+ 32+
Microsoft Edge 18+ 18+ 18+
Firefox 65+ 65+ 65+
Opera 11.10+ 12.10+ 19+
Android Web View Android 4.0+ (ICS) Android 4.2 (JB-MR1) (ไม่มีรายละเอียด)

การแปลงไฟล์รูปจาก .jpg หรือ .png เป็นฟอร์แมท .webp ด้วยเว็บไซต์ WebP-Converter

หากเราไม่สามารถติดตั้งโปรแกรม/คำสั่ง ในการแปลงไฟล์รูป ให้เป็นฟอร์แมท .webp ก็สามารถใช้งานผ่านเว็บไซต์ WebP-Converter แทนได้

https://webp-converter.com/

รายละเอียดเพิ่มเติมเกี่ยวกับฟอร์แมท .webp สามารถอ่านเพิ่มเติมได้ที่เว็บไซต์ Google Developers

https://developers.google.com/speed/webp/

Did you like it?

1 votes with an average rating of 5.

ความคิดเห็น