Immagine in Base64

Quando conviene incorporare l'immagine

Un URL dati evita una richiesta, ma non può essere memorizzato nella cache autonomamente: viene scaricato di nuovo con ogni copia dell'HTML o del CSS che lo contiene e pesa circa un terzo in più del file. Questo compromesso è utile per immagini minuscole di pochi kilobyte, come un'icona in un foglio di stile o un segnaposto sfocato. Le foto e le immagini riutilizzate in più pagine si caricano più velocemente come file ordinari. Per gli SVG, codificare l'URL del markup invece di usare Base64 produce di solito un URL dati più breve.

Dove gli URL dati non funzionano

Gmail e molti altri client email non visualizzano le immagini incorporate come URL dati, quindi nelle newsletter inserisci il link a un'immagine ospitata. Molte API che accettano immagini Base64 vogliono solo il payload: elimina tutto fino alla virgola dopo base64, inclusa la virgola. Una pagina con una Content Security Policy deve elencare data: nella direttiva img-src prima che le immagini incorporate vengano caricate.

Come usarlo

1. Scegli un'immagine.
2. Codificala localmente.
3. Copia l'URL dati risultante.

Privacy e limitazioni

Il file rimane sul tuo dispositivo. Base64 è una codifica, non una crittografia, e aumenta le dimensioni di circa un terzo.