เนื้อหาของแกลเลอรีนี้
หน้าแกลเลอรีนี้เหมาะที่จะดูด้วยเบราว์เซอร์ที่รองรับ WebP เช่น Google Chrome และ Opera และอื่นๆ
หากไม่มีสิทธิ์เข้าถึง Google Chrome คุณดาวน์โหลดรูปภาพที่อยู่บน ที่ใช้กับผลิตภัณฑ์อื่น รองรับ WebP
ไฟล์ภาพตัวอย่างใน JPEG และ WebP และแหล่งที่มา PNG
ตารางด้านล่างแสดง JPEG ที่ปรับขนาดแล้ว (ทางด้านซ้าย) และรูปภาพ WebP (ทางด้านขวา) แสดงคู่กันเพื่อเปรียบเทียบ เนื่องจากมีเบราว์เซอร์ที่รองรับ WebP อยู่แล้ว เราจะไม่วางรูปภาพ WebP ในคอนเทนเนอร์ PNG อย่างที่เคยทำตอนเปิดตัวอีกต่อไป รูปภาพ ไฟล์ต้องมีขนาดแน่นอน การคลิกภาพขนาดย่อ JPEG และ WebP จะเปิด รูปภาพขนาดใหญ่ในแท็บใหม่
ขนาดไฟล์ที่อยู่ด้านล่างภาพขนาดย่อจะสอดคล้องกับขนาดไฟล์ของรูปภาพ ได้รับยอดดูเมื่อคลิกภาพขนาดย่อ รูปภาพ WebP มีขนาดเล็กกว่า 30% เมื่อเทียบกับภาพ JPEG
JPEG | WebP |
|---|---|
| "Nærøyfjorden, นอร์เวย์ - จาก Breiskrednosi. โลก UNESCO Heritage" 1 | |
 ขนาดไฟล์ JPEG: 43.84 KB |
 ขนาดไฟล์ WebP: 29.61 KB |
| "เรือคายัคที่ Ekstremsportveko 2010, Voss" 2 | |
 ขนาดไฟล์ JPEG: 86.25 KB |
 ขนาดไฟล์ WebP: 59.18 KB |
| เฟรมที่ 10 ของ "พาร์ครัน" ลำดับ 3 | |
 ขนาดไฟล์ JPEG: 297.05 KB |
 ขนาดไฟล์ WebP: 198.38 KB |
| รูปภาพ: "A Wild Cherry (Prunus avium) in flower" 4 | |
 ขนาดไฟล์ JPEG: 251.03 KB |
 ขนาดไฟล์ WebP: 172.82 KB |
| รูปภาพ: การหายใจด้วยไฟ "ชัยปุระมหาราชาสายทองเหลือง" Chassepierre เบลเยียม 5 | |
 ขนาดไฟล์ JPEG: 120.78 KB |
 ขนาดไฟล์ WebP: 80.76 KB |
เครดิตรูปภาพ
รูปภาพในหน้านี้มาจากแหล่งที่มาต่างๆ เรามี ได้เลือกภาพที่สวยงามและน่าสนใจเพื่อแสดงคุณภาพของ WebP รูปภาพคลาสสิกที่มีชื่อเสียง เช่น ลีนา ลิงบาบูน ฯลฯ มักใช้เมื่อทำ คือ การเปรียบเทียบการบีบอัด แต่ไม่มีลิขสิทธิ์
เครดิตสำหรับรูปภาพด้านบนปรากฏตามลำดับที่นี่
| 1 |
"Nærøyfjorden, นอร์เวย์ - จาก Breiskrednosi. มรดกโลกของ UNESCO" ผู้เขียนรูปภาพ: Kjetil Birkeland Moe มีการทำซ้ำโดยได้รับอนุญาตจากผู้แต่ง ต้นฉบับ PNG บล็อกโพสต์โดยผู้เขียนพร้อมการเปรียบเทียบ JPEG และ WebP หนู ตัวอย่างการเปิดใช้งานเมื่อวางเมาส์ |
| 2 |
"เรือคายัคที่ Ekstremsportveko 2010, Voss" ผู้เขียนรูปภาพ: Kjetil Birkeland Moe มีการทำซ้ำโดยได้รับอนุญาตจากผู้แต่ง ต้นฉบับ PNG บล็อกโพสต์โดยผู้เขียนพร้อมการเปรียบเทียบ JPEG และ WebP หนู ตัวอย่างการเปิดใช้งานเมื่อวางเมาส์ |
| 3 |
เฟรมที่ 10 ของ "พาร์ครัน" ลำดับ ผู้ผลิตรูปภาพ: Lars Haglund, SVT Sveriges Television AB ทำซ้ำโดยได้รับอนุญาตจากผู้ผลิต ต้นฉบับ PNG |
| 4 |
รูปภาพ: "A Wild Cherry (Prunus avium) in flower" ผู้เขียนรูปภาพ: Benjamin Gimmel ต้นฉบับ PNG รูปภาพได้รับอนุญาตภายใต้ ครีเอทีฟคอมมอนส์ ใบอนุญาต Attribution-Share Alike 3.0 Unported |
| 5 |
รูปภาพ: การหายใจด้วยไฟ "ชัยปุระมหาราชาสายทองเหลือง" Chassepierre เบลเยียม ผู้สร้าง: Luc Viatour ต้นฉบับ PNG รูปภาพได้รับอนุญาตภายใต้ ครีเอทีฟคอมมอนส์ ใบอนุญาต Attribution-Share Alike 3.0 Unported เว็บไซต์ของผู้เขียนที่ www.lucnix.be |
การจำลองรูปภาพ
เพื่อการทำซ้ำและสาธิตการใช้ WebP เราจะอธิบายขั้นตอนที่เกี่ยวข้องเมื่อ กำลังสร้างรูปภาพในแกลเลอรีนี้
เครื่องมือ
ในการแปลงและปรับขนาดภาพต้นฉบับ เราใช้เวอร์ชันล่าสุดของ
เครื่องมือของ ImageMagick ชื่อ convert มีอยู่ใน https://www.imagemagick.org
ข้อมูลเวอร์ชันมีดังนี้
Version: ImageMagick 6.5.7-8 2010-12-02 Q16 https://www.imagemagick.org
สำหรับการบีบอัด JPEG เราใช้โปรแกรมเปลี่ยนไฟล์อ้างอิงของ IJG เวอร์ชัน 8b ที่ https://www.ijg.org/files/jpegsrc.v8b.tar.gz
ข้อมูลเวอร์ชันมีดังนี้
Independent JPEG Group's CJPEG, version 8b 16-May-2010
Copyright (C) 2010, Thomas G. Lane, Guido Vollbeding
การสร้างรูปภาพ PNG ต้นฉบับ
ก่อนอื่น ระบบจะแปลงแหล่งที่มาของ JPEG เป็นรูปแบบ PNG แบบไม่สูญเสียข้อมูล โดยใช้เพียงรายการต่อไปนี้
convert in.jpg out.png
จากนั้นรูปภาพต้นฉบับขนาดใหญ่จะได้รับการปรับขนาดใหม่ให้มีความกว้างน้อยลงเป็น 1024 พิกเซล โดยใช้คำสั่งต่อไปนี้
convert in.png -depth 16 -gamma 0.454545 -filter lanczos -resize 1024 -gamma 2.2 -depth 8 out.png
เพื่อสร้างรูปภาพ PNG ต้นฉบับชุดสุดท้าย
กำลังบีบอัดเป็นรูปแบบ JPEG
โปรแกรมเปลี่ยนไฟล์ของ JPEG (cjpeg) จะถ่ายภาพอินพุตในรูปแบบ PPM เราใช้ convert เพื่อ
สร้างขึ้นมา ลำดับ Conversion ที่สมบูรณ์จึงเป็น
convert in.png tmp.ppm
cjpeg -optimize -quality 80 -outfile out.jpg tmp.ppm
ซึ่งจะสร้างไฟล์ JPEG ที่มีการเพิ่มประสิทธิภาพ ด้วยค่าคุณภาพ 80
กำลังบีบอัดเป็นรูปแบบ WebP
เราตั้งเป้าลดขนาดไฟล์ลง 30% เมื่อเทียบกับไฟล์ JPEG ที่เพิ่มประสิทธิภาพแล้ว
ดังนั้น เราจึงระบุขนาดเป้าหมายสำหรับแต่ละรูปภาพอย่างชัดเจน
นอกจากนี้ เรายังกำหนดค่าเฉพาะกิจสำหรับระดับการกรองสำหรับแต่ละ
ภาพด้วยตัวเลือก -f ของเครื่องมือ cwebp แอมพลิจูดของ
นอกจากนี้ยังสามารถใช้การกำหนดรูปแบบเสียงรอบทิศทางสำหรับภาพบางภาพได้
ตัวเลือก-sns บรรทัดคำสั่งที่ใช้อ่านมีดังนี้
cwebp -m 6 -f 50 -size 31500 1.png -o 1.webp
cwebp -m 6 -f 20 -sns 100 -size 62000 2.png -o 2.webp
cwebp -m 6 -sns 90 -size 213000 3.png -o 3.webp
cwebp -m 6 -f 40 -size 181000 4.png -o 4.webp
cwebp -m 6 -f 40 -size 89000 5.png -o 5.webp
โดยรวมแล้ว ไฟล์ WebP ที่ได้มีการประหยัดพื้นที่ทั่วโลก 32% เมื่อเทียบกับ เป็นขนาดไฟล์ JPEG
โปรดทราบว่าภาพปก WebP ที่ใช้ในหน้านี้ก็จะเล็กลง 26% เช่นกัน เมื่อเทียบกับ JPEG ที่เทียบเท่ากัน