สรุปความแตกต่าง JPG กับ PNG
| JPG (JPEG) | PNG | |
|---|---|---|
| การบีบอัด | สูญเสียคุณภาพ (Lossy) – รายละเอียดเล็กๆ ถูกตัดทิ้ง | ไม่สูญเสียคุณภาพ (Lossless) – เก็บทุกพิกเซลไว้ |
| ความโปร่งใส | ไม่รองรับ | รองรับ รวมถึงส่วนที่โปร่งใสบางส่วน |
| ขนาดไฟล์สำหรับรูปถ่าย | เล็ก | ใหญ่กว่าหลายเท่า |
| ขนาดไฟล์สำหรับภาพหน้าจอและกราฟิก | มักใหญ่กว่า และขอบเบลอ | เล็กและคมชัดสมบูรณ์ |
| การแก้ไขซ้ำ | ทุกครั้งที่บันทึกจะเสียคุณภาพเล็กน้อย | ไม่สูญเสีย |
| เหมาะกับ | รูปถ่ายและภาพสแกนของรูปถ่าย | ภาพหน้าจอ ข้อความ โลโก้ ไอคอน แผนภูมิ |
สรุปสั้นๆ: ใช้ JPG กับรูปถ่าย และใช้ PNG กับทุกอย่างที่มีขอบคม ข้อความ หรือพื้นหลังโปร่งใส
การบีบอัดแบบ JPEG ทำงานอย่างไร
JPEG ซึ่งเป็นมาตรฐานตั้งแต่ปี 1992 ออกแบบโดยอิงจากการมองเห็นของมนุษย์ โดยแยกความสว่างออกจากสี และมักเก็บสีด้วยความละเอียดที่ต่ำกว่า เพราะตาของเราสังเกตรายละเอียดของสีได้น้อยกว่า จากนั้นภาพจะถูกแบ่งเป็นบล็อกขนาด 8 × 8 พิกเซล แต่ละบล็อกถูกแปลงเป็นความถี่ (การแปลงโคไซน์แบบไม่ต่อเนื่อง หรือ DCT) และรายละเอียดที่เล็กที่สุดจะถูกปัดทิ้ง – ค่าคุณภาพเป็นตัวกำหนดว่าจะปัดทิ้งมากแค่ไหน ส่วนที่เหลือจะถูกบีบอัดด้วยการเข้ารหัสแบบ Huffman
สำหรับรูปถ่าย วิธีนี้ได้ผลดีอย่างน่าทึ่ง: ที่คุณภาพ 85–90% ไฟล์ JPG มีขนาดเพียงเศษเสี้ยวของขนาดที่ไม่บีบอัด แต่ดูเหมือนเดิม อย่างไรก็ตาม บริเวณขอบคมและข้อความ การปัดเศษจะปรากฏเป็นบล็อกและรัศมีจางๆ และทุกครั้งที่แก้ไขและบันทึก JPG ซ้ำ รายละเอียดก็จะหายไปอีกเล็กน้อย
การบีบอัดแบบ PNG ทำงานอย่างไร
PNG ถูกสร้างขึ้นในปี 1996 เพื่อเป็นรูปแบบที่ปลอดสิทธิบัตรมาแทน GIF โดยไม่ตัดข้อมูลใดๆ ทิ้งเลย: พิกเซลแต่ละแถวจะผ่านตัวกรองที่คาดเดาพิกเซลจากพิกเซลข้างเคียงก่อน แล้วผลลัพธ์จะถูกบีบอัดด้วย DEFLATE – วิธีเดียวกับที่ไฟล์ ZIP ใช้ พื้นที่สีเดียวขนาดใหญ่ ลวดลายซ้ำๆ และขอบที่คมชัดจะบีบอัดได้ดีมาก ส่วนรายละเอียดแบบสุ่มของรูปถ่ายแทบบีบอัดไม่ได้เลย
PNG รองรับสีเต็มรูปแบบสูงสุด 16 บิตต่อช่องสี มีช่องอัลฟาสำหรับความโปร่งใสที่นุ่มนวล และมีโหมดพาเลตสูงสุด 256 สีสำหรับกราฟิกขนาดเล็กมาก
ควรใช้ JPG เมื่อไร
- รูปถ่ายจากกล้องและมือถือ
- ภาพสแกนของรูปถ่ายและเอกสารที่มีรูปภาพ
- รูปถ่ายบนเว็บไซต์ ในอีเมล และบนโซเชียลมีเดีย
- เมื่อขนาดไฟล์ที่เล็กสำคัญกว่ารายละเอียดระดับพิกเซล
คุณภาพ 80–90% คือจุดที่ลงตัวที่สุดสำหรับการใช้งานส่วนใหญ่
ควรใช้ PNG เมื่อไร
- ภาพหน้าจอ โดยเฉพาะที่มีข้อความและหน้าตาโปรแกรม
- โลโก้ ไอคอน และกราฟิกที่ใช้สีพื้นเรียบ
- แผนภูมิ แผนภาพ และภาพลายเส้น
- ภาพที่ต้องมีพื้นหลังโปร่งใส
- ภาพที่คุณจะแก้ไขและบันทึกซ้ำหลายครั้ง
แล้ว WebP, AVIF, HEIC และ GIF ล่ะ
- WebP เป็นได้ทั้งแบบสูญเสียและไม่สูญเสียคุณภาพ และรองรับความโปร่งใส ไฟล์มักเล็กกว่า JPG และ PNG อย่างชัดเจน และเบราว์เซอร์ปัจจุบันทุกตัวแสดงผลได้ – เป็นตัวเลือกที่ดีสำหรับเว็บไซต์
- AVIF บีบอัดได้ดีกว่า WebP อีก และเบราว์เซอร์ปัจจุบันรองรับ แต่โปรแกรมอื่นอีกมากยังไม่รองรับ
- HEIC คือรูปแบบรูปภาพของ iPhone: มีประสิทธิภาพสูง แต่เบราว์เซอร์ส่วนใหญ่และหลายโปรแกรมไม่รองรับ จึงมักถูกแปลงเป็น JPG
- GIF จำกัดที่ 256 สี และยังมีประโยชน์แค่กับภาพเคลื่อนไหวง่ายๆ
- SVG เป็นรูปแบบเวกเตอร์ – ตัวเลือกที่ดีที่สุดสำหรับโลโก้และไอคอน หากคุณมีไฟล์เวกเตอร์ต้นฉบับ
การแปลงระหว่าง JPG และ PNG
แปลง PNG เป็น JPG ทำให้รูปถ่ายและภาพขนาดใหญ่เล็กลงมาก ส่วนที่โปร่งใสจะถูกเติมด้วยสีพื้นหลัง แปลง JPG เป็น PNG ช่วยป้องกันการสูญเสียเพิ่มเมื่อคุณแก้ไขภาพต่อ แต่ไม่สามารถดึงรายละเอียดที่การบีบอัด JPEG ตัดทิ้งไปแล้วกลับคืนมาได้ – ไฟล์จะแค่ใหญ่ขึ้น ทั้งสองการแปลงทำงานในเบราว์เซอร์ของคุณด้วยตัวแปลง PNG เป็น JPG และ JPG เป็น PNG บนเว็บไซต์นี้ แปลงได้ทีละหลายไฟล์
JPG, JPEG หรือ JFIF ต่างกันไหม
ทั้งหมดคือรูปแบบเดียวกัน JPEG คือชื่อของมาตรฐาน (ตั้งตาม Joint Photographic Experts Group) ส่วน .jpg เป็นที่นิยมเพราะ Windows รุ่นแรกๆ อนุญาตให้ใช้นามสกุลได้แค่สามตัวอักษร ขณะที่ .jpeg และ .jfif เป็นนามสกุลอื่นของข้อมูลภาพแบบเดียวกัน การเปลี่ยนชื่อนามสกุลระหว่างกันไม่ได้เปลี่ยนอะไรในภาพเลย
คำถามที่พบบ่อย
PNG คุณภาพดีกว่า JPG ไหม?
PNG ไม่สูญเสียคุณภาพ จึงไม่เสียรายละเอียดเลย แต่สำหรับรูปถ่าย JPG ที่คุณภาพ 85–90% ดูเหมือนกันทุกประการในขนาดไฟล์เพียงเศษเสี้ยว – PNG จึงไม่ได้ “ดีกว่า” สำหรับรูปถ่าย แค่ใหญ่กว่าเท่านั้น
เว็บไซต์ควรใช้ JPG หรือ PNG?
ใช้ JPG (หรือ WebP) สำหรับรูปถ่าย และ PNG (หรือ WebP) สำหรับภาพหน้าจอ กราฟิก และภาพที่มีพื้นหลังโปร่งใส สำหรับโลโก้และไอคอน SVG มักดีที่สุด
แปลง JPG เป็น PNG แล้วคุณภาพดีขึ้นไหม?
ไม่ PNG จะดูเหมือน JPG ทุกประการ – แค่ช่วยป้องกันการสูญเสียเพิ่มเติมเมื่อคุณแก้ไขภาพต่อ
อัปเดตล่าสุด: