L'importanza della dimensione dei file email

Uccello

27 ago 2018

Email

1 min read

L'importanza della dimensione dei file email

Punti Chiave

    • Premessa: L'efficacia di una campagna email dipende fortemente dalla dimensione del file — sia per la consegna che per l'esperienza utente. Asset HTML o immagini di grandi dimensioni possono causare clipping, tempi di caricamento lenti e minore coinvolgimento, specialmente su mobile.

    • Obiettivo: Aiutare i marketer a bilanciare l'ambizione di design con vincoli tecnici ottimizzando HTML, asset esterni e dimensione completamente caricata.

    • In evidenza:

      1. Dimensione del file HTML:

        • Tenere sotto 100 KB per evitare il clipping di Gmail (obiettivo ideale ≈ 50 KB).

        • HTML di grandi dimensioni può rompere i layout e influire sulla consegna.

        • Ridurre le dimensioni attraverso:

          • Pulizia del codice (rimuovere markup obsoleti ed elementi non utilizzati).

          • Evitare un'eccessiva nidificazione di tabelle — 5–10 tabelle di solito sono sufficienti.

          • Spostare gli stili inline sicuri nel CSS incorporato dove possibile.

          • Semplificare il layout (design a colonna singola) e minimizzare il codice.

      2. Asset esterni (principalmente immagini):

        • Massimo consigliato = 100 KB per immagine; i GIF animati possono raggiungere i 500 KB.

        • Ottimizzare con ImageOptim, Caesium o compressione CDN.

        • Scegliere i formati corretti: JPG per foto, GIF per grafiche, PNG per la trasparenza.

        • Utilizzare immagini meno pesanti — display :none scarica comunque gli asset.

      3. Dimensione completamente caricata:

        • Carico totale ideale ≤ 1 MB per prestazioni fluide.

        • Su reti 3G, le email di grandi dimensioni possono richiedere 2–14 secondi per caricarsi; anche di più su 2G.

        • Ottimizzare per utenti lenti o con dati limitati (soprattutto in regioni in via di sviluppo).

      4. Testing e bilanciamento:

        • A/B test per trovare il compromesso tra ricchezza visiva e prestazioni.

        • Assicurarsi che l'email sia leggibile senza immagini per un caricamento percepito più veloce.

        • Poor size optimization can amplify deliverability and engagement problems.

      5. Risultato: Codice pulito e compatto e media ottimizzati portano a caricamenti più veloci, maggiore posizionamento nella casella di posta e migliore esperienza utente su tutti i dispositivi.

Punti salienti del Q&A

  • Perché la dimensione dei file delle email è importante?

    Grandi email rischiano di essere tagliate in Gmail e causano lunghi tempi di caricamento - entrambi danneggiano l'impegno e la deliverabilità.

  • Qual è la dimensione massima consigliata per l'HTML?

    Mantieni il tuo HTML sotto i 100 KB (idealmente < 50 KB). Gmail taglia i messaggi a 102 KB.

  • Come posso ridurre le dimensioni del mio HTML?

    Rimuovere il codice ridondante, ridurre l'annidamento delle tabelle, consolidare il CSS e minificare in modo sicuro.

  • Qual è il modo migliore per gestire il peso delle immagini?

    Comprimi i file utilizzando CDN o strumenti di ottimizzazione, utilizza formati appropriati e limita ciascuno a ≤ 100 KB.

  • Come posso garantire l'accessibilità per gli utenti con connessioni lente?

    Mantieni la dimensione totale dell'email < 1 MB, progetta per un fallback senza immagini e dai priorità al caricamento dei contenuti essenziali.

  • Qual è l'obiettivo finale dell'ottimizzazione delle dimensioni delle email?

    Per bilanciare la qualità del design, la deliverability e la velocità — con conseguente aumento dei tassi di apertura e click-through.

Quando si parla delle dimensioni dei file nelle email, si sta realmente parlando di 3 temi: la dimensione del file HTML inviato, la dimensione delle risorse esterne e la dimensione completamente caricata. Vogliamo mantenere tutte queste dimensioni dei file il più piccole possibile, ma quali sono le dimensioni massime e su cosa dovremmo puntare?

Quando si parla delle dimensioni dei file nelle email, si sta realmente parlando di 3 temi: la dimensione del file HTML inviato, la dimensione delle risorse esterne e la dimensione completamente caricata. Vogliamo mantenere tutte queste dimensioni dei file il più piccole possibile, ma quali sono le dimensioni massime e su cosa dovremmo puntare?

Quando si parla delle dimensioni dei file nelle email, si sta realmente parlando di 3 temi: la dimensione del file HTML inviato, la dimensione delle risorse esterne e la dimensione completamente caricata. Vogliamo mantenere tutte queste dimensioni dei file il più piccole possibile, ma quali sono le dimensioni massime e su cosa dovremmo puntare?

Dimensione del file HTML

La dimensione del file HTML è la dimensione del file .html che viene effettivamente inviato. Questa dimensione del file non include la dimensione delle immagini incluse, poiché queste verrebbero collegate da questo file html e scaricate all'apertura.

La dimensione massima che consiglieremmo è 100KB, poiché qualsiasi cosa oltre può portare a problemi di consegna e visualizzazione. Ad esempio, Gmail taglierà il tuo html a 102KB. Il ritaglio nasconderà la fine della tua email e può rompere il tuo layout. Anche la gestione delle email da parte di Gmail ha altre considerazioni, come l'impatto del prefetching delle immagini sul tracciamento delle email.

La maggior parte delle email dovrebbe facilmente rimanere sotto i 50KB. Tuttavia, a volte miglioramenti progressivi complessi o una grande quantità di contenuti della campagna portano a una dimensione del file più grande. Se ciò accade, ci sono diversi modi per aiutare a ridurre la dimensione del tuo file HTML.

  • Pulisci il tuo codice. Le email cambiano continuamente e vediamo molti modelli con codice obsoleto. Una rapida pulizia può salvare alcuni KB.

  • Non esagerare con il codice. Alcuni modelli che vediamo hanno codice extra che semplicemente non è necessario. Per consigli su come creare modelli efficienti, consulta la nostra guida su modelli di email avanzati. Il peggior colpevole è l'aggiunta di elementi di tabella aggiuntivi. La maggior parte dei layout può essere raggiunta con 5-10 tabelle, ma spesso vediamo codice con 30-40 tabelle. Meno tabelle hanno anche il vantaggio aggiuntivo di rendere il tuo codice più facile da leggere.

  • Sposta parte del codice da HTML a CSS. Non è ancora sicuro spostare tutti i tuoi stili in CSS, ma se fatto correttamente spostare alcuni stili inline in stili incorporati può aiutare a ridurre il codice.

  • Semplifica il tuo design. Un'altra opzione è tornare alla fase di design. Le email a colonna singola utilizzano molto meno codice.

  • Minimizza il tuo codice. Minimizzare il codice rimuoverà spazi e commenti non necessari. Questo può avere un enorme effetto, ma fai attenzione poiché molti ESP applicano una lunghezza massima della riga che potrebbe forzare una nuova riga e rompere il codice.


Limiti di dimensione delle email consigliati

Metrica

Limite raccomandato

Dimensione del file HTML (ideale)

≤ 50 KB

Dimensione del file HTML (massima)

100 KB

Dimensione del file immagine (max tipico)

≤ 100 KB

Massimo GIF animato

Fino a 500 KB

Dimensione email completamente caricata (raccomandata)

≤ 1 MB

Impatto del caricamento su reti lente

2–14 sec su 3G; molto più lungo su 2G

La dimensione del file HTML è la dimensione del file .html che viene effettivamente inviato. Questa dimensione del file non include la dimensione delle immagini incluse, poiché queste verrebbero collegate da questo file html e scaricate all'apertura.

La dimensione massima che consiglieremmo è 100KB, poiché qualsiasi cosa oltre può portare a problemi di consegna e visualizzazione. Ad esempio, Gmail taglierà il tuo html a 102KB. Il ritaglio nasconderà la fine della tua email e può rompere il tuo layout. Anche la gestione delle email da parte di Gmail ha altre considerazioni, come l'impatto del prefetching delle immagini sul tracciamento delle email.

La maggior parte delle email dovrebbe facilmente rimanere sotto i 50KB. Tuttavia, a volte miglioramenti progressivi complessi o una grande quantità di contenuti della campagna portano a una dimensione del file più grande. Se ciò accade, ci sono diversi modi per aiutare a ridurre la dimensione del tuo file HTML.

  • Pulisci il tuo codice. Le email cambiano continuamente e vediamo molti modelli con codice obsoleto. Una rapida pulizia può salvare alcuni KB.

  • Non esagerare con il codice. Alcuni modelli che vediamo hanno codice extra che semplicemente non è necessario. Per consigli su come creare modelli efficienti, consulta la nostra guida su modelli di email avanzati. Il peggior colpevole è l'aggiunta di elementi di tabella aggiuntivi. La maggior parte dei layout può essere raggiunta con 5-10 tabelle, ma spesso vediamo codice con 30-40 tabelle. Meno tabelle hanno anche il vantaggio aggiuntivo di rendere il tuo codice più facile da leggere.

  • Sposta parte del codice da HTML a CSS. Non è ancora sicuro spostare tutti i tuoi stili in CSS, ma se fatto correttamente spostare alcuni stili inline in stili incorporati può aiutare a ridurre il codice.

  • Semplifica il tuo design. Un'altra opzione è tornare alla fase di design. Le email a colonna singola utilizzano molto meno codice.

  • Minimizza il tuo codice. Minimizzare il codice rimuoverà spazi e commenti non necessari. Questo può avere un enorme effetto, ma fai attenzione poiché molti ESP applicano una lunghezza massima della riga che potrebbe forzare una nuova riga e rompere il codice.


Limiti di dimensione delle email consigliati

Metrica

Limite raccomandato

Dimensione del file HTML (ideale)

≤ 50 KB

Dimensione del file HTML (massima)

100 KB

Dimensione del file immagine (max tipico)

≤ 100 KB

Massimo GIF animato

Fino a 500 KB

Dimensione email completamente caricata (raccomandata)

≤ 1 MB

Impatto del caricamento su reti lente

2–14 sec su 3G; molto più lungo su 2G

La dimensione del file HTML è la dimensione del file .html che viene effettivamente inviato. Questa dimensione del file non include la dimensione delle immagini incluse, poiché queste verrebbero collegate da questo file html e scaricate all'apertura.

La dimensione massima che consiglieremmo è 100KB, poiché qualsiasi cosa oltre può portare a problemi di consegna e visualizzazione. Ad esempio, Gmail taglierà il tuo html a 102KB. Il ritaglio nasconderà la fine della tua email e può rompere il tuo layout. Anche la gestione delle email da parte di Gmail ha altre considerazioni, come l'impatto del prefetching delle immagini sul tracciamento delle email.

La maggior parte delle email dovrebbe facilmente rimanere sotto i 50KB. Tuttavia, a volte miglioramenti progressivi complessi o una grande quantità di contenuti della campagna portano a una dimensione del file più grande. Se ciò accade, ci sono diversi modi per aiutare a ridurre la dimensione del tuo file HTML.

  • Pulisci il tuo codice. Le email cambiano continuamente e vediamo molti modelli con codice obsoleto. Una rapida pulizia può salvare alcuni KB.

  • Non esagerare con il codice. Alcuni modelli che vediamo hanno codice extra che semplicemente non è necessario. Per consigli su come creare modelli efficienti, consulta la nostra guida su modelli di email avanzati. Il peggior colpevole è l'aggiunta di elementi di tabella aggiuntivi. La maggior parte dei layout può essere raggiunta con 5-10 tabelle, ma spesso vediamo codice con 30-40 tabelle. Meno tabelle hanno anche il vantaggio aggiuntivo di rendere il tuo codice più facile da leggere.

  • Sposta parte del codice da HTML a CSS. Non è ancora sicuro spostare tutti i tuoi stili in CSS, ma se fatto correttamente spostare alcuni stili inline in stili incorporati può aiutare a ridurre il codice.

  • Semplifica il tuo design. Un'altra opzione è tornare alla fase di design. Le email a colonna singola utilizzano molto meno codice.

  • Minimizza il tuo codice. Minimizzare il codice rimuoverà spazi e commenti non necessari. Questo può avere un enorme effetto, ma fai attenzione poiché molti ESP applicano una lunghezza massima della riga che potrebbe forzare una nuova riga e rompere il codice.


Limiti di dimensione delle email consigliati

Metrica

Limite raccomandato

Dimensione del file HTML (ideale)

≤ 50 KB

Dimensione del file HTML (massima)

100 KB

Dimensione del file immagine (max tipico)

≤ 100 KB

Massimo GIF animato

Fino a 500 KB

Dimensione email completamente caricata (raccomandata)

≤ 1 MB

Impatto del caricamento su reti lente

2–14 sec su 3G; molto più lungo su 2G

Dimensione delle risorse esterne

La dimensione delle risorse esterne è la dimensione di tutte le tue immagini e dei fogli di stile esterni. Dato che le dimensioni esterne sono rare, ci concentreremo di più sulle immagini per ora.

Se stai utilizzando immagini di sfondo e media query, è possibile che in determinati ambienti non tutto venga scaricato per ogni utente. Ma ricorda che, anche se definisci display:none;  su un elemento <img> , verrà comunque scaricato. Attualmente non c'è modo di fermare questo.

La dimensione massima per la maggior parte delle immagini è di 100KB, ma se hai un'immagine ad alta risoluzione ampia o un gif animato, potrebbe arrivare fino a 500KB. Comprendere i problemi delle performance delle email spesso richiede leggere le intestazioni delle email per la risoluzione dei problemi. Tuttavia, si tratta più della dimensione totale, che tratteremo nella sezione sulla dimensione totale delle email caricate.

Ci sono molte risorse disponibili per aiutare a comprimere le dimensioni delle immagini:

  • ImageOptim – su Mac, o come servizio web

  • Caesium – su Windows

  • CDN –  Molti CDN hanno l'ottimizzazione delle immagini integrata. Alcuni addirittura regoleranno la compressione a seconda della larghezza di banda disponibile.

Ecco alcuni altri consigli che raccomandiamo:

  • Assicurati di utilizzare il formato più appropriato, .jpg per foto, .gif per grafiche e .png quando hai bisogno di canali alfa

  • Semplifica il tuo design. Torna di nuovo alla fase di design per utilizzare meno immagini, immagini più piccole o immagini più semplici che possono essere compresse in dimensioni più piccole.

La dimensione delle risorse esterne è la dimensione di tutte le tue immagini e dei fogli di stile esterni. Dato che le dimensioni esterne sono rare, ci concentreremo di più sulle immagini per ora.

Se stai utilizzando immagini di sfondo e media query, è possibile che in determinati ambienti non tutto venga scaricato per ogni utente. Ma ricorda che, anche se definisci display:none;  su un elemento <img> , verrà comunque scaricato. Attualmente non c'è modo di fermare questo.

La dimensione massima per la maggior parte delle immagini è di 100KB, ma se hai un'immagine ad alta risoluzione ampia o un gif animato, potrebbe arrivare fino a 500KB. Comprendere i problemi delle performance delle email spesso richiede leggere le intestazioni delle email per la risoluzione dei problemi. Tuttavia, si tratta più della dimensione totale, che tratteremo nella sezione sulla dimensione totale delle email caricate.

Ci sono molte risorse disponibili per aiutare a comprimere le dimensioni delle immagini:

  • ImageOptim – su Mac, o come servizio web

  • Caesium – su Windows

  • CDN –  Molti CDN hanno l'ottimizzazione delle immagini integrata. Alcuni addirittura regoleranno la compressione a seconda della larghezza di banda disponibile.

Ecco alcuni altri consigli che raccomandiamo:

  • Assicurati di utilizzare il formato più appropriato, .jpg per foto, .gif per grafiche e .png quando hai bisogno di canali alfa

  • Semplifica il tuo design. Torna di nuovo alla fase di design per utilizzare meno immagini, immagini più piccole o immagini più semplici che possono essere compresse in dimensioni più piccole.

La dimensione delle risorse esterne è la dimensione di tutte le tue immagini e dei fogli di stile esterni. Dato che le dimensioni esterne sono rare, ci concentreremo di più sulle immagini per ora.

Se stai utilizzando immagini di sfondo e media query, è possibile che in determinati ambienti non tutto venga scaricato per ogni utente. Ma ricorda che, anche se definisci display:none;  su un elemento <img> , verrà comunque scaricato. Attualmente non c'è modo di fermare questo.

La dimensione massima per la maggior parte delle immagini è di 100KB, ma se hai un'immagine ad alta risoluzione ampia o un gif animato, potrebbe arrivare fino a 500KB. Comprendere i problemi delle performance delle email spesso richiede leggere le intestazioni delle email per la risoluzione dei problemi. Tuttavia, si tratta più della dimensione totale, che tratteremo nella sezione sulla dimensione totale delle email caricate.

Ci sono molte risorse disponibili per aiutare a comprimere le dimensioni delle immagini:

  • ImageOptim – su Mac, o come servizio web

  • Caesium – su Windows

  • CDN –  Molti CDN hanno l'ottimizzazione delle immagini integrata. Alcuni addirittura regoleranno la compressione a seconda della larghezza di banda disponibile.

Ecco alcuni altri consigli che raccomandiamo:

  • Assicurati di utilizzare il formato più appropriato, .jpg per foto, .gif per grafiche e .png quando hai bisogno di canali alfa

  • Semplifica il tuo design. Torna di nuovo alla fase di design per utilizzare meno immagini, immagini più piccole o immagini più semplici che possono essere compresse in dimensioni più piccole.

Dimensione email completamente caricata

Questa è la dimensione combinata di tutto quando l'email viene aperta e tutto viene scaricato. Questo può variare a seconda dell'ambiente in cui l'email viene aperta.

Il problema principale qui è il tempo necessario affinché l'email si carichi. È probabile che tu stia testando le tue email in un ufficio con una connessione molto veloce, ma molti dei tuoi destinatari potrebbero essere su dispositivi mobili con una connessione 3G lenta.

Con una buona connessione, una dimensione totale dell'email di 1 MB si caricherebbe in una frazione di secondo e sembrerebbe istantanea per l'utente. Tuttavia, su una connessione 3G potrebbe prendere tra i 2 e i 14 secondi per caricare l'email completa. E, se il tuo pubblico target probabilmente utilizza una connessione 2G, quel download potrebbe richiedere un paio di minuti. Quando le email si caricano lentamente, le linee oggetto accattivanti diventano ancora più critiche per l'interazione.

Questo è anche un problema potenziale per gli utenti con piani dati restrittivi che devono considerare ogni MB che scaricano. Questo è particolarmente una considerazione nei paesi in via di sviluppo.

Un paio di cose che puoi fare per aiutare:

In primo luogo, guarda tutte le raccomandazioni che abbiamo menzionato riguardo all'ottimizzazione delle dimensioni di html e immagini
Se hai tempo, è sempre utile sperimentare con il codice e testare ciò che è davvero necessario e cosa puoi omettere. Sperimenta con le immagini e prova diversi modi per comprimerle. Assicurati che la tua email abbia un aspetto gradevole e abbia senso anche senza immagini, in modo che i tuoi utenti possano iniziare a guardare la tua email mentre aspettano il caricamento delle immagini.

Questa è la dimensione combinata di tutto quando l'email viene aperta e tutto viene scaricato. Questo può variare a seconda dell'ambiente in cui l'email viene aperta.

Il problema principale qui è il tempo necessario affinché l'email si carichi. È probabile che tu stia testando le tue email in un ufficio con una connessione molto veloce, ma molti dei tuoi destinatari potrebbero essere su dispositivi mobili con una connessione 3G lenta.

Con una buona connessione, una dimensione totale dell'email di 1 MB si caricherebbe in una frazione di secondo e sembrerebbe istantanea per l'utente. Tuttavia, su una connessione 3G potrebbe prendere tra i 2 e i 14 secondi per caricare l'email completa. E, se il tuo pubblico target probabilmente utilizza una connessione 2G, quel download potrebbe richiedere un paio di minuti. Quando le email si caricano lentamente, le linee oggetto accattivanti diventano ancora più critiche per l'interazione.

Questo è anche un problema potenziale per gli utenti con piani dati restrittivi che devono considerare ogni MB che scaricano. Questo è particolarmente una considerazione nei paesi in via di sviluppo.

Un paio di cose che puoi fare per aiutare:

In primo luogo, guarda tutte le raccomandazioni che abbiamo menzionato riguardo all'ottimizzazione delle dimensioni di html e immagini
Se hai tempo, è sempre utile sperimentare con il codice e testare ciò che è davvero necessario e cosa puoi omettere. Sperimenta con le immagini e prova diversi modi per comprimerle. Assicurati che la tua email abbia un aspetto gradevole e abbia senso anche senza immagini, in modo che i tuoi utenti possano iniziare a guardare la tua email mentre aspettano il caricamento delle immagini.

Questa è la dimensione combinata di tutto quando l'email viene aperta e tutto viene scaricato. Questo può variare a seconda dell'ambiente in cui l'email viene aperta.

Il problema principale qui è il tempo necessario affinché l'email si carichi. È probabile che tu stia testando le tue email in un ufficio con una connessione molto veloce, ma molti dei tuoi destinatari potrebbero essere su dispositivi mobili con una connessione 3G lenta.

Con una buona connessione, una dimensione totale dell'email di 1 MB si caricherebbe in una frazione di secondo e sembrerebbe istantanea per l'utente. Tuttavia, su una connessione 3G potrebbe prendere tra i 2 e i 14 secondi per caricare l'email completa. E, se il tuo pubblico target probabilmente utilizza una connessione 2G, quel download potrebbe richiedere un paio di minuti. Quando le email si caricano lentamente, le linee oggetto accattivanti diventano ancora più critiche per l'interazione.

Questo è anche un problema potenziale per gli utenti con piani dati restrittivi che devono considerare ogni MB che scaricano. Questo è particolarmente una considerazione nei paesi in via di sviluppo.

Un paio di cose che puoi fare per aiutare:

In primo luogo, guarda tutte le raccomandazioni che abbiamo menzionato riguardo all'ottimizzazione delle dimensioni di html e immagini
Se hai tempo, è sempre utile sperimentare con il codice e testare ciò che è davvero necessario e cosa puoi omettere. Sperimenta con le immagini e prova diversi modi per comprimerle. Assicurati che la tua email abbia un aspetto gradevole e abbia senso anche senza immagini, in modo che i tuoi utenti possano iniziare a guardare la tua email mentre aspettano il caricamento delle immagini.

Mettere tutto insieme

Con le dimensioni dei file, come con molte altre cose, tutto si riduce a un compromesso. Potresti fare dei test A/B e scoprire che immagini grandi ad alta risoluzione funzionano bene. Potresti scoprire che molto contenuto dettagliato funziona bene. Potresti scoprire che interattività complessa funziona bene. Tuttavia, quando metti tutte e tre in una singola campagna, potresti vedere che le cose iniziano a funzionare male. I problemi di performance delle email possono anche derivare da problemi di deliverability come errori di battitura negli indirizzi email.

Con le dimensioni dei file, come con molte altre cose, tutto si riduce a un compromesso. Potresti fare dei test A/B e scoprire che immagini grandi ad alta risoluzione funzionano bene. Potresti scoprire che molto contenuto dettagliato funziona bene. Potresti scoprire che interattività complessa funziona bene. Tuttavia, quando metti tutte e tre in una singola campagna, potresti vedere che le cose iniziano a funzionare male. I problemi di performance delle email possono anche derivare da problemi di deliverability come errori di battitura negli indirizzi email.

Con le dimensioni dei file, come con molte altre cose, tutto si riduce a un compromesso. Potresti fare dei test A/B e scoprire che immagini grandi ad alta risoluzione funzionano bene. Potresti scoprire che molto contenuto dettagliato funziona bene. Potresti scoprire che interattività complessa funziona bene. Tuttavia, quando metti tutte e tre in una singola campagna, potresti vedere che le cose iniziano a funzionare male. I problemi di performance delle email possono anche derivare da problemi di deliverability come errori di battitura negli indirizzi email.

Altre notizie

Leggi di più da questa categoria

A person is standing at a desk while typing on a laptop.

La piattaforma completa nativa dell'IA che si espande con la tua azienda.

© 2025 Uccello

A person is standing at a desk while typing on a laptop.

La piattaforma completa nativa dell'IA che si espande con la tua azienda.

© 2025 Uccello