ตัวแปลง Base64 เป็น AVIF

บันทึกรูปภาพ AVIF ที่เข้ารหัส Base64 เป็นไฟล์ .avif พร้อมตรวจสอบขนาดภาพและขนาดไฟล์ การแปลงรูปภาพอื่นเป็น AVIF ใช้ได้เมื่อเบราว์เซอร์ของคุณมีตัวเข้ารหัส AVIF

ทำงานภายในเบราว์เซอร์ของคุณทั้งหมด ไม่มีการอัปโหลดข้อมูลใด ๆ

วิธีใช้งาน

  1. วางสตริง Base64 หรือ URI แบบ data:image/avif;base64
  2. ตรวจดูภาพตัวอย่าง รูปแบบที่ตรวจพบ และขนาดภาพ
  3. หากต้องการบันทึก AVIF ตามเดิม ให้เลือก “ต้นฉบับ” หากต้องการแปลงรูปแบบอื่น ให้คง AVIF ไว้ แต่หากเบราว์เซอร์ของคุณเข้ารหัส AVIF ไม่ได้ ตัวเลือกนี้จะใช้ไม่ได้
  4. ดาวน์โหลดไฟล์ .avif

ข้อมูล AVIF มีลักษณะอย่างไร

AVIF จัดเก็บรูปภาพที่บีบอัดด้วยโคเดกวิดีโอ AV1 ไว้ในคอนเทนเนอร์ HEIF ซึ่งใช้โครงสร้างไฟล์สื่อพื้นฐาน ISO แบบเดียวกับ MP4 AVIF ไม่มีลายเซ็นสั้น ๆ ที่ตายตัวแบบของ PNG แต่ไฟล์จะเริ่มด้วยกล่อง ftyp ที่ระบุแบรนด์ avif หรือ avis สำหรับลำดับภาพเคลื่อนไหว ใน Base64 โดยทั่วไปหมายความว่าสตริงขึ้นต้นด้วย AAAA และมี eXBhdmlm อยู่ถัดไปอีกไม่กี่อักขระ เครื่องมือนี้อ่านกล่องดังกล่าวโดยตรง จึงแยก AVIF ออกจาก HEIC ได้ แม้ HEIC จะใช้คอนเทนเนอร์เดียวกันแต่ต่างแบรนด์ ชนิด MIME คือ image/avif

การแปลงเป็น AVIF ขึ้นอยู่กับเบราว์เซอร์ของคุณ

Chrome, Edge, Firefox และ Safari เวอร์ชันปัจจุบันแสดง AVIF ได้ทั้งหมด การดูตัวอย่างและบันทึกไฟล์ต้นฉบับจึงใช้ได้แทบทุกที่ แต่การสร้างไฟล์ AVIF ใหม่นั้นต่างออกไป การแปลงใช้ตัวเข้ารหัสที่มีอยู่ในเบราว์เซอร์ของคุณ และไม่ใช่ทุกเบราว์เซอร์ที่สร้าง AVIF จาก canvas ได้ เครื่องมือนี้จะตรวจสอบว่าเบราว์เซอร์ของคุณทำได้หรือไม่ หากเข้ารหัส AVIF ไม่ได้ ตัวเลือกนี้จะใช้ไม่ได้ และ WebP เป็นทางเลือกที่ใกล้เคียงที่สุด คุณยังดาวน์โหลด PNG แล้วเข้ารหัสด้วยเครื่องมือเฉพาะทาง เช่น avifenc จาก libavif ได้ด้วย

เมื่อใดที่ AVIF คุ้มค่า

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

<picture>
  <source srcset="photo.avif" type="image/avif">
  <img src="photo.jpg" alt="Description">
</picture>

คำถามที่พบบ่อย

ทำไมตัวเลือกดาวน์โหลด AVIF จึงใช้ไม่ได้

เบราว์เซอร์ของคุณแสดง AVIF ได้แต่เข้ารหัสจาก canvas ไม่ได้ ลองใช้เบราว์เซอร์อื่นที่เป็นเวอร์ชันล่าสุด เลือก WebP แทน หรือดาวน์โหลด PNG แล้วแปลงด้วยตัวเข้ารหัสบนเดสก์ท็อป

ทำไม AVIF ของฉันจึงไม่แสดงภาพตัวอย่าง

เบราว์เซอร์หรือระบบปฏิบัติการรุ่นเก่าอาจถอดรหัส AVIF ไม่ได้ หรือข้อมูลอาจเป็น HEIC ซึ่งดูคล้ายกันแต่ใช้แบรนด์ต่างกัน รูปแบบที่ตรวจพบจะบอกว่าเป็นแบบใด การดาวน์โหลดเป็น “ต้นฉบับ” ใช้ได้ทั้งสองกรณี

AVIF เล็กกว่า WebP เสมอหรือไม่

บ่อยครั้ง แต่ไม่เสมอไป ผลลัพธ์ขึ้นอยู่กับรูปภาพและการตั้งค่าตัวเข้ารหัส จึงควรเปรียบเทียบขนาดของไฟล์ที่ดาวน์โหลด

จะเข้ารหัสไฟล์ AVIF กลับเป็น Base64 ได้อย่างไร
ใช้ แปลง AVIF เป็น Base64 เพื่อรับสตริง Base64 ล้วนหรือ data URI สำหรับ HTML หรือ CSS ของคุณ