Toate instrumentele

Imagine în Base64

Base64 codifică octeți binari de imagine ca text ASCII pe care îl poți lipi în HTML img src, CSS url() sau JSON. Util pentru pictograme minuscule, URI-uri de date din prototipuri și API-uri care așteaptă imagini în linie. Codificarea are loc local - nu este încărcat nimic.

Cum se codifică o imagine în Base64

1. Încărcați fișierul imagine (păstrează-l mic — sub ~100 KB este practic).
2. Copiază șirul Base64 generat sau adresa URL a datelor complete.
3. Lipește în HTML, CSS sau configurație.
4. Testați în mediul țintă — unii clienți de e-mail limitează URI-urile de date.

Exemple de codificare

Logo în linie în e-mail HTML

O siglă PNG de 2 KB ca data:image/png;base64,... evită blocarea imaginilor externe în căsuțele de e-mail stricte ale companiei.

Fundal CSS pentru prototip

Lipește o textură Base64 într-o demonstrație cu un singur fișier fără găzduire de active.

Dispozitiv de testare API

Includeți un mic JPEG Base64 într-un corp de solicitare JSON pentru testarea punctului final de încărcare a imaginii.

Când imaginile Base64 ajută

Pentru active foarte mici în care o solicitare HTTP costă mai mult decât supraîncărcarea de dimensiune inline.
Pentru prototipuri HTML offline cu un singur fișier.
Când găzduirea externă nu este disponibilă în medii blocate.

Când să evitați imaginile Base64

Pentru fotografii mari — Base64 crește cu ~33% și crește memoria cache HTML.
Când sunt disponibile stocarea în cache CDN și responsive srcset.
Când mulți clienți de e-mail blochează URI-urile de date, folosești în schimb imagini găzduite.

Base64 în bugetele de performanță

Inlineing elimină călătoriile dus-întors, dar împiedică stocarea în cache a imaginii în browser separat. Folosește pentru pictograme minuscule critice deasupra pliului cu moderație; încărcați leneș mediile mari în mod normal.

Ciudățeniile clientului de e-mail

Desktopul Outlook are suport URI de date limitat din punct de vedere istoric. Testați Gmail, Apple Mail și Outlook înainte de a vă baza pe imaginile integrate în campanii.

Securitate

Nu inserați Base64 neîncrezător în pagini fără a înțelege conținutul - este încă context executabil în HTML. Codificați numai propriile tău active.

Întrebări frecvente

De ce este Base64 mai mare decât fișierul?

Codificarea folosește 4 caractere pentru fiecare 3 octeți - aproximativ 33% supraîncărcare plus prefixul URL al datelor.

Ce este o adresă URL de date?

Format: data:image/png;base64,iVBORw0KG... — tip MIME plus încărcare utilă codificată.

Dimensiunea maximă pentru e-mail?

Menține creșterea totală a mesajelor sub 10–20 KB; mulți clienți se sufocă cu imagini uriașe în linie.

Decodați înapoi în fișier?

Folosește instrumentul de codificare/decodor Base64 pentru a inversa ASCII în binar dacă este necesar.

Sunt imaginile încărcate?

Nu — FileReader citește local în browser.

SVG la Base64?

Posibil pentru text SVG mic; formatele raster sunt mai frecvente pentru URI-urile de date.