บีบอัดรูป PNG

PNG เก่งเรื่องอะไร

PNG (Portable Network Graphics) ถูกสร้างขึ้นในปี 1996 เพื่อทดแทน GIF โดยไม่ติดสิทธิบัตร PNG เป็นแบบไม่สูญเสียข้อมูล ทุกพิกเซลที่ถอดรหัสออกมาคือพิกเซลเดียวกับที่บันทึกไว้ทุกประการ รองรับสีเต็มรูปแบบ ระดับสีเทา สีแบบดัชนีที่มีพาเลต และช่องอัลฟาเต็มรูปแบบ ขอบภาพจึงจางกลืนไปกับพื้นหลังใดก็ได้อย่างนุ่มนวล PNG จึงเป็นตัวเลือกปกติสำหรับภาพหน้าจอ โลโก้ ไอคอน กราฟิกของส่วนติดต่อผู้ใช้ แผนภูมิ และทุกอย่างที่มีข้อความคมชัด

ราคาของการไม่สูญเสียข้อมูลคือขนาด รูปถ่ายที่บันทึกเป็น PNG มักใหญ่กว่ารูปเดียวกันในรูปแบบ JPEG หลายเท่า เพราะสัญญาณรบกวนและพื้นผิวละเอียดของรูปถ่ายคาดเดาได้ไม่ดีพอที่จะบีบอัด

ทำไมไฟล์ PNG ยังเล็กลงได้อีก

PNG บีบอัดเป็นสองขั้น ขั้นแรก พิกเซลแต่ละแถวจะผ่านฟิลเตอร์ (None, Sub, Up, Average หรือ Paeth) ที่แทนค่าพิกเซลด้วยผลต่างจากพิกเซลข้างเคียง พื้นที่สีเรียบจึงกลายเป็นเลขศูนย์ยาวต่อเนื่อง จากนั้นข้อมูลที่ผ่านฟิลเตอร์จะถูกแพ็กด้วย DEFLATE ซึ่งเป็นอัลกอริทึมเดียวกับ ZIP โปรแกรมจำนวนมากเลือกฟิลเตอร์และการตั้งค่า DEFLATE แบบเร็วมากกว่าแบบดี พิกเซลชุดเดิมจึงมักเก็บได้ในจำนวนไบต์ที่น้อยลง

จึงมีสองวิธีที่ทำให้ PNG เล็กลง

• การปรับแต่งแบบไม่สูญเสียข้อมูล เครื่องมือจะรัน OxiPNG ซึ่งลองกลยุทธ์ฟิลเตอร์และการตั้งค่าการบีบอัดหลายแบบแล้วเก็บผลลัพธ์ที่เล็กที่สุดไว้ ภาพยังเหมือนเดิมทุกพิกเซล ผลที่ได้ขึ้นอยู่กับว่าไฟล์ถูกบันทึกมาอย่างไร ไฟล์ที่ส่งออกจากเครื่องมือจับภาพหน้าจอแบบเร็วมักเล็กลงอย่างเห็นได้ชัด ส่วนไฟล์ที่ปรับแต่งมาแล้วแทบไม่เปลี่ยน
• การลดสีเป็นพาเลต (แบบสูญเสียข้อมูล) PNG สีเต็มที่มีความโปร่งใสเก็บข้อมูล 4 ไบต์ต่อพิกเซล การแปลงเป็นพาเลตไม่เกิน 256 สีจะเก็บเพียง 1 ไบต์ต่อพิกเซลก่อนที่ DEFLATE จะเริ่มทำงานเสียอีก โหมดนี้จึงมักประหยัดได้มากกว่ามาก กราฟิกสีเรียบและภาพหน้าจอรับมือได้ดี แต่การไล่สีที่นุ่มนวลและรูปถ่ายอาจเห็นเป็นแถบสี

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

การตั้งค่าสำหรับงานทั่วไป

ภาพหน้าจอ Retina เป็นที่มาของ PNG ขนาดมหึมาอยู่บ่อย ๆ ภาพเต็มจอบนแล็ปท็อปที่มีหน้าจอ 2880 × 1800 มีมากกว่า 5 ล้านพิกเซล การย่อด้านที่ยาวที่สุดให้เหลือ 1600 px จะลดลงเหลือไม่ถึงหนึ่งในสาม และมักสำคัญกว่าการตั้งค่าการบีบอัดใด ๆ

เพื่อเป็นแนวทาง ในการทดสอบของเรา ภาพหน้าจอ PNG สี่ภาพจากหน้า Wikipedia, MDN และ GitHub เล็กลง 58–60 % ด้วยโหมดสมาร์ตซึ่งเป็นค่าเริ่มต้น และเล็กลงประมาณหนึ่งในสาม (ค่ามัธยฐาน) ในโหมดไม่สูญเสียข้อมูล ไฟล์ของคุณอาจเล็กลงมากหรือน้อยกว่านี้

ปัญหาที่พบบ่อย

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

คำถามเกี่ยวกับ PNG

เครื่องมือรูปภาพอื่น ๆ

เครื่องมือบีบอัดรูปภาพรองรับไฟล์หลายแบบปนกันในชุดเดียว กราฟิกเคลื่อนไหวเหมาะกับเครื่องมือบีบอัด GIF และหน้าวิธีการทำงานอธิบายความหมายของแบบไม่สูญเสียและแบบสูญเสียข้อมูลอย่างละเอียดขึ้น