Litmus Live: come mantenere attuale il design delle email

2024-11-07 · Blocks team · 7 min di lettura

Con una media di 333 miliardi di email inviate ogni giorno, l’email marketing diventa un campo piuttosto competitivo. E dato che le email costano poco, è probabile che resteranno con noi ancora per moltissimo tempo. Per questo, se non l’hai ancora fatto, dovresti imparare a creare email di alta qualità.

Oltre al numero di concorrenti, chi si occupa di email marketing può incontrare altre sfide lungo la strada.

Le sfide di chi fa email marketing oggi

Più client di posta e dispositivi che mai. Secondo Statista, nel 2022 gli utenti email sono circa 4,3 miliardi. Significa tantissimi dispositivi e client di posta diversi a cui adattarsi.
Stanchezza da email e soglia di attenzione più bassa.
Preferenze impostate dagli utenti, come la modalità scura. Nel 2020 Android Authority ha condotto una ricerca e ha scoperto che quasi l’82% degli utenti Android preferisce la modalità scura.
Bot automatici selezionano e filtrano le caselle di posta.
Lo spam e le email di phishing sono in aumento. Secondo Statista, a settembre 2021 circa 88,88 miliardi di email su 105,67 miliardi erano spam.
I firewall bloccano o alterano le email per impostazione predefinita.

E questo è solo l’inizio dell’elenco. Non dobbiamo però vederlo come un ostacolo a una campagna email efficace. Al contrario, permette a chi fa marketing di sviluppare le proprie competenze e creare contenuti di prim’ordine.

3 principi di design delle email da rispettare sempre

Il design delle email poggia su tre pilastri:

Accessibilità.
Responsività.
Bellezza.

Vediamoli uno per uno.

Accessibilità. Quando in passato parlavamo di email accessibili, di solito intendevamo che dovevano avere i testi alternativi (alt), essere facili da scorrere e usare font e dimensioni leggibili. Oggi intendiamo anche che le email devono essere concise e ben gerarchizzate, avere un contrasto ottimale e sfruttare lo spazio vuoto.

Responsività. Il requisito principale di un’email responsive era questo: ridimensionarsi e visualizzarsi correttamente con le diverse risoluzioni dei dispositivi. Con l’evoluzione dell’email marketing sono arrivati nuovi requisiti. Oggi le email devono tenere conto della modalità scura, del blocco delle immagini e della visualizzazione ottimale nelle versioni mobile.

Bellezza. Ricorda che, oltre ad attirare lo sguardo, un’email deve essere anche un prodotto completo.

Prima di pensare al design, fai un audit della tua piattaforma email

Con la velocità a cui evolvono oggi le piattaforme email, è facile restare indietro e perdere il controllo. Non vanno avanti solo le piattaforme: va avanti anche la tua azienda. E se la tua azienda attira molti nuovi iscritti, questi possono cambiare in qualche modo le regole del tuo email marketing: per esempio, usare un client di posta diverso da quello a cui sei abituato o preferire i dispositivi mobili al desktop. Tutti questi fattori possono influire direttamente sul design delle email.

Per stare al passo con i cambiamenti, chi fa email marketing dovrebbe fare un audit ogni anno e:

Individuare i client di posta più usati.
Monitorare il rapporto tra utenti desktop e mobile.
Monitorare il rapporto tra indirizzi email gratuiti e aziendali.

Un esempio di audit

Immagina di lavorare nel B2B e di scoprire, dopo l’audit, che la maggior parte dei tuoi utenti:

usa Outlook o Gmail come client di posta.
ha un indirizzo email aziendale.
legge le email da computer desktop.

In questo caso, alcune considerazioni per il design delle email potrebbero essere:

Dai la priorità ai client di posta desktop. Non vuol dire dimenticare del tutto le versioni mobile. Devi solo impegnarti di più per rendere le versioni desktop delle email il più possibile impeccabili.
Firewall (blocco delle immagini). Purtroppo questa situazione non puoi controllarla. Il consiglio migliore è quindi creare email che abbiano senso anche senza immagini.
Client con un cattivo rendering del CSS. Colori, tabelle, pulsanti e altri elementi dell’email possono apparire diversi da come li avevi pensati. Ed è molto importante tenerne conto quando progetti un’email.

Cosa tenere a mente quando progetti modelli di email HTML

Le tabelle: pensare dentro gli schemi

Le tabelle sono la base di un design email solido e responsive, perché:

sono il modo di rendering più uniforme (rispetto a float, padding, margini e allineamento). Le informazioni si recepiscono più facilmente quando sono organizzate in tabella. Immagina che nell’esempio qui sotto non ci fossero le barre orizzontali: sarebbe difficile orientarsi nell’email.

un esempio di design di modello di email che contiene una tabella

sono più facili da progettare e controllare su mobile: le colonne diventano righe. Rispetto al CSS, le tabelle HTML funzionano bene nei client di posta e non stravolgono il tuo bel layout.

Ottimizzare per il testo

Come buona pratica, evita di usare immagini per trasmettere testo e pulsanti. Le immagini vengono spesso bloccate o non vengono scaricate. Se combini testo e immagine, l’offerta principale resta leggibile anche quando l’immagine viene bloccata. Ed è la cosa migliore che possiamo fare per raggiungere il maggior numero possibile di clienti.

Inoltre:

le media query o il ridimensionamento automatico aiutano a visualizzare meglio il testo su mobile.
i pulsanti HTML si adattano alla modalità scura e risaltano più delle immagini.

Un’offerta con testo e immagine e una solo immagine, con le immagini bloccate: resta leggibile solo quella con il testo vero

Nel primo esempio gli utenti possono comunque leggere l’offerta, incuriosirsi e visitare il sito per saperne di più. Nel secondo no, e perdono ogni possibilità di conoscere l’offerta e fare un acquisto. Una situazione in cui perdono tutti, sia l’utente sia l’azienda.

Quali tipi di immagini usare nel tuo modello di email

PNG

È un formato di immagine molto utile per un design innovativo e per aggirare un CSS imprevedibile.

Permette effetti di stile come:

Trasparenza/sfumatura

Un’email di Sensei in cui una foto PNG sfuma nello sfondo bianco con una sfumatura trasparente

Ombre esterne

Un esempio di modello di email con un PNG con ombre esterne

Le immagini PNG si possono anche tagliare per separare le sezioni dell’email, soprattutto nei passaggi tra colori di sfondo diversi.

È utile per creare una separazione visiva, mettere in evidenza le informazioni e migliorare la leggibilità.

un esempio di design di modello di email che usa un PNG per la separazione visiva

Le GIF non sono più un formato da evitare:

sono preferibili a Flash, che i client di posta non hanno mai supportato e che è stato del tutto dismesso.
i loop creano un’animazione continua. Se fai tutto bene, gli utenti non si accorgeranno nemmeno che la GIF si ripete.
meno colori = file più leggeri, quindi le tue email si scaricano più in fretta.

Un esempio di modello di email con una GIF

Anche le illustrazioni digitali sono un must nel design delle email del 2022. Un’illustrazione digitale è un’opera creata con strumenti digitali. Non confonderle con le foto ritoccate: le illustrazioni digitali nascono da zero.

Hanno questi vantaggi:

sono versatili: si possono scalare, modificare e riutilizzare facilmente. Così dedichi molto meno tempo alla creazione dei contenuti visivi per le tue email.
trasmettono l’identità del brand anche quando gli elementi CSS sono imprevedibili. Gli elementi CSS possono cambiare colore (e rovinare la tua idea originale), mentre le illustrazioni digitali restano uguali in qualunque client di posta i tuoi iscritti leggano le email.

Per sfruttare al meglio le illustrazioni digitali, segui questi consigli:

Aggiungi stile con ombre esterne, contorni o padding (se in JPEG). La tua illustrazione digitale sembrerà più realistica.
Scegli colori a tono medio, così le immagini non si confondono in modalità scura. In questo modo saranno splendide in qualunque modalità l’iscritto legga la tua email.

un esempio di illustrazione digitale di un computer in un modello di email

Il CSS (Cascading Style Sheets) è la parte di codice che nelle email HTML serve a cambiare il design: font, colori, padding e così via. È uno strumento molto comodo ma insidioso, perché in alcuni client il CSS può essere visualizzato in modo errato e trasformare la tua email in qualcosa di diverso, come nell’esempio qui sotto.

come cambiano in modalità scura, nei client di posta, i colori del brand definiti con il CSS

Per questo devi stare attento e testare le email che contengono CSS in diversi client di posta, così eviti brutte sorprese.

Punti chiave

Dai la priorità alle esigenze dei client di posta dei tuoi iscritti e progetta di conseguenza. Non perdere tempo con ciò che si rivela inutile.
Ottimizza tempo e risorse (costruisci modelli solidi per i casi d’uso ricorrenti). Così avrai più tempo per altre attività importanti.
Accogli e adattati ai cambi di paradigma nel mondo delle email, come la responsività e la modalità scura. Devi stare al passo con i tempi perché le tue email restino attuali.
Sentiti libero di formare i team di sviluppo e di design, perché porti informazioni e competenze fondamentali. Ricorda che avete tutti lo stesso obiettivo e dovete lavorare insieme per raggiungerlo.

Litmus Live è una conferenza di marketing che dura 2 giorni e riunisce tantissimi esperti di digital marketing. Abbiamo preso appunti durante l’intervento di Ali Mahad, «Accessible, Responsive, and Beautiful Email Design in 2022», ci abbiamo aggiunto qualche numero e qualche idea nostra e ne abbiamo fatto un articolo che ti aiuterà a orientarti nel design delle email.

Crea un modello di email in Blocks e prova queste tecniche!

Se vuoi saperne di più su altre conferenze e fiere di email marketing, leggi il nostro articolo sulle conferenze di email marketing del 2023.