ถ้าเคยดาวน์โหลดรูปจากเว็บไซต์มาแล้วพบว่าเปิดไม่ได้ในโปรแกรมที่ใช้อยู่ นั่นมักเป็นเรื่องของสกุลไฟล์ ไม่ใช่ไฟล์เสีย รู้จักสกุลที่ใช้บ่อยสักนิดจะประหยัดเวลาได้มาก
WEBP คืออะไร ทำไมเว็บไซต์ถึงชอบใช้
Google พัฒนา WEBP ขึ้นมาเพื่อให้เว็บโหลดเร็วขึ้น ไฟล์ WEBP เล็กกว่า JPG ที่คุณภาพใกล้เคียงกันราว 25–35% และเล็กกว่า PNG ที่มีพื้นหลังโปร่งใสอยู่มาก
เว็บไซต์สมัยนี้จึงเก็บรูปเป็น WEBP กันเยอะขึ้น แต่ปัญหาคือโปรแกรมเก่าอย่าง Photoshop รุ่นก่อน 2022 หรือ Preview บน Mac บางเวอร์ชันยังเปิดไม่ได้ หรือเปิดได้แต่บันทึกซ้ำไม่ได้
กด save รูปจากเว็บมาแล้วเปิดไม่ขึ้นในโปรแกรมตัดต่อ แปลง WEBP เป็น JPG ก่อนก็แก้ได้ทันที หรือถ้าต้องการเก็บพื้นหลังโปร่งใสไว้ ใช้ WEBP เป็น PNG แทน
ในทางกลับกัน ถ้าต้องการลดขนาดรูปก่อนอัปโหลดขึ้นเว็บ แปลง PNG เป็น WEBP หรือ JPG เป็น WEBP ช่วยได้ ไฟล์เล็กลงชัดเจนโดยที่คนดูแทบแยกไม่ออก
SVG ต่างจาก PNG และ JPG ยังไง
PNG กับ JPG เป็นรูปแบบ raster — เก็บข้อมูลเป็นพิกเซล ขยายใหญ่เกินความละเอียดเดิมจะแตก
SVG เป็นรูปแบบ vector — เก็บข้อมูลเป็นสมการทางคณิต ขยายเท่าไหรก็ไม่แตก เหมาะสำหรับโลโก้ ไอคอน หรือกราฟิกที่ต้องใช้หลายขนาด
ปัญหาคือ SVG ใส่ใน Word, PowerPoint หรือระบบส่วนใหญ่ไม่ได้ และ browser บางตัวแสดงผล SVG ต่างไปเล็กน้อย แปลง SVG เป็น PNG ก่อนใช้งานจะได้ใช้กับทุกโปรแกรมได้ทันที กำหนดความละเอียดไว้ให้สูงพอก็ยังคงความคมชัดได้
ถ้าต้องการฝัง PNG เป็น Data URL ในโค้ด HTML หรือ CSS เพื่อลด HTTP Request สามารถใช้ แปลง PNG เป็น SVG ซึ่งจะ wrap รูปภาพใส่ tag SVG อีกทีหนึ่ง
ตารางเลือกสกุลไฟล์
| กรณีที่เจอ | สกุลที่ควรใช้ | เครื่องมือ |
|---|---|---|
| รูปเว็บโหลดช้า | WEBP | PNG/JPG → WEBP |
| โปรแกรมเก่าเปิด WEBP ไม่ได้ | JPG / PNG | WEBP → JPG หรือ PNG |
| โลโก้ขยายไม่แตก | SVG | — |
| SVG ใส่ PowerPoint ไม่ได้ | PNG | SVG → PNG |
| ฝัง raster image ใน HTML inline | SVG | PNG → SVG |
เรื่องเล็กน้อยที่ทำให้สับสน — JPEG กับ JPG
สองสกุลนี้คือไฟล์ชนิดเดียวกัน JPEG เป็นชื่อเต็ม JPG เป็นชื่อย่อที่ใช้ได้บน Windows ยุคเก่าที่จำกัดนามสกุลไว้ 3 ตัวอักษร ระบบบางอย่างรับแค่ .jpg ถ้าเจอแบบนั้นใช้ แปลง JPEG เป็น JPG แก้ได้เลย
รูปภาพจาก iPhone ก็มีเรื่องคล้ายกัน HEIC เปิดได้ลื่นบน Apple แต่ถ้าต้องส่งให้คนที่ใช้ Android หรือ Windows แปลงเป็น JPG ก่อนส่งปลอดภัยกว่า ใช้ เครื่องมือแปลง HEIC เป็น JPG ฟรีได้เลย
สกุลไฟล์รูปไม่มีตัวไหนดีที่สุดสำหรับทุกสถานการณ์ เลือกให้ตรงงานเท่านั้นพอ