Softonic

Base64 Image Encoder

ขั้นตอน 1 / 3 วางรูปภาพของคุณที่นี่

กำลังประมวลผล...

การฝังภาพเล็กแบบ Base64 data URI อาจลด HTTP request ได้หนึ่งครั้งและทำให้ทรัพยากรเดินทางไปพร้อม HTML หรือ CSS ตัวเข้ารหัสนี้รับไฟล์ PNG, JPEG, GIF, WebP และ SVG ที่รองรับขนาดไม่เกิน 5 MiB ภาพราสเตอร์ที่ถอดรหัสแล้วต้องมีความยาวแต่ละด้านไม่เกิน 16,384 พิกเซล และมีจำนวนรวมไม่เกิน 33,554,432 พิกเซล ตัวเข้ารหัสตรวจสอบการถอดรหัสภาพราสเตอร์ในเบราว์เซอร์ และตรวจเฉพาะโครงสร้าง UTF-8 ของ SVG ก่อนสร้างผลลัพธ์ Base64, CSS, HTML หรือ JSON ควรทดสอบกับระบบปลายทาง และถือว่า SVG ที่ไม่น่าเชื่อถือยังเป็นเนื้อหาแบบแอ็กทีฟแม้เข้ารหัสแล้ว

วิธีเข้ารหัสภาพ

  1. 1

    วางภาพของคุณ

    เลือกไฟล์ PNG, JPG, GIF, WebP หรือ SVG ขนาดไม่เกิน 5 MiB ภาพราสเตอร์ต้องมีความยาวแต่ละด้านไม่เกิน 16,384 พิกเซล และมีจำนวนรวมไม่เกิน 33,554,432 พิกเซล ข้อความที่เข้ารหัสต้องมีขนาดต่ำกว่า 7 MiB

  2. 2

    การเข้ารหัสทำงานในเบราว์เซอร์

    อ่านไบต์ของภาพ เข้ารหัส Base64 และเติมส่วนหัว `data:` URI ที่ถูกต้อง

  3. 3

    เลือกรูปแบบผลลัพธ์

    Base64 ดิบ, กฎ CSS `background-image`, แท็ก HTML `<img>` หรือสตริงที่ปลอดภัยสำหรับ JSON

  4. 4

    คัดลอกผลลัพธ์

    วางหลังจากตรวจสอบการรองรับ data URI ขีดจำกัดขนาด และความปลอดภัยของเนื้อหาในระบบปลายทาง

เมื่อใดที่การฝังภาพแบบ inline คุ้มค่า

ภาพที่เหมาะกับการฝัง inline:

  • ไอคอนต่ำกว่า 2 KB, ประหยัด HTTP request หนึ่งครั้งโดยมีค่าใช้จ่ายเพิ่มแทบไม่มี
  • เทมเพลตอีเมล - โปรแกรมอีเมลรองรับ data URI ไม่สม่ำเสมอ ควรทดสอบกับโปรแกรมเป้าหมายและใช้ภาพแบบ CID หรือภาพที่โฮสต์ไว้เมื่อจำเป็น
  • ภาพตัวอย่างส่วนหัว (LQIP), ฝังเวอร์ชันเบลอคุณภาพต่ำไว้ก่อน แล้วค่อยโหลดภาพเต็มภายหลัง
  • SVG ที่ใช้เพียงครั้งเดียว, data URI แบบเข้ารหัสเปอร์เซ็นต์อาจสั้นกว่า Base64 หากเข้ารหัสอักขระสงวนอย่างถูกต้อง และยังต้องถือว่า SVG ที่ไม่น่าเชื่อถือเป็นเนื้อหาแบบแอ็กทีฟ

ภาพที่ไม่เหมาะ:

  • ภาพขนาดใหญ่, การขยาย 33% สำหรับภาพ 500 KB คือการสูญเปล่า 166 KB
  • ภาพที่ใช้ซ้ำในหลายหน้า, การฝัง inline ทำให้แคชของเบราว์เซอร์ข้ามเส้นทางใช้ไม่ได้
  • CSS วิกฤต, การฝังภาพหนักแบบ inline ทำให้เส้นทางวิกฤตบวมขึ้น

ขนาดที่คาดได้

ขนาดภาพ ขนาดสตริง Base64
500 ไบต์ ~680 อักขระ
2 KB ~2.7 KB
20 KB ~27 KB
200 KB ~270 KB

รูปแบบ Data URI

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwAEhQGAhKmMIQAAAABJRU5ErkJggg==
  • สคีม data:
  • ชนิด MIME
  • ตัวบ่งชี้ ;base64,
  • ไบต์ที่เข้ารหัสแล้ว

SVG เป็นกรณีพิเศษ

SVG เป็นข้อความ แต่ขนาดเมื่อเทียบกับ Base64 ขึ้นอยู่กับเนื้อหาและจำนวนอักขระที่ต้องเข้ารหัสเปอร์เซ็นต์ สำหรับรูปแบบที่ไม่ใช้ Base64 ให้ใช้ data:image/svg+xml, และเข้ารหัสอักขระสงวนอย่างถูกต้อง พารามิเตอร์ ;utf8 ที่พบได้ทั่วไปไม่ใช่พารามิเตอร์มาตรฐานและใช้แทนการเข้ารหัสเปอร์เซ็นต์ไม่ได้ เครื่องมือนี้ไม่แสดงตัวอย่าง SVG และตรวจเฉพาะโครงสร้าง UTF-8 ดังนั้น SVG ที่ไม่น่าเชื่อถือยังเป็นเนื้อหาแบบแอ็กทีฟ และ Base64 ไม่ใช่การทำให้ปลอดภัย

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

Base64 เพิ่มขนาดข้อมูลไบนารีประมาณหนึ่งในสามก่อนนับส่วนห่อ data URI และการบีบอัดระหว่างส่ง ไม่มีเกณฑ์ขนาดตายตัวที่ได้เปรียบเสมอ ควรเปรียบเทียบจำนวน request แคช การบีบอัด และการนำกลับมาใช้ แล้ววัดผลกับเว็บไซต์จริง

data URI ไม่ได้ให้ประโยชน์ด้าน SEO โดยอัตโนมัติ เครื่องมือค้นหาพิจารณา HTML โดยรอบ แต่ภาพพื้นหลัง CSS ไม่มีข้อความทางเลือกแบบแอตทริบิวต์ alt หากภาพสื่อความหมายให้ใช้ <img> พร้อมข้อความทางเลือกที่เหมาะสม และประเมินประสิทธิภาพแยกต่างหาก

ไม่ ตัวเข้ารหัสอ่านไฟล์ในเครื่องด้วย FileReader API และสร้างสตริง Base64 ภายในเบราว์เซอร์ ไม่มีอะไรออกจากเครื่องของคุณ

ได้ ใช้เครื่องมือ Base64 to Image เพื่อเปลี่ยน data:image/... URI กลับเป็นไฟล์ที่ดาวน์โหลดได้

เครื่องมือที่เกี่ยวข้อง

เครื่องมือสร้าง QR Code

สร้าง QR Code จากข้อความหรือ URL ในเบราว์เซอร์ แล้วดาวน์โหลดเป็น PNG

เครื่องสร้างบาร์โค้ด

สร้างบาร์โค้ด Code 128, EAN-13, UPC, ITF-14 และรูปแบบเชิงเส้นอื่นอีกเจ็ดแบบ ข้อมูลอยู่ในเบราว์เซอร์และดาวน์โหลดเป็น SVG หรือ PNG ได้

แปลง WebP เป็น JPG

แปลงรูปภาพ WebP เป็น JPG/JPEG ได้โดยตรงในเบราว์เซอร์ เลือกคุณภาพ ผสานความโปร่งใสเข้ากับสีพื้นหลัง แล้วดาวน์โหลดโดยไม่ต้องอัปโหลดไฟล์

เครื่องมือปรับขนาดรูปภาพสำหรับโซเชียลมีเดีย

ปรับขนาดรูปภาพหนึ่งภาพเป็นพรีเซ็ตโซเชียลมีเดียในตัวสำหรับ Instagram, Facebook, X, LinkedIn, YouTube, Pinterest และ TikTok ดูตัวอย่าง PNG แต่ละไฟล์และดาวน์โหลดขนาดที่ต้องใช้

BMP เป็น PNG

แปลงไฟล์ BMP เป็น PNG ในเบราว์เซอร์ แบบไม่สูญเสียคุณภาพ คงความลึกของสี และเพิ่มความโปร่งใสจากช่อง alpha ของ BMP ต้นฉบับได้

บีบอัด GIF

ลดขนาด GIF แอนิเมชันในเบราว์เซอร์ด้วยการย่อมิติ เก็บเฟรมน้อยลง และปรับคุณภาพการเข้ารหัส ดูตัวอย่างลูปก่อนดาวน์โหลด