แปลง PNG เป็น WebP
PNG คือฟอร์แมตที่นักออกแบบใช้บันทึกงาน ส่วน WebP คือฟอร์แมตที่เว็บไซต์ควรใช้ การแปลงช่วยลดขนาดไฟล์ลงได้สองในสามหรือมากกว่า โดยยังคงความโปร่งใสไว้ครบถ้วน และเบราว์เซอร์ปัจจุบันทุกตัวแสดงผลได้ การแปลงเกิดขึ้นบนอุปกรณ์ของคุณ จึงไม่มีการอัปโหลดใด ๆ
วางไฟล์ที่นี่ หรือคลิกเพื่อเลือกไฟล์
ผลลัพธ์
วิธีแปลง PNG เป็น WebP
- ลากรูปภาพ PNG หนึ่งไฟล์หรือหลายไฟล์มาวางในเครื่องมือด้านล่าง
- ฟอร์แมตผลลัพธ์ถูกตั้งเป็น WebP ไว้แล้ว ปรับคุณภาพได้ตามต้องการ
- กดเริ่มเพื่อแปลงไฟล์
- ดาวน์โหลดไฟล์ WebP ทีละไฟล์ หรือดาวน์โหลดทั้งหมดเป็นไฟล์ ZIP
ทำไมไฟล์ PNG ถึงใหญ่ขนาดนี้
PNG ไม่สูญเสียข้อมูล ทุกพิกเซลถูกเก็บไว้ตรงตามจริง ซึ่งทำให้เหมาะกับโลโก้ ภาพหน้าจอ และกราฟิกอินเทอร์เฟซ และเป็นเหตุผลที่ภาพถ่ายในรูปแบบ PNG อาจใหญ่กว่าภาพเดียวกันในรูปแบบ JPG ถึง 10 ถึง 20 เท่า โปรแกรมออกแบบส่งออกเป็น PNG เป็นค่าเริ่มต้นเพราะปลอดภัย ไม่ใช่เพราะมีประสิทธิภาพ ผลคือเว็บไซต์จำนวนมากแสดงไฟล์ PNG ขนาดหลายเมกะไบต์ สำหรับรูปที่ควรมีขนาดเพียงไม่กี่ร้อยกิโลไบต์
WebP ทำอะไรต่างออกไป
WebP ถูกออกแบบโดย Google เพื่อเว็บโดยเฉพาะ มีสองโหมด WebP แบบสูญเสียข้อมูล ใช้การทำนายและการเข้ารหัสแบบแปลงค่าคล้ายการบีบอัดวิดีโอ และมักได้ไฟล์เล็กกว่า JPG ที่คุณภาพสายตาเท่ากัน 25 ถึง 35% และเล็กกว่า PNG มาก WebP แบบไม่สูญเสียข้อมูล เก็บพิกเซลตรงตามจริงเหมือน PNG แต่ใช้วิธีบีบอัดที่ฉลาดกว่า โดยทั่วไปเล็กกว่า PNG ที่ปรับแต่งแล้ว 20 ถึง 30% ทั้งสองโหมดรองรับพื้นหลังโปร่งใส นี่คือเหตุผลหลักที่การแปลง PNG เป็น WebP เป็นที่นิยมมาก เพราะเป็นรูปแบบแรกที่รองรับอย่างกว้างขวางซึ่งเก็บช่องอัลฟาไว้ได้โดยไม่ต้องแบกขนาดไฟล์แบบ PNG
การเลือกค่าคุณภาพ
| PNG ต้นฉบับเป็น | คุณภาพ WebP ที่แนะนำ | ผลลัพธ์ |
|---|---|---|
| โลโก้ ไอคอน ภาพประกอบสีเรียบ | 90 ถึง 100 | ขอบยังคมชัด และยังเล็กกว่า PNG มากกว่า 50% |
| ภาพหน้าจอที่มีตัวอักษร | 85 ถึง 95 | ตัวอักษรยังอ่านออก โดยทั่วไปเล็กลง 60 ถึง 70% |
| ภาพถ่ายหรือภาพเรนเดอร์ 3D | 75 ถึง 85 | ดูไม่ต่างจากเดิมที่ขนาดปกติ เล็กลง 80 ถึง 90% |
| ภาพสินค้าไดคัตพื้นหลังโปร่งใส | 85 ถึง 90 | ขอบยังสะอาด ช่องอัลฟายังอยู่ครบ |
ควรใช้ WebP ที่ไหน
ใช้ WebP ทุกที่ที่เบราว์เซอร์เป็นตัวแสดงผล เช่น เว็บไซต์ของคุณ เว็บแอป เทมเพลตอีเมลที่มุ่งเป้าโปรแกรมอีเมลรุ่นใหม่ และ CDN สำหรับรูปภาพ ปัจจุบัน WordPress, Shopify, Webflow, Squarespace และ Wix รับการอัปโหลด WebP ทั้งหมด หากต้องรองรับโปรแกรมดูรุ่นเก่าไปพร้อมกัน วิธีมาตรฐานคือใช้แท็ก HTML <picture> ที่มีแหล่ง WebP ก่อน และมี PNG หรือ JPG เป็นตัวสำรอง
อย่าแปลงเป็น WebP เมื่อจะส่งงานพิมพ์ เก็บไฟล์ต้นฉบับงานศิลปะ หรือส่งให้ลูกค้าที่จะเปิดไฟล์ด้วย Photoshop หรือ Illustrator รุ่นเก่า ให้เก็บ PNG ต้นฉบับไว้ และถือว่า WebP เป็นรูปแบบสำหรับการนำไปแสดงผล
แปลงทีละหลายไฟล์
ลากโฟลเดอร์ไฟล์ PNG ที่ส่งออกไว้ทั้งโฟลเดอร์มาวางได้ในครั้งเดียว ทุกไฟล์จะถูกแปลงด้วยค่าคุณภาพเดียวกัน และดาวน์โหลดผลลัพธ์เป็นไฟล์ ZIP เดียวที่ยังใช้ชื่อไฟล์เดิมพร้อมนามสกุล .webp การเปลี่ยนไฟล์ในโปรเจกต์จึงทำได้ด้วยการค้นหาและแทนที่นามสกุลเท่านั้น
คำถามที่พบบ่อย
WebP เก็บพื้นหลังโปร่งใสของ PNG ไว้ได้หรือไม่?
ได้ WebP รองรับช่องอัลฟาแบบ 8 บิตเต็มรูปแบบ ขอบที่นุ่มนวล เงา และส่วนที่โปร่งใสบางส่วนจึงคงอยู่เหมือนใน PNG ทุกประการ
ควรใช้ WebP แบบไม่สูญเสียหรือแบบสูญเสียคุณภาพ?
สำหรับโลโก้ ไอคอน และภาพหน้าจอที่มีตัวอักษรคม ให้ตั้งคุณภาพสูงเพื่อให้ผลลัพธ์คมชัด สำหรับรูปถ่ายที่บันทึกเป็น PNG ไว้ คุณภาพ 80 ถึง 85 ช่วยลดขนาดได้มากโดยไม่เห็นความแตกต่าง
เบราว์เซอร์และแอปใดเปิด WebP ได้บ้าง?
Chrome, Edge, Firefox, Safari (ตั้งแต่เวอร์ชัน 14) และเบราว์เซอร์มือถือปัจจุบันทุกตัวแสดง WebP ได้ แอป Photos ของ Windows และ Preview ของ macOS ก็เปิดได้ แต่โปรแกรมเดสก์ท็อปรุ่นเก่าและโปรแกรมอีเมลบางตัวเปิดไม่ได้ จึงควรใช้ PNG หรือ JPG กับโปรแกรมเหล่านั้น
ทำไมบางครั้ง WebP ถึงใหญ่กว่า PNG?
รูปเล็กมากที่มีสีน้อยมาก เช่น ไอคอนขนาด 32 พิกเซล อาจมีขนาดใกล้ขั้นต่ำอยู่แล้วเมื่อเป็น PNG WebP จะได้เปรียบชัดเจนกับรูปที่ใหญ่กว่าประมาณสองร้อยพิกเซลขึ้นไป
ไฟล์ของคุณ ไม่เคยออกจากอุปกรณ์
ทุกเครื่องมือใน Squishly Tools ฟรี 100% และทำงานในเบราว์เซอร์ของคุณทั้งหมด รูปภาพและเอกสารถูกประมวลผลบนคอมพิวเตอร์ของคุณเองและไม่เคยถูกอัปโหลดไปยังเซิร์ฟเวอร์ ไม่ต้องมีบัญชี ไม่มีลายน้ำ และไม่มีเงื่อนไขแอบแฝง