ฟอร์แมตรูปใดดีที่สุดสำหรับเว็บไซต์?

คำถามว่า "ฟอร์แมตที่ดีที่สุด" ยังไม่ใช่คำถามที่เหมาะสมจนกว่าคุณจะรู้ว่าภาพนั้นเป็นภาพชนิดใด เว็บไซต์หนึ่งมีภาพหลายชนิดที่แตกต่างกันมาก และแต่ละชนิดมีตัวเลือกที่ชัดเจน:

• รูปถ่าย เช่น สินค้า ผู้คน และสถานที่: ใช้ฟอร์แมตแบบสูญเสียข้อมูล AVIF ให้ไฟล์เล็กที่สุด WebP เป็นตัวเลือกสมัยใหม่ที่ใช้ได้อย่างปลอดภัย และ JPG เป็นฟอร์แมตสำรองที่ทุกเบราว์เซอร์แสดงได้
• โลโก้ ไอคอน และภาพประกอบ: ใช้ SVG เพราะเป็นงานกราฟิกเวกเตอร์ จึงคมชัดในทุกขนาดบนทุกหน้าจอ และไฟล์มักมีขนาดเล็กมาก ใช้ฟอร์แมตพิกเซลสำรองเฉพาะเมื่อแพลตฟอร์มไม่รองรับ SVG
• ภาพหน้าจอ กราฟิก UI และทุกสิ่งที่มีความโปร่งใส: ใช้ PNG หรือ WebP แบบไม่สูญเสียข้อมูล สีพื้นเรียบและขอบคมคือสิ่งที่ฟอร์แมตแบบไม่สูญเสียข้อมูลบีบอัดได้ดี
• ภาพเคลื่อนไหวสั้นๆ: ใช้ WebP หรือ AVIF แบบเคลื่อนไหวแทน GIF ซึ่งมีชุดสีจำกัดและสร้างไฟล์ที่ใหญ่กว่ามาก
• favicon: ใช้ไฟล์ ICO โดยควรมีเวอร์ชัน SVG หรือ PNG ควบคู่กัน โปรดดู วิธีสร้าง favicon จากรูปภาพ

ข้อผิดพลาดแบบคลาสสิกคือการบันทึกรูปถ่ายเป็น PNG เพราะ PNG เก็บทุกพิกเซลแบบไม่สูญเสียข้อมูล ซึ่งเหมาะอย่างยิ่งสำหรับโลโก้แต่แย่มากสำหรับรูปถ่าย เพราะไฟล์จะพองใหญ่กว่า JPG หลายเท่าโดยคุณภาพที่มองเห็นไม่ได้ดีขึ้น

สำหรับรูปถ่าย ตัวเลือกขึ้นอยู่กับว่าคุณพึ่งพาเบราว์เซอร์รุ่นใหม่ได้มากเพียงใด:

• AVIF บีบอัดได้ดีที่สุด: เมื่อใช้คุณภาพทั่วไปสำหรับเว็บ ไฟล์จะเล็กกว่า JPEG ประมาณ 50% และเล็กกว่า WebP 20–30% พร้อมรองรับ HDR และขอบเขตสีกว้างหากคุณต้องการ Chrome, Firefox และ Safari ล้วนแสดงฟอร์แมตนี้ได้ โดย Safari รองรับตั้งแต่เวอร์ชัน 16.4 ในปี 2023 ข้อเสียคือการเข้ารหัสช้า โดยเฉพาะกับภาพขนาดใหญ่ และซอฟต์แวร์เดสก์ท็อปกับอุปกรณ์รุ่นเก่ายังรองรับไม่มาก
• WebP เป็นตัวเลือกเริ่มต้นที่ใช้งานได้จริง: ไฟล์เล็กกว่า JPEG 25–35% ที่คุณภาพการมองเห็นเท่ากัน รองรับความโปร่งใส และเบราว์เซอร์หลักทุกตัวรองรับมาตั้งแต่ 2020 แอปเดสก์ท็อปและเครื่องมือรุ่นเก่าบางรายการยังเปิดไฟล์นี้ไม่ได้ ซึ่งสำคัญต่อไฟล์ที่คุณส่งให้นักออกแบบ แต่ไม่ใช่ไฟล์ที่นำเสนอแก่ผู้เยี่ยมชม
• JPG เป็นฟอร์แมตสำรองที่ใช้ได้กับทุกระบบ แม้จะมีประสิทธิภาพต่ำที่สุดในบรรดาทั้งสามฟอร์แมต แต่ JPG ที่บันทึกด้วยคุณภาพประมาณ 75–82 มักดูไม่ต่างจากต้นฉบับบนหน้าจอ และทุกอย่างบนเว็บสามารถแสดงไฟล์นี้ได้

การตั้งค่าที่มีประสิทธิภาพที่สุดคือส่ง AVIF ให้เบราว์เซอร์ที่รองรับ ส่ง WebP ให้เบราว์เซอร์ที่เหลือ และเก็บ JPG ไว้สำหรับระบบที่เก่ากว่านั้น หากคุณต้องการเลือกเพียงฟอร์แมตเดียว WebP พร้อม JPG สำรองครอบคลุมผู้ใช้แทบทุกคน ดูการเปรียบเทียบโดยตรงได้ที่ WebP เทียบกับ AVIF และ WebP เทียบกับ JPG ส่วนกราฟิกที่ไม่ใช่รูปถ่าย โปรดดู PNG เทียบกับ JPG

เมื่อทราบฟอร์แมตเป้าหมายแล้ว การแปลงจะรวดเร็วและไฟล์ไม่ออกจากเครื่องของคุณ เครื่องมือแปลงรูปของ EditItAll ทำงานทั้งหมดภายในเบราว์เซอร์:

1. เปิดเครื่องมือแปลงแล้ววางรูปภาพของคุณ ไม่ว่าจะเป็นไฟล์เดียวหรือทั้งโฟลเดอร์ ระบบจะประมวลผลไฟล์ชุดเดียวกันพร้อมกัน
2. เลือกฟอร์แมตผลลัพธ์: WebP หรือ AVIF สำหรับรูปถ่าย และ PNG สำหรับกราฟิกที่ต้องการความโปร่งใส มีเส้นทางโดยตรงสำหรับงานที่ใช้บ่อย ได้แก่ JPG เป็น WebP, PNG เป็น WebP, JPG เป็น AVIF และ PNG เป็น AVIF
3. ตั้งค่าคุณภาพ เครื่องมือนี้ไม่มีช่องกำหนดขนาดเป้าหมาย เพราะขนาดเป็นผลลัพธ์ แต่ละไฟล์จะแสดงขนาดก่อนและหลัง คุณจึงเลื่อนตัวปรับจนทั้งตัวเลขและภาพดูเหมาะสม
4. ดาวน์โหลดผลลัพธ์ทีละไฟล์หรือรวมเป็น ZIP เดียว

ไม่มีการอัปโหลดไฟล์ คุณสามารถตัดการเชื่อมต่ออินเทอร์เน็ตหลังจากหน้าเว็บโหลดแล้วและแปลงไฟล์ต่อได้ นอกจากนี้ ระบบจะลบข้อมูลเมตา EXIF และ GPS ออกจากภาพที่ส่งออกทุกภาพ เพื่อไม่ให้รูปสินค้าเปิดเผยสถานที่ถ่าย ใช้งานได้ฟรี ไม่ต้องมีบัญชี และไม่มีลายน้ำ หากมีฟอร์แมตที่ถูกต้องอยู่แล้วและเพียงต้องการลดขนาด ให้ไปที่ เครื่องมือบีบอัดรูปภาพ ได้ทันที และหากแพลตฟอร์มกำหนดให้ใช้โลโก้เวกเตอร์ในเวอร์ชันพิกเซล SVG เป็น PNG จะแสดงผลตามขนาดที่คุณเลือก

การเลือกฟอร์แมตเป็นสิ่งที่ควรทำ แต่นิสัยสามอย่างนี้ช่วยประหยัดข้อมูลได้มากกว่าการเปลี่ยนจาก JPG เป็น AVIF:

• ปรับขนาดให้เท่ากับขนาดที่แสดงจริง รูปจากกล้องกว้างกว่าพื้นที่ที่ใช้บนหน้าเว็บหลายเท่า และพิกเซลส่วนเกินทุกพิกเซลจะถูกดาวน์โหลดแล้วทิ้งไป เครื่องมือรูปภาพของ EditItAll มีตัวเลือกจำกัดมิติสูงสุดเพื่อการนี้โดยเฉพาะ
• บีบอัดเพียงครั้งเดียวจากไฟล์ต้นฉบับ การบันทึกแบบสูญเสียข้อมูลทุกครั้งจะทิ้งรายละเอียดเพิ่มขึ้นเล็กน้อย เก็บไฟล์ต้นฉบับไว้ ส่งออกสำเนาสำหรับเว็บจากไฟล์นั้น และอย่าบันทึกต่อกันเป็นทอดๆ จาก JPG เป็น WebP แล้วเป็น AVIF
• นำเสนอฟอร์แมตสมัยใหม่พร้อมฟอร์แมตสำรอง เสนอ AVIF หรือ WebP ก่อน แล้วให้เบราว์เซอร์รุ่นเก่าใช้ JPG หรือ PNG แทน เพื่อไม่ให้ผู้เยี่ยมชมคนใดเห็นภาพที่เสียหาย

หากรายงานความเร็วแนะนำให้คุณ "เข้ารหัสรูปภาพอย่างมีประสิทธิภาพ" หรือ "นำเสนอรูปภาพในฟอร์แมตรุ่นใหม่" นี่คือสิ่งที่คำแนะนำนั้นหมายถึงโดยตรง: การแก้คำเตือนเรื่องการเข้ารหัสรูปภาพอย่างมีประสิทธิภาพ อธิบายทุกขั้นตอน และ การบีบอัด JPEG สำหรับเว็บ อธิบายตัวปรับคุณภาพอย่างละเอียด ดูคู่มือฟอร์แมตเพิ่มเติมได้ในหมวด การแปลงรูปภาพ