Immagine su Base64
Base64 encodes binary image bytes as ASCII text you can paste into HTML img src, CSS url(), or JSON payloads. Useful for tiny icons, data URIs in prototypes, and APIs that expect inline images. Encoding happens locally — nothing is uploaded.
How to encode an image to Base64
1. Upload the image file (keep it small — under ~100 KB is practical).
2. Copy the generated Base64 string or full data URL.
3. Paste into your HTML, CSS, or config.
4. Test in the target environment — some email clients limit data URIs.
Esempi di codifica
Logo in linea nell'e-mail HTML
Un logo PNG da 2 KB come data:image/png;base64,... evita il blocco delle immagini esterne nelle rigide caselle di posta aziendali.
CSS sfondo per il prototipo
Incolla una texture Base64 in una demo a file singolo senza hosting di risorse.
Dispositivo per test API
Includi un piccolo JPEG Base64 nel corpo della richiesta JSON per il test dell'endpoint di caricamento delle immagini.
Quando le immagini Base64 aiutano
• Per risorse molto piccole in cui una richiesta HTTP costa più del sovraccarico delle dimensioni in linea.
• Per prototipi offline HTML a file singolo.
• Quando l'hosting esterno non è disponibile in ambienti bloccati.
Quando evitare le immagini Base64
• Per foto di grandi dimensioni: Base64 cresce del 33% circa e gonfia la cache HTML.
• Quando sono disponibili la memorizzazione nella cache CDN e srcset reattivo.
• Quando molti client di posta elettronica bloccano gli URI dei dati, utilizza invece le immagini ospitate.
Base64 nei budget di performance
L'incorporamento rimuove i viaggi di andata e ritorno ma impedisce la memorizzazione separata dell'immagine nella cache del browser. Usa con parsimonia le piccole icone critiche sopra la piega; caricare lentamente supporti di grandi dimensioni normalmente.
Stranezze del client di posta elettronica
Il desktop Outlook ha storicamente un supporto URI dati limitato. Prova Gmail, Apple Mail e Outlook prima di fare affidamento sulle immagini in linea nelle campagne.
Sicurezza
Non incollare Base64 non attendibile in pagine senza comprenderne il contenuto: è ancora un contesto eseguibile in HTML. Codifica solo le tue risorse.
Domande frequenti
Perché Base64 è più grande del file?
La codifica utilizza 4 caratteri per ogni 3 byte: circa il 33% di sovraccarico più il prefisso URL dei dati.
Cos'è un URL di dati?
Formato: data:image/png;base64,iVBORw0KG... — Tipo MIME più payload codificato.
Dimensione massima per l'e-mail?
Mantenere la crescita totale dei messaggi al di sotto dei 10-20 KB; molti clienti soffocano con enormi immagini in linea.
Decodificare nuovamente nel file?
Se necessario, usa lo strumento codifica/decodificatore Base64 per invertire ASCII in binario.
Le immagini vengono caricate?
No: FileReader legge localmente nel browser.
SVG a Base64?
Possibile per testo piccolo SVG; i formati raster sono più comuni per gli URI di dati.