Guida all’Email Design: come rendere perfette nell’aspetto le tue newsletter dall’oggetto al footer

Desideri migliorare il rendimento delle tue campagne di email marketing e aumentare il tasso di click all’interno delle tue DEM e newsletter? È giunto allora il momento di capire come ottimizzare il design delle email.

Un buon design non è pensato solo per l’appeal visivo, ma anche per rendere il messaggio chiaro e fruibile al lettore. È studiato per aiutarti a costruire relazioni più forti con il pubblico, a vendere di più e a migliorare il ritorno complessivo sull’investimento nell’email marketing.

In parole povere, per avere successo con l’email marketing, hai bisogno di email ben progettate e di newsletter con un bel design.

Non occorre essere maestri del design. La notizia è che puoi realizzare delle belle newsletter e a gestire delle campagne DEM efficaci in pochi semplici passi. Tutto quello di cui hai bisogno è seguire queste 15 regole di newsletter design. Parleremo di layout, font, colori, immagini, CTA, criteri di accessibilità e usabilità mobile e molto altro.

Creare un template per le tue email, dopo aver letto questa guida, non sarà più la stessa cosa.

0. Prerequisiti di email design

Per email o newsletter design intendiamo la progettazione e la creazione di email da un punto di vista visivo e funzionale. In questa guida, pertanto, dedicheremo spazio alla costruzione di un template email valido per una campagna di email marketing.

Se invece desideri comprendere come creare una newsletter da un punto di vista operativo (scelta del programma giusto, impostazioni di condivisione e tracciamento e oltre) puoi leggere la nostra precedente guida: Come creare e inviare una newsletter | Guida completa step by step

L’obiettivo dell’email design è quindi quello di creare messaggi di posta elettronica che siano visivamente attraenti, facili da leggere e che incoraggino gli utenti a compiere un’azione specifica, come cliccare su un link o effettuare un acquisto. Sono diversi gli elementi da curare in questo ambito: colori, immagini, tipografia, layout dei contenuti, formattazione. Inoltre, la email deve essere responsive e leggibile dall’incipit al footer, su tutti i dispositivi e client di posta elettronica. Non ultimi, non vanno ignorati gli aspetti di usabilità e accessibilità.

Lo sapevi? Con il newsletter creator di GetResponse puoi risparmiare tempo sul design della tua email, senza rinunciare alla qualità. Merito di oltre 150 template per newsletter professionali e pronti all’uso, a un editor drag-and-drop molto pratico e ad altre funzionalità avanzate che ti consentono di consegnare le tue campagne email direttamente nella casella di posta elettronica del tuo pubblico. Puoi testare i template e inviare le tue prime newsletter gratuitamente. Scopri tutti i template per l’email marketing

Tuttavia, il design di una email inizia ancora prima che la stessa email venga letta. Parte tutto dalla casella di posta elettronica.

Ci sono tre elementi principali di una newsletter o DEM che il pubblico vedrà prima di decidere se cliccarci e leggerla: nome mittente, oggetto e intestazione. Per questo, dedicheremo i primi consigli per analizzare questi tre elementi, per poi passare alle singole specifiche che deve avere il template di una newsletter: in particolare layout, regole di spaziatura, scelta del font e criteri di accessibilità e usabilità mobile.

Per aiutarti a capire meglio ognuno degli elementi, useremo questo modello di email che abbiamo creato per una nostra newsletter immaginaria dedicata ai content creator. 🙂

1. Guadagna fiducia con il nome del mittente

L’obiettivo primario quando si scrive il nome del mittente è quello di informare il destinatario della provenienza del messaggio. Ma non è tutto. Il nome del mittente ha anche il potere di rinforzare la riga dell’oggetto e la preintestazione, aumentando così i tassi di apertura generali.

Affinché questo accada, il nome del mittente deve essere riconoscibile e affidabile, e non può assolutamente essere ingannevole. A condizione che gli iscritti abbiano già avuto esperienze positive con il tuo brand, saranno più inclini ad aprire messaggi con il nome del mittente accanto ad esso.

Cosa mettere nel nome del mittente

Ci sono diversi modi per costruire il nome del mittente. Ecco alcuni dei modelli pi+ usati che potresti seguire (con esempi):

• [Nome dell’azienda] – GetResponse
• [Nome della persona] di [Nome della società] – Linda di GetResponse
• [Nome dell’azienda] [Nome del messaggio o dell’argomento] – Newsletter GetResponse
• [Nome del reparto] + [Nome dell’azienda] – GetResponse Marketing
• [Nome della società] Team/Funzioalità/Ruolo – GetResponse Team
• [Nome del dipendente] – Gianpiero Spelozzo

Consiglio extra: Per migliorare ulteriormente tasso di consegna e l’immagine di brand, assicurati un bel dominio email personalizzato con il nome della tua azienda o sito web (nel formato nome.cognome@tuosito.com) anziché il classico gmail.com o similari.

2. Attira l’attenzione con l’oggetto

Proprio come un buon trailer di un film, l’oggetto della mail deve essere interessante, divertente, coinvolgente e fornire informazioni sufficienti a convincere i tuoi destinatari ad aprire la e-mail. E poiché le caselle di posta elettronica tendono ad essere molto affollate, è necesario distinguersi in qualche modo rispetto alla concorrenza.

Consigli di stile per l’oggetto delle email

Ecco gli elementi da utilizzare nella riga del tuo oggetto per renderlo più riconoscibile in una casella di posta in arrivo:

1. Personalizzazione (ad esempio il nome del destinatario)
2. Numeri
3. Emoji
4. Parole potenti
5. Domande
6. Giochi di parole
7. Idiomi
8. Termini relativi al tuo brand

Allo stesso tempo, evitare quanto segue:

1. Scrivere le righe del soggetto in maiuscolo
2. Uso di punteggiatura eccessiva
3. Utilizzando RE:, FW: e altre frasi che possono indurre il destinatario a pensare che si tratti di una comunicazione personale
4. Uso di frasi comunemente associate allo spam
5. Ingannare in qualsiasi modo le persone per far aprire le email

Quanto deve essere lungo l’oggetto

Quando si usano troppi caratteri nell’oggetto si rischia di risultare tagliati in alcuni provider di posta elettronica. A causa di questo problema, il messaggio può perdere di impatto e significato. Per essere sicuri che il tuo messaggio venga recepito, la regola è quella di mantenere l’oggetto relativamente breve (meno di 60 caratteri).

Tuttavia, non è obbligatorio ridurre le parole. Anzi, le statistiche sull’email marketing in Italia dimostrano come le righe d’oggetto più efficaci non seguono la regola del “tienilo breve”. Quelle che vantano il tasso medio di apertura maggiore sono proprio quelle più lunghe (in particolare dai 241 ai 250 caratteri)

Dopotutto, se puoi già vantare abbastanza credibilità, il tuo pubblico non si preoccuperà del numero eccessivo di caratteri.

Utilizzo di emoji nell’oggetto dell’email

Le emoji sono sicuramente un importante elemento di email design, ma è sempre una buona idea includerle nell’oggetto? Finora non c’è un opinione comune.

L’ultima analisi sul mercato italiano delle email dimostra che il tasso di apertura è più alto nelle email che contengono le emoji nell’oggetto (di circa 5 punti percentuale). D’altro canto il trend internazionale suggerisce l’esatto opposto e dimostra come gli utenti trovino meno professionali email contenenti le emoji

Noi siamo personalmente appassionati dell’uso delle emoji. Nel tuo caso, è importante testare e vedere se un’aggiunta di questo tipo ben si sposa con il tono della comunicazione e le esigenze del tuo pubblico di riferimento.

Personalizzare l’oggetto dell’email

La personalizzazione è un espediente abbastanza comune per rendere l’oggetto più efficace. Il più delle volte viene usata per mostrare il nome del destinatario o qualche altra specifica, come il nome dell’azienda o la sua posizione. In uno scenario più sofisticato, potresti creare linee tematiche completamente diverse in base ai comportamenti dei tuoi contatti.

Ad esempio, se sai che il tuo cliente ha già acquistato uno shampoo per capelli ricci o una tintura speciale per capelli, potresti fare riferimento al loro tipo o colore di capelli nell’oggetto dell’email.

I dati a nostra disposizione, ancora una volta, suggeriscono che la personalizzazione del campo dell’oggetto porta buoni risultati sia in termini di aperture che di click. Ma, come sempre, la soluzione migliore è testare in base al target di riferimento.

Personalizzazione nell’oggetto	Tasso di apertura	Tasso di click	Click-to-open rate
SÌ	33.16%	2.71%	8.18%
NO	28.34%	2.10%	7.40%

3. Aggiungi il testo di intestazione

L’ultimo scoglio, prima di passare al design vero e proprio della email, è il cosiddetto preheader, anche noto come testo di snippet.

Il preheader è spesso considerato un elemento secondario e non sempre è inserito all’interno di una DEM o di una newsletter. Eppure, sorprendentemente, aiuta le aperture dei messaggi.

Il sottotitolo funziona e vale la pena la pena integrarlo in una strategia di email marketing. Per esempio, l’aggiunta di un link come “visualizza questo messaggio online” nel preheader non richiederà molto sforzo e potrà aiutare il pubblico a visualizzare correttamente la newsletter, anche quando le immagini vengono automaticamente bloccate dal loro client di posta elettronica. Minima impresa, massima resa!

Consigli di stile per creare un buon preheader

Qui il gioco è semplice. Devi pensare al preheader come all’estensione dell’oggetto. Una possibilità bonus per fornire ulteriore valore che non hai potuto inserire precedentemente.

L’approccio migliore è quello di creare questi due elementi in coppia, in modo che il preheader completi con l’oggetto. Ne parlo anche nei miei 15 consigli operativi di email marketing, tutti consigli ispirati a dati concreti.

Ecco qualche ottimo esempio:

• Oggetto dell’email: Tutto in sconto. In Vendita su tutto il sito. Solo ora.
• Preheader testo: E’ il nostro compleanno 🎉 Sconti personalizzati + Spedizione & Restituzioni gratuite per festeggiare!

• Oggetto della mail: Ora o mai più!
• Preheader: Mancano solo 8 ore alle offerte del Cyber Monday

Quanto deve essere lunga l’intestazione

Una cosa da tenere a mente è che può essere difficile stimare quanto del preheader sarà visibile nel client di posta elettronica, come puoi anche osservare in questa immagine qui sotto.

Dipenderà dal client di posta elettronica, dal dispositivo utilizzato dal destinatario e dalla lunghezza della riga dell’oggetto. Per questo motivo, assicurati che il messaggio più importante sia posizionato all’inizio del preheader e non alla fine.

4. Mantieni un design coerente con il tuo brand

Per rafforzare il rapporto con i tuoi destinatari, assicurati che i tuoi email template corrispondano all’identità visiva del brand.

Ciò significa che logo, immagini, font, colori e pulsanti per le call to action devono essere coerenti con quanto già presente sul sito web e su altri canali di marketing.

Se stai ancora lavorando su un’identità visiva coordinata, puoi considerare questi bei suggerimenti:

• Crea uno schema di colori utilizzando colori complementari. Potresti generarli utilizzando uno strumento chiamato Coolors (gratis). Da qui ricavare un set specifico di colori da usare per i singoli elementi come le intestazioni, le CTA e il testo.
• Scegli massimo due font che stanno bene insieme (di questo parleremo più avanti) e utilizzali in tutte le email. Uno per i titoli e uno per il testo principale e le CTA.
• Non complicare eccessivamente il template. Assicurati che sia semplice, esteticamente piacevole e riconoscibile.
• Cerca ispirazione online sui migliori esempi di newsletter e da altri siti.

Il logo aziendale

Aggiungere il logo della tua azienda può ovviamente aiutarti a far distinguere il tuo brand da tutti gli altri mittenti che i destinatari vedranno nella loro casella di posta elettronica.

Di solito, nel template di una email si aggiunge il logo nella parte superiore del messaggio – al centro o nell’angolo a sinistra. Alcuni email marketer amano anche mettere il loro logo nel piè di pagina, proprio sopra la sezione disclaimer e i link di cancellazione.

Avrete anche notato che in alcuni client di posta elettronica, il logo appare accanto al nome del mittente, come nell’immagine qui sotto:

Questa funzione non è pienamente supportata da tutti i provider di email, ma alcuni di quelli più famosi hanno già iniziato ad usarla.

Per poter mostrare il logo nelle applicazioni di posta elettronica come Gmail, il tuo dominio deve essere ospitato da G Suite, mentre se stai utilizzando un servizio esterno (come un software di email marketing come GetResponse), dovrai assicurarti che il dominio sia autenticato con un DKIM personalizzato. Quando questi due requisiti sono soddisfatti, il logo dovrebbe essere visibile nell’ambiente Gmail.

Ora puoi mostrare il logo anche nei provider di posta elettronica Oath, (Yahoo!, AOL, ecc.). Questo è dovuto al nuovo metodo di autenticazione chiamato Brand Indicators for Message Identification (BIMI). Questo metodo è ancora in fase beta, e pertanto è supportato solo da alcuni provider di posta elettronica, ma è probabile che venga ripreso da altri servizi di questo tipo nel prossimo futuro.

Consiglio extra: GetResponse offre DKIM personalizzato gratuitamente – puoi imparare facilmente a impostarlo e a ottimizzare al meglio le tue email.

5. Mostra la tua offerta con un header di impatto

Far aprire la tua email è solo il primo passo. Per far sì che gli utenti clicchino sulla tua offerta, devi farli entrare e farli scorrere nel tuo messaggio. Un ottimo modo per ottenerlo è fare un buon uso della sezione dell’intestazione, quello che comunemente viene chiamato above-the-fold, tutto ciò che l’utente vede senza fare nessuno scroll.

L’intestazione di un’email viene utilizzata principalmente per riassumere l’offerta principale di un determinato messaggio. Si trova nella parte superiore del corpo dell’email e può essere un’immagine, un testo o un mix di entrambi. Un’intestazione efficace deve essere distintiva, comunicare chiaramente di cosa tratta il messaggio e dare una buona ragione per continuare a leggere.

Ecco alcuni elementi consigliati da utilizzare nel design dell’intestazione della tua email per ottenere questi risultati:

• marchio e/o logo;
• menu o barra di navigazione;
• un titolo potente che riassume l’offerta principale;
• una CTA che porta al tuo sito web;
• qualcosa di interessante o allettante che cattura immediatamente l’attenzione.

Inoltre, se si sceglie di creare un’intestazione con immagine, assicurati di fornire sempre il testo ALT per rendere il messaggio più impattante per gli iscritti che hanno immagini bloccate nella loro casella di posta elettronica.

Ecco un esempio di un’intestazione di email che segue diverse delle pratiche sopra menzionate:

1. Ha il logo aziendale ben visibile in cima al messaggio
2. Titolo audace e intrigante con sottotitolo
3. Un’immagine intrigante al centro
4. Un fumetto che rafforza l’interesse suscitato dal titolo

Come integrare il Menu di navigazione

A volte può capitare di dover includere un menu di navigazione in cima all’intestazione della DEM. Questa è una tattica usata principalmente nell’ambito dell’e-commerce marketing che può aiutare a portare più click verso le aree nuove o su molteplici offerte e promozioni in evidenza sul tuo sito web.

Questa sezione può essere particolarmente utile se si tiene traccia dei click in ogni singola voce del menu, perché può aiutare a segmentare meglio il pubblico e anche a innescare sequenze di email automatizzate nel caso stiate operando con l’automazione delle email.

Qualora decidessi di integrare un menu di navigazione, assicurati di controllare anche la risoluzione in tutte le tipologie di dispositivi. Una casella di posta elettronica ha solo una larghezza limitata e copiare semplicemente la barra dei menu di un sito web potrebbe non essere l’approccio migliore.

Consiglio extra: Se vuoi approfondire quali campagne di email marketing funzionano meglio per un negozio online, potresti leggere la nostra guida aggiornata all’email marketing per e-commerce

6. Usa le immagini in maniera intelligente

Immagini belle, grandi e coinvolgenti contano in tutti gli aspetti del marketing, comprese le email. Quando scegli la grafica per una campagna email, dovrai fare i conti con questi aspetti:

• Da dove si possono ricavare le immagini? (stock, su misura, licenza aperta)
• Quale formato usare? (.jpg, .png, .gif)
• Quanto spazio nella email occuperà l’ immagine?
• Cosa fare quando le immagini vengono bloccate nella casella di posta del destinatario?

Immagini stock o immagini personalizzate?

Quando si tratta di scegliere tra immagini stock e immagini personalizzate, non c’è un modo giusto o sbagliato di procedere. Assicurati solo che l’approccio scelto si adatti all’identità di brand complessiva e aiuti a creare la giusta atmosfera per il tuo stile comunicativo.

Qual è il giusto formato di immagine? (.jpg, .png, .rgb)

Quando si tratta di formattare le immagini la situazione cambia. Naturalmente vorresti mostrare immagini di alta qualità che presentano l’offerta nel miglior modo possibile, ma devi anche tenere presente la dimensione dei file di immagine.

In generale, più pesanti sono i file e più difficile sarà consegnarli alle caselle di posta dei contatti. Pertanto, ogni volta che arricchisci il design di una email con le immagini, assicurati che queste siano ottimizzata per il web.

Consigliamo di mantenere i formati .jpg e .png e ottimizzare la risoluzione delle immagini con qualche strumento di ottimizzazione immagini online.

Qual è il giusto rapporto immagine-testo?

Quando si creano newsletter, si dovrebbe anche prestare attenzione a quanto del messaggio è occupato da immagini rispetto al testo.

L’equazione è semplice: più testo è presente, migliore sarà la deliverability. Più spazio all’interno della tua email è occupato dalle immagini, più difficile sarà per te raggiungere la casella di posta elettronica.

Ciò non vuol dire che le email non debbano contenere immagini. Non è fattibile, sopratutto in ambito e-commerce dove è importante mostrare l’immagine in alta qualità dei prodotti. Ma l’email non dovrebbe consistere di una sola grande immagine e un piè di pagina.

Cosa fare quando le immagini vengono bloccate?

Quando progetti una newsletter, considera che molti utenti non hanno il download automatico delle immagini attivato attivato nel loro provider di posta.

Cosa fare in questo caso? Prima di tutto, assicurati di conciliare questi due ingredienti: testo ben strutturato e immagini con l’attributo ALT compilato.

L’aggiunta dell’attributo ALT ha un altro vantaggio, che è anche il motivo principale per cui dovreste utilizzarlo. Se alcuni dei Destinatari utilizzano uno screen reader per scoprire le tue mail, l’attributo ALT li aiuterà a capire cosa c’è all’interno del tuo contenuto.

Ecco come si presenta un’email composta solo da immagini che non vengono caricate e senza testo alternativo. Non ti fa venire molta voglia di cliccare, vero?

Integrare GIF conviene?

Un modo per aumentare i tassi di conversione di una campagna email è quello di aggiungere brevi GIF ai messaggi. Il loro supporto è quasi universale e molti di noi si divertono a condividerli su Slack, Facebook o Instagram.

Quando usate le GIF, fate attenzione alle dimensioni. Potrebbe essere allettante condividere animazioni lunghe e di alta qualità, ma queste possono impattare in maniera significativa sulla deliverability e richiedere molto tempo prima di essere caricate davanti agli occhi dei destinatari.

Consigli extra per le immagini

Se stai usando l’editor email di GetResponse per realizzare le newsletter e personalizzare il design delle tue email:

• Aggiungere le GIF alla tua email funziona come se stessi aggiungendo una normale immagine statica. In GetResponse, questo è ulteriormente semplificato grazie all’integrazione con GIPHY.
• Hai a disposizione oltre 5000 immagini stock gratuite di Shutterstock da personalizzare e utilizzare all’interno delle tue campagne email.
• Assicurati di ottimizzarle prima con il nostro strumento di editing delle immagini. Basta aprire l’immagine come nella GIF qui sotto e salvarla, e verrà automaticamente compressa per meglio adattarsi alle esigenze dei provider.

7. Utilizza i video per aumentare il coinvolgimento

Non c’è niente di meglio dei video per coinvolgere l’utente di una newsletter. Purtroppo, i client di posta elettronica sono ancora in ritardo rispetto alle tendenze e il supporto video è limitato a solo una manciata di provider di cassette postali (come Apple Mail, Outlook per Mac e Thunderbird).

Ciò non significa che non sia possibile inviare video via email. È possibile, ma l’approccio più sicuro è quello di utilizzare una miniatura (un’immagine statica o un gif con un pulsante play) e collegarla tramite un link a una piattaforma esterna per usufruire del video.

Questo approccio, seppur all’apparenza macchinoso, garantisce che tutti i destinatari delle tue newsletter potranno vedere il video. Inoltre, quando cliccano sulla miniatura il video si aprirà nell’applicazione o nel browser di loro scelta: sicuramente un ottimo espediente in termini di esperienza utente.

Consiglio professionale: Aggiungere video di YouTube alle email è molto facile con GetResponse. Tutto quello che devi fare è copiare l’URL del video e inserirla, e automaticamente verrà una miniatura con un pulsante play da utilizzare. Stando a un nostro recente studio, inoltre, i video di YouTube nelle email garantiscono un tasso di coinvolgimento e click medio superiore rispetto alla media.

8. Cura lo stile di link e CTA (Calls-to-action)

La maggior parte delle campagne di email marketing contengo link per indirizzare al sito o a una landing page indipendente. Se vuoi avere maggiori click sulle tue email, devi utilizzare le CTA.

Idealmente, ci deve essere una sola call to action principale nella email che indirizzerà l’attenzione degli utenti e i click verso l’offerta principale. Potresti inserire anche CTA secondarie, purché non distolgano troppo l’attenzione dall’obiettivo di marketing principale.

Per rendere efficace tale call to action, devi curarne attentamente lo stile. Idealmente, dovresti utilizzare un colore contrastante e avere molto spazio bianco intorno al pulsante. In tal modo, i destinatari non solo potranno vederlo, ma anche toccarlo con il pollice o il dito.

Le CTA potrebbero essere parte di un’immagine più grande (nell’intestazione per esempio) o essere create separatamente.

Oltre a prestare attenzione al design delle CTA nelle email, dovresti anche interessarti al testo. L’approccio standard è quello del “Compra ora” o “Ordina oggi” o “Iscriviti subito”. ma se il caso lo consente, perché non provare un approccio leggermente più descrittivo: “Prova questo maglione”, “Preordina questo gioco”.

Tracciamento link e UTM

Non solo CTA. Ti potrebbe capitare di inserire collegamenti ipertestuali all’interno del corpo delle email anche nelle vesti di semplice link testuale.

Se stai costruendo email in HTML, puoi collegare con i link qualsiasi cosa – un pezzo di testo, un’immagine (anche una GIF), o un pulsante per la call to action. in questo caso, il client di posta elettronica del tuo destinatario capirà che si tratta di un URL e lo collegherà automaticamente tramite un hyperlink.

Uno dei vantaggi principali dell’utilizzo delle email HTML è la possibilità di utilizzare il tracciamento. Le due metriche principali di email marketing che si possono tracciare sono le aperture dei messaggi e i click sui link.

Il click-tracking si ottiene utilizzando un url aggiuntivo dai inserire nei link contenuti nella email. In questo modo, se qualcuno clicca su uno dei tuoi link, puoi tenere traccia del suo percorso effettuato dopo il click.

Per avere ulteriori informazioni, potresti aggiungere parametri UTM ai link così da tracciare le campagne email direttamente nell’account di Google Analytics e ricavare preziose informazioni sul comportamento e le preferenze degli iscritti.

9. Non sottovalutare l’aspetto del Footer

Ultimo ma non meno importante è il piè di pagina, un’altra parte importante del template.

La stragrande maggioranza degli email marketer utilizza il piè di pagina in modo piuttosto generico, includendo solo gli elementi che sono tenuti a includere per legge (come le informazioni aziendali e un link per la cancellazione dell’iscrizione) e le icone dei social media collegate ai profili aziendali.

Tuttavia, è possibile essere più creativi con il design del footer di un’email e utilizzarlo per costruire un’esperienza positiva del brand e raggiungere ulteriori obiettivi. Per esempio:

• Enfatizzare la proposta di vendita
• Raccogliere i feedback del pubblico
• Promuovere il blog, podcast o altri contenuti
• Promuovere un’offerta speciale visibile solo ai fan più accaniti
• Promuovere la tua app, link utili e numeri di telefono
• Mostrare il lato più umano del tuo business

Ecco alcuni esempi di ottimi piè di pagina di e-mail da cui vale la pena trarre ispirazione:

10. Scegli un layout email ottimale

Il layout è fondamentale per due ragioni. In primis, dovrebbe aiutare i tuoi destinatari a usufruire del contenuto del messaggio con facilità e nel giusto ordine. In secondo luogo, influenzerà le successive scelte di stile e design della newsletter.

Ci sono diversi layout popolari che puoi utilizzare per strutturare le tue comunicazioni via email.

Layout mono-colonna

In un layout a una colonna tutti i contenuti delle vostre email sono inseriti verticalmente in successione. Si tratta di un approccio semplice che garantisce la migliore resa mobile e un’ottima risoluzione sui diversi dispositivi. Un layout ottimo per concentrare l’attenzione su un’unica offerta.

Layout a piramide invertita

La struttura a piramide invertita rende ancora più facile “pilotare” i click degli utenti. Posizionando il contenuto più ampio (di solito l’intestazione o un banner) in alto e il contenuto più sottile in basso (la call to action), gli occhi degli utenti vengono automaticamente indirizzati nella parte della email preposta alle conversioni. Come nell’esempio sottostante.

Layout a Zig-zag

Questo è un altro interessante layout che porta l’attenzione degli utenti da un lato dello schermo all’altro, mentre scorrono il messaggio. Si tratta di un modello molto accattivante, ottimo se stai realizzando una newsletter in cui mostri i tuoi prodotti e li accompagni con brevi descrizioni e CTA.

Piccolo avvertimento! Se ogni elemento del messaggio è un blocco separato, l’ordine di visualizzazione potrebbe essere differente a seconda del dispositivo. In particolare su mobile, descrizione e pulsante CTA potrebbero sovrapporsi con l’immagine, a scapito della leggibilità complessiva.

Layout a due colonne

Il layout a due colonne è spesso utilizzato dai brand che si concentrano sull’uso delle immagini. Il più delle volte comprende un’ampia intestazione a una sola colonna in alto – con l’offerta o il prodotto principale – e diversi blocchi sottostanti divisi in due colonne.

È una sorta di mix tra la disposizione a una colonna e quella a zig-zag che abbiamo descritto in precedenza. Per questo motivo, include alcuni dei pro e dei contro di questi layout. Lo svantaggio principale è che quando un messaggio a due colonne viene visualizzato su un dispositivo mobile, i blocchi vengono impilati uno dopo l’altro.

In GetResponse è possibile regolare l’ordine dei blocchi per i dispositivi mobili separatamente. Ti basta cambiare il pulsante “Invertire le colonne sui dispositivi mobili” e i vostri blocchi appariranno in modo diverso rispetto a quanto accade su desktop. Grazie a questo accorgimento, i tuoi template saranno perfetti su qualsiasi dispositivo.

11. Rispetta sempre queste regole di email design

Quanto deve essere larga l’email?

Se vuoi assicurarti una resa ottimale sulla maggior parte dei dispositivi, mantieni la larghezza dell’email sui 600 px (max 640 px).

All’inizio può sembrare contro-intuitivo, soprattutto perché i nostri schermi stanno diventando sempre più grandi, ma tieni presente che non tutti i client di posta elettronica funzionano allo stesso modo. Molte caselle di posta elettronica visualizzeranno il messaggio in una cornice circondata da sezioni e schede aggiuntive. Come in questo esempio del nostro client web Gmail

Quanto deve essere lunga l’email?

A differenze della larghezza, qui non esistono linee guida chiare su quanto debbano essere lunghe le email. Dipende sicuramente dalla tipologia di campagna e di messaggio. Alcuni marketer preferiscono progettare i loro modelli di email in modo che siano brevi e veloci, conducendo direttamente al loro sito web. Altri preferiscono trasmettere quante più informazioni possibili e lasciare che sia l’email stessa a parlare.

Se la tua newsletter consiste principalmente di testo, probabilmente non tutti gli utenti scorreranno troppo in basso nel messaggio. Molti blogger adottano comunque questo approccio per diffondere i loro contenuti, ma potrebbe non essere l’ideale se stai cercando di vendere prodotti via e-commerce.

Se invece la newsletter è composta da diverse immagini, allora un messaggio troppo lungo potrebbe portare ad essere troncato da ISP più grandi come Gmail. Questo può influenzare la percezione generale del messaggio. Keep it in mind!

Regole di spaziatura e padding

Come vist, il template di una email può essere costituito da molti blocchi e sezioni diverse: intestazione, caselle di testo, immagini, CTA e piè di pagina. Tutti questi elementi devono combaciare tra loro, ma ci deve essere anche un po’ di “aria” tra di loro.

Il cosiddetto “spazio bianco” rende la lettura di una email molto più facile e scorrevole. E come tale, influisce sulle conversioni. Non esiste un spaziatura precisa o un padding appropriato.

Una buon padding laterale potrebbe attestarsi sui 20-30 px per blocco. In tal modo, quando l’email viene visualizzata su un dispositivo mobile, il testo non è bloccato sul bordo dello schermo.

Per il padding superiore e inferiore, di solito usiamo da 10 a 20px tra ogni elemento o sezione. Questo ci aiuta a dare un po’ di “respiro” e rende le nostre e-mail più leggibili.

Ogni volta che configuri il tuo modello di email, assicurati di controllare come si comporta su diversi dispositivi e client di posta elettronica. Quello che ha un bell’aspetto su desktop potrebbe non avere lo stesso effetto sui dispositivi mobili.

12. Rendi le tue email Responsive e Mobile First

Il modo migliore per garantire che tutti i tuoi destinatari abbiano un’esperienza ottimale con le tue email è quello di ipotizzare un design adatto in primis per il mobile. Oltre la metà degli utenti, d’altronde, consulta la posta elettronica da smartphone

Non serve entrare troppo nel dettaglio sul come codificare un’email per il mobile. I tool per la creazione newsletter come GetResponse, permettono di creare modelli che si adattano a tutti i tipi di dispositivi senza dover scrivere una sola riga di codice.

Come progettare un’email dal design mobile responsive

Ci sono almento 5 buone pratiche da tenere a mente in fase di progettazione:

1. Assicurati che il testo sia leggibile. Considera di aumentare l’interlinea e la dimensione dei caratteri a 14-16 px per il testo normale e 22 px per i titoli.
2. Assicurati che link e CTA possano essere facilmente cliccabili. Nella maggior parte dei casi, considera circa 44 x 44 px (minimo 29 x 44 px) di spaziatura.
3. Includi un padding extra tra le CTA per rendere più facile i click. Aggiungi 10-20 px di spazio extra intorno alle aree cliccabili per facilitare il clic.
4. Assicurati che anche la landing page sia ottimizzata per i dispositivi mobile. Mandare le persone su una pagina che non ha un bell’aspetto sul loro cellulare sarebbe una perdita di denaro e potrebbe rendere vano l’ottimo lavoro fatto per l’email.
5. Testa e verifica sempre l’aspetto del tuo messaggio sui diversi dispositivi prima di inviarlo a tutti. Vale sempre la pena di ribadire, quello che potrebbe avere un bell’aspetto su un desktop potrebbe non avere la stessa resa su smartphone.

13. Scegli font appropriati

Sviscerato ogni aspetto di email design strutturale, è tempo di pensare allo stile. Innanzitutto devi scegliere un font adatto al web e ai client di posta elettronica.

I font scelti definiscono il look-and-feel delle tue email. Anche se ci sono centinaia di migliaia di font disponibili sul web, non tutti sono adatti alla comunicazione via email. Due in particolare le soluzioni ottimali.

1. I font di sistema sono i tipi di font che possono essere visualizzati su tutti i dispositivi o all’interno di qualsiasi applicazione – e avranno sempre lo stesso aspetto. Tra questi ci sono Georgia, Times New Roman e Verdana.
2. I font per il web, invece, pur essendo ampiamente supportati, a volte possono essere resi in modo diverso sul dispositivo del destinatario. Alcuni di quelli più popolari sono Roboto, Lato e Montserrat.

Ecco perché la soluzione migliore è quella di: 1) attenersi ai font di sistema, oppure 2) utilizzare i font web come primari e avere a un font di sistema di riserva che verrà visualizzato nel caso in cui il font personalizzato non possa essere utilizzato.

Idealmente, ti consigliamo di utilizzare solo due diversi font nella costituzione della newsletter (uno per l’intestazione e uno per il testo principale e i CTA). Per trovare i font che funzionano bene insieme, potresti provare a utilizzare Fontpair o Google Fonts.

14. Utilizza un copywriting avvincente e personale

Nella costituzione di una email, design grafico e stile di scrittura vanno a braccetto. Scrivere un testo per le email è un argomento a sé stante e si potrebbe scrivere un intero ebook su di esso. Ed è infatti qualcosa che abbiamo fatto. “Come scrivere una Newsletter efficace: 10 consigli per un copywriting perfetto“. Ti aiuterà ad aumentare le tue aperture, i clic e le conversioni. In altre parole, renderà le tue campagne email più efficaci.

A parte i consigli di scrittura, tieni a mente che le persone spesso non passano troppo tempo sulle email. Per questo motivo, devi mantenere il testo conciso e diretto al punto. Potresti beneficiare di elenchi puntati, titoli, e sottolineare le parti più importanti con il corsivo.

Come personalizzare testo e design di una email

Anche la personalizzazione è un fattore che rende il testo di un’email più convincente e gradevole. Ne abbiamo già parlato brevemente all’inizio della guida, in materia di oggetto. Ma come si personalizza un messaggio di posta elettronica in generale?

Questo avviene attraverso l’uso di contenuti dinamici, una sintassi che permette di decidere essenzialmente quale tipo di contenuto verrà visualizzato da un determinato iscritto alla tua lista. Nella forma più semplice, si potrebbe scrivere qualcosa come [[nome]] e questo mostrerebbe il nome del contatto all’interno del messaggio.

I casi d’uso più avanzati di contenuti dinamici ti consentirebbero di confezionare messaggi completamente diversi (in termini di testo, immagini, link e CTA) in base alle informazioni sui clienti che hai memorizzato nel vostro database.

In tal modo, potesti mostrare un numero diverso di punti accumulati da un iscritto a un programma fedeltà. Oppure potresti mostrare un diverso set di prodotti che determinati utenti hanno guardato sul sito web o che hanno acquistato in passato.

Secondo i dati globali, le email che utilizzano la personalizzazione nel corpo del testo hanno un tasso medio di click-through del 19%, il che è molto elevato rispetto alla media. Nonostante ciò, sono soprattutto le aziende più grandi (o quelle con una maggiore attenzione al marketing) a fare uso della personalizzazione.

Questo è dovuto in gran parte al fatto che molti marketer non hanno abbastanza dati per personalizzare le loro email, né tantomeno il tempo e lo sforzo per personalizzare la loro comunicazione su larga scala.

15. Rispetta i criteri di accessibilità

Ricorda che il pubblico di una campagna di email marketing è quasi sempre etereogeneo. ciò vuol dire che tutti possano accedere alle tue email e comprenderle.

Secondo l’Organizzazione Mondiale della Sanità, oltre 2,2 miliardi di persone vivono con una qualche forma di disabilità visiva. È probabile che alcuni dei tuoi iscritti ne siano affetti. Ecco pertanto alcune regole di accessibilità da non dimenticare:

• aggiungi sempre il testo ALT alle immagini. In questo modo le persone che usano gli screen reader saranno in grado di capire meglio il contenuto;
• fai attenzione al contrasto delle immagini e dei colori – ad esempio, il testo bianco su sfondo giallo può essere difficile da leggere;
• usa una dimensione ragionevole dei caratteri (tipicamente 14-16 px) con una spaziatura delle linee decente;
• fornisci uno spazio bianco sufficiente tra le diverse sezioni e gli elementi;
• attieniti ai font leggibili;
• assicurati che il contenuto delle newsletter sia leggibile, idealmente ad un livello di Grado 6. Strumenti come l’Hemingway Editor ti aiuteranno a valutarlo.
• utilizza un testo ipertestuale che dice al pubblico cosa vedrà cliccando sul link. Non utilizzare frasi generiche come “clicca qui”.
• se devi enfatizzare un’informazione, non farlo solo con il colore.

Conclusioni

L’email marketing non è morto. Ma è evoluto così tanto che negli ultimi anni sono cambiate le regole del gioco in tutti gli aspetti collegati: email design incluso.

GetResponse ha saputo interpretare al meglio questi cambiamenti, sviluppando all’interno del suo software uno strumento di creazione newsletter all’avanguardia. Provare per credere… e per risparmiare – dato che la prova è gratuita per 30 giorni!

Crea gratis la tua newsletter più bella >

Vuoi vedere come funziona? Ecco un breve video tutorial per te.