Da immagine a Base64
Copia come data URI, pronto per CSS o HTML
Immagine
Risultato
Nessuna immagine
Trascina un’immagine e qui comparirà il risultato in Base64.
Il Base64 fa crescere i dati di circa il 33%. Usalo solo per immagini piccole.
Incorporare una piccola immagine come data URI elimina una richiesta di rete, cosa che conta per le icone presenti su ogni pagina. Oltre qualche kilobyte smette di convenire, perché il Base64 fa crescere i dati di circa un terzo e non può essere messo in cache separatamente.
Come si usa
- 1 Trascina qui un’immagine — le icone piccole sono l’uso ideale.
- 2 Scegli se vuoi il data URI completo o solo la parte Base64.
- 3 Copia il risultato e incollalo nel tuo CSS o HTML.
Domande frequenti
Quando conviene incorporare un’immagine?
Sotto i 4KB circa, e solo per immagini usate praticamente su ogni pagina. Oltre quella soglia la penalità di peso e la perdita della cache separata superano il vantaggio della richiesta risparmiata.
Perché il file diventa più grande?
Il Base64 rappresenta tre byte binari con quattro caratteri ASCII, un aumento fisso del 33%, più un po’ per il prefisso del URI. È il prezzo per incorporare dati binari dentro un file di testo.
Un data URI viene messo in cache?
Solo insieme al file che lo contiene. Cambia un’icona incorporata e l’intero foglio di stile va riscaricato — che è esattamente il motivo per cui incorporare immagini grandi si ritorce contro.