Kép Base64 konvertálás

Válasszon ki egy képfájlt a Base64 kódolású karakterláncra való konvertáláshoz. Kapcsolja be az adat URI előtagot a közvetlenül használható CSS/HTML kimenethez. Minden feldolgozás a böngészőjében történik.

Kép kiválasztása

Base64 kimenet

Data URI előtag hozzáadása

A Kép-Base64 átalakítóról

Ez az eszköz teljes egészében a böngészőjében alakítja át a képeket Base64-kódolt karakterláncokká. Semmilyen adat nem kerül feltöltésre semmilyen szerverre.

Data URI: Az előtag engedélyezésével a kimenet közvetlenül használható CSS background-image vagy HTML <img src="..."> elemekben.
Nyers Base64: Az előtag nélkül a nyers kódolt karakterláncot kapja.
Támogatja a JPEG, PNG, GIF, WebP, SVG és egyéb böngésző által támogatott képformátumokat.

Ha képet data URI-ként ágyaz be, egy kéréssel kevesebb lesz, a mérete viszont körülbelül harmadával nő, mert a base64 minden három bájtra négy karaktert használ. Ez a csere megéri valami kicsi és mindig szükséges elemnél, egy fényképnél nem. A beágyazott kép ráadásul nem gyorsítótárazható külön, tehát újra letöltődik a fájl minden példányával, ami hordozza.

Kapcsolódó eszközök

Base64 kódolás QR-kód Generátor Szín konverter

Ellenáll a jelölés?

Az escape-elt entitások, az elrontott kódolások és a tartalom, ami a CMS-ben így, az oldalon úgy jelenik meg, általában azt jelentik, hogy valami a folyamatban találgat. Frontendet építünk és a mögötte lévő publikálási utat, hogy a látogató azt lássa, amit leírt.

Beszéljünk a webhelyéről

Gyakran ismételt kérdések

Mikor éri meg a data URI?

Kis, azonnal szükséges képekhez: egy ikon, egy térköz, egy logó egy HTML levélben, ahol a külső képek alapból blokkoltak. Az ökölszabály néhány kilobájt; fölötte a többletméret felülmúlja a megspórolt kérést.

Miért nagyobb a kódolt változat?

A base64 három bájtot négy karakterként ábrázol, az eredmény tehát már a előtag előtt is harmadával nagyobb. A tömörítés ebből visszahoz valamennyit szállítás közben, de a böngésző a dokumentumban a hosszabb alakot tartja.

Árt a gyorsítótárazásnak?

Igen, és ezt szokták kihagyni. A külön képfájl egyszer kerül a gyorsítótárba és újrahasznosul; a beágyazott a stíluslap vagy az oldal része, és minden alkalommal újra letöltődik, amikor az a fájl megváltozik.

Milyen formátumokat ágyazhatok be?

Bármelyiket, mert a base64 közömbös a tartalom iránt. Az SVG az érdekes eset: már eleve szöveg, így data URI-ként beágyazni gyakran nagyobb, mint magát az SVG-t közvetlenül beilleszteni.

Feltöltik a képemet?

Nem. A fájlt a böngészője olvassa be és az oldalon kódolja, tehát soha nem hagyja el a gépét. Ez akkor számít, ha a kép valami belső dologról készült képernyőkép, ami az esetek többsége.