I migliori caratteri per e-mail: suggerimenti e trucchetti per l'utilizzo

Una delle preoccupazioni maggiori durante il processo di realizzazione di una email è la scelta del carattere giusto. Dimensione, colore, forma, spaziatura... Conta tutto? Sì, ma una delle cose fondamentali è quella di scegliere un carattere leggibile.

In questo post, ti mostreremo come scegliere il carattere più professionale per le tue email.

Progettate email eleganti con Stripo in pochissimo tempo grazie ai nostri modelli precostituiti

Sfoglia

 

Caratteri nelle e-mail HTML: regole generali da seguire

Ci sono tre regole di base da tenere a mente quando si sceglie il miglior carattere per le email:

1. Non utilizzare mai più di 2 caratteri nelle e-mail

Se usi troppi caratteri, la tua email apparirà molto complicata nel migliore dei casi e fastidiosa nel peggiore dei casi. Scegli solo uno o due caratteri per e-mail. In molti casi, è sufficiente utilizzare un solo carattere con dimensioni diverse: uno per evidenziare l'intestazione e un altro per il resto del contenuto.

2. Evita di utilizzare più di 2 stili di carattere nelle e-mail

Non mischiare stili di carattere standard, grassetto e corsivo nelle e-mail. Se ne usi più di due, le e-mail appariranno un po' disordinate. Normalmente, un singolo stile di carattere è sufficiente . Se vuoi evidenziare alcune parole, puoi applicare lo stile del carattere in grassetto.

Ma non sottolineare mai il testo e non applicare mai il carattere corsivo per motivi di accessibilità delle e-mail 

3. Presta molta attenzione alla leggibilità del carattere scelto

La caratteristica principale del carattere dei tuoi contenuti è la leggibilità. La leggibilità è la capacità di distinguere una lettera dall'altra. Naturalmente, il testo leggibile è migliore e più veloce da leggere, quindi controlla se tutti i caratteri sono visibili, chiari e sufficientemente distintivi.

Qual è il carattere più leggibile? L’esperimento sulla leggibilità dei caratteri è stata condotta da Norbert Schwarz e Hyunjin Song nel 2010. I risultati sono stati impressionanti. E’ necessario quasi il doppio del tempo a leggere lo stile del carattere corsivo e i caratteri decorativi rispetto a quelli standard:

A proposito di leggibilità... Ci sono due tipi principali di carattere: Serif e Sans Serif. Vediamo quale carattere utilizzare per le email newsletter.

Quale scegliere: carattere Serif o carattere Sans Serif?

I caratteri tipografici influiscono anche sulla leggibilità dei caratteri delle email. Qual è la differenza tra loro?

I caratteri “Serif” possono essere definiti come caratteri che hanno una piccola linea alla fine di ogni carattere. I caratteri serif più popolari sono Times New Roman e Georgia.

I caratteri “Sans Serif” sono quelli che non hanno una linea decorativa alla fine di ogni simbolo. I caratteri Sans-Serif più popolari sono Arial, Trebuchet MS e Helvetica.

Durante la ricerca, ho trovato diverse fonti che affermavano che i caratteri Serif sono i più adatti per le e-mail, ma non sono assolutamente d'accordo. Partendo dal presupposto che le e-mail vengono osservate solo online utilizzando uno desktop o dispositivi mobili, i migliori caratteri sono Sans Serif. È più facile leggere i caratteri Sans-Serif sullo schermo.

Caratteri garantiti per le email 

Ecco l'elenco dei primi 10 caratteri che puoi utilizzare con una garanzia del 100% che verranno visualizzati perfettamente nelle caselle di posta elettronica degli utenti proprio come pianificato:

1. Arial

Progettato nel 1982, è presente in tutte le versioni di Microsoft, a partire da Windows 3, e Apple Mac OS X. Visualizzato da tutti i client di posta elettronica. A causa dei tagli diagonali terminali, appare meno meccanica rispetto ad altri caratteri della famiglia sans-serif.

2. Helvetica

Un carattere sans-serif, uno dei caratteri più utilizzati, possiede lettere arrotondate e larghe maiuscole. Progettato nel 1957

3. Times New Roman

Possiede lettere minuscole alte, leggermente condensate, brevi discendenti e ascendenti. Commissionato da “The Times” nel 1931.

4. Verdana

È stato progettato per essere leggibile su schermi a bassa risoluzione, la sua caratteristica principale sono i caratteri minuscoli alti e larghi.

5. Courier / Courier New

È stato progettato nel 1955, simile al Times New Roman, ma adattato per essere un carattere a spaziatura fissa. Courier New ha punti e virgole più pesanti rispetto al Courier originale. Courier è il carattere standard utilizzato per la sceneggiatura nell'industria cinematografica.

6. Tahoma

È simile a Verdana ma ha lettere più strette, contatori piccoli e una spaziatura stretta tra le lettere. Usato come carattere predefinito per lo schermo nelle versioni di Windows 95, 2000 e XP.

7. Georgia

Ha lettere minuscole alte, i trattini sono più spessi della media, i suoi numeri si fondono perfettamente con il testo grazie alle simili dimensioni.

8. Palatino

È stato originariamente progettato per intestazioni, pubblicità e stampa. Più ampio di altri caratteri serif vecchio stile.

9. Trebuchet MS

Ha l’estremità più corta per alcune lettere, in grassetto le sue lettere sono appuntite piuttosto che arrotondate e punti arrotondati in minuscolo. Rilasciato nel 1996.

10. Ginevra

Una versione ridisegnata di Helvetica, la sua principale distinzione è che ha un set di legature di base.

Si dice che questi caratteri siano i caratteri di posta elettronica più leggibili. 

Caratteri personalizzati nelle e-mail

Ci sono casi in cui desideri o hai bisogno di utilizzare un carattere personalizzato per le tue e-mail, per mantenere la coerenza del marchio o per rendere le tue e-mail più festive per un'occasione speciale.

Vogliamo ricordarti che puoi caricare caratteri personalizzati al tuo account Stripo e usarli nelle tue campagne email. 

Ti consigliamo vivamente di visualizzare in anteprima queste e-mail in diversi client. Puoi farlo con il nostro strumento test integrato.

Nota importante:

Se un client di posta elettronica non supporta un determinato carattere, quest'ultimo verrà sostituito con uno predefinito. 

Ecco l'elenco dei caratteri predefiniti per i client di posta elettronica più popolari:

• iCloud Mail utilizza Helvetica come carattere predefinito;

• Gmail adotta Arial;

• Microsoft Outlook nelle versioni più vecchie usa spesso Calibri;

• Outlook 2007/2010/2013 utilizza Times New Roman come carattere predefinito.

Dimensione del carattere nelle email

Non esiste una dimensione del carattere migliore per le email, poiché molto spesso caratteri diversi hanno altezze dei simboli diverse. Di conseguenza, lo stesso carattere, diciamo, di dimensione 16 px sarà diverso a seconda della scelta del tipo di carattere.

Ho creato un modello di email con Stripo che consente di confrontare diversi caratteri della stessa dimensione. Dai un’occhiata ai risultati:

Scegli quello che ti piace e utilizzalo in tutte le e-mail in modo che le tue newsletter siano sempre leggibili e coerenti con il marchio.

Ti consigliamo di impostare i caratteri e le dimensioni dei caratteri solo quando inizi a progettare il tuo modello di email: le impostazioni verranno applicate all'intera email. Ciò ti farà risparmiare una grande quantità di tempo in quanto non dovrai impostare i caratteri per ogni parte delle tue e-mail.

Sapevi che Stripo consente di impostare diverse dimensioni dei caratteri per dispositivi mobili e desktop? Ad esempio, utilizzi 14 pixel per le e-mail aperte su desktop e 16 pixel per le e-mail aperte su dispositivi mobili.

Impostazione della dimensione del carattere per i desktop

• entra nella scheda Aspetto;

• vai alla sezione Impostazioni generali;

• scegli un carattere dal menu a tendina. Anche i caratteri personalizzati, che hai precedentemente aggiunto al tuo profilo Stripo, appariranno in questo elenco;

• imposta l'interlinea;

• nella sezione “Stripes”, imposta una dimensione del carattere diversa per ogni parte della tua email (esclusi i banner) e il colore del carattere;

• nella sezione Intestazioni, devi scegliere di nuovo un carattere: potrebbe anche essere uno diverso. Qui puoi anche impostare la dimensione del carattere per i titoli 1, 2 e 3;

• nella sezione Pulsante, imposta il colore del carattere del pulsante e la sua dimensione.

Prova Stripo

Impostazione della dimensione del carattere per i dispositivi mobili

• entra nella scheda Aspetto;

• vai alla sezione Formattazione dispositivi mobili;

• imposta la dimensione del carattere per intestazioni, piè di pagina, aree di contenuto, schede menu e pulsanti.

Interlinea per le e-mail

L'interlinea è la distanza verticale tra le righe del testo. Viene misurata come percentuale della dimensione del carattere.

Puoi impostare la spaziatura desiderata per le tue e-mail solo nelle schede e nelle sezioni in cui hai impostato le dimensioni dei caratteri.

Alcune fonti affermano che il 150% è la migliore dimensione dell'interlinea. 

Ma secondo le Linee guida per l'accessibilità alle email, varia tra il 150% e il 200%.

(e-mail con interlinea singola)

(e-mail con interlinea 1,6)

Link nelle e-mail

Non utilizzare un carattere diverso per attirare l'attenzione dei lettori sui link. Non mettere mai link senza testo. Il testo deve spiegare dove conduce questo collegamento ed essere organicamente parte del testo. Non utilizzare le parole "qui" o "link" come testo. Sono troppo brevi e troppo generici per essere degni di un click.

Una delle migliori soluzioni in questo caso è creare collegamenti dello stesso colore di un logo. Sembra fantastico, dai un'occhiata:

(Fonte: e-mail da Epilepsy Foundation)

Puoi anche sottolineare i collegamenti delle tue e-mail se lo ritieni necessario o se corrisponde al design dell'e-mail.

Tuttavia, si consiglia vivamente di non sottolineare mai i collegamenti per motivi di accessibilità e-mail — distrae i dislessici.

Caratteri per i pulsanti nelle e-mail

I pulsanti sono come dei link ma hanno una forma più interattiva per gli utenti. È meglio usare entrambi nella tua email. Se fornisci un link che porterà i lettori ad un post del blog, puoi renderlo un link di testo, ma se fornisci un link per provare il prodotto che hai, usa semplicemente i pulsanti.

Non c'è una regola precisa sul colore da usare nei pulsanti ma è meglio affidarsi alla psicologia del colore e cercare di non rovinare il concetto di design con una riproduzione dei colori troppo forte.

Lo stesso vale per i caratteri dei pulsanti: nessuna regola specifica. Devi solo assicurarti che i testi dei pulsanti siano sufficientemente leggibili.

Il colore del testo deve corrispondere al colore del pulsante e assicurarsi che sia sufficientemente visibile per la lettura. Controlla anche se il testo si trova correttamente all'interno del pulsante, non deve fuoriuscire dai bordi del pulsante.

Ecco un esempio in cui il pulsante appare interessante:

(Fonte: Modello email Stripo)

Nota importante:

Puoi aggiungere uno spazio bianco nei pulsanti con Stripo in modo che ci sia dello spazio tra il testo e i bordi dei pulsanti. Questo accorgimento li rende più leggibili.

Quindi, come si fa? Lavora su "Internal padding" nella scheda Pulsante.

Puoi anche impostare una dimensione del carattere diversa per i pulsanti e-mail nella visualizzazione per dispositivi mobili.

Come farlo:

• vai alla scheda Aspetto;

• vai alla scheda Formattazione dispositivi mobili;

• imposta la dimensione del testo del pulsante — per rendere leggibile il testo del pulsante sui dispositivi mobili. 16px o superiore è la dimensione migliore;

• attiva o disattiva il pulsante "Pulsanti a larghezza intera" per rendere i pulsanti più larghi sui dispositivi mobili. Le probabilità che i clienti notino i pulsanti a larghezza intera sono molto più alte.

Testo sui banner

Qui c'è la possibilità di usare caratteri festivi o decorativi che in realtà non dovresti usare come carattere del testo principale. Poiché il testo sopra un banner è parte di un'immagine, rimarrà lo stesso in tutti i client di posta elettronica. E ci si aspetta che sia abbastanza festoso. Quindi puoi sceglierne uno qualsiasi.  

Tieni presente che è meglio scegliere un carattere leggibile. E che non si deve scrivere un testo troppo lungo su un banner. Rendilo breve.

Quale usare dipende dalla tua ispirazione e dal design dell'email.

Utilizzo di caratteri decorativi su banner per e-mail con Stripo

• quando l'immagine del tuo banner viene caricata e modificata, fai click sull'icona "Testo" sopra il modello per iniziare a lavorare sulla copia del pulsante;

• inserisci la tua copia nella sezione "Caption" dei tuoi banner;

• quindi evidenzia il testo del banner e scegli il carattere del banner desiderato dall'elenco a tendina.

Unisciti a Stripo

Colore del carattere delle e-mail

Ci sono solo 2 regole che devi seguire:

1. Riduci al minimo il numero di colori

Devi usare solo i colori che identificano il tuo marchio. Se hai in mente l'idea di utilizzare più di 3 colori nella tua e-mail, mettila da parte perché questo renderà il testo illeggibile e la tua e-mail disordinata.

Se vuoi evidenziare una frase o una parola, usa semplicemente un carattere in grassetto, utilizzando un colore diverso si risulta ambigui.

Esempio di una buona combinazione di colori nelle e-mail.

(Fonte: e-mail da Victoria's Secret)

2. Usa colori a contrasto

Se hai intenzione di usare colori vivaci - molti di noi lo fanno quando si tratta di vacanze - assicurati di usare colori a contrasto. Non posizionare testo rosso su pulsanti verdi, non utilizzare bianco su grigio. Può sembrare abbastanza festoso per le persone che hanno una buona vista. Tuttavia, le persone daltoniche potrebbero non trovare leggibile il nostro testo.

Comunemente per i contenuti delle email, i designer utilizzano i colori nero o grigio scuro. Risulta migliore per la leggibilità. L'unica eccezione è quando hai uno sfondo nero. In questo caso, usa un carattere bianco. Non utilizzare un carattere grigio chiaro su uno sfondo bianco perché rende difficile leggere le tue e-mail.

Tag HTML per la formattazione del testo

Quegli e-mail marketer che preferiscono i realizzatori di e-mail possono formattare i testi direttamente con esso. 

Coloro che preferiscono codificare le e-mail da zero potrebbero aver bisogno di quanto seguie :

• di rendere il testo in grassetto:

<strong> text here </strong> or <b> text here </b>

• degli elenchi puntati:

<ul>

    <li> point 1 </li>

    <li> point 2 </li>

    <li> point 3 </li>

</ul>

• di rendere il testo in corsivo:

<i> text here </i> or <em> text here <em>

• di utilizzare lo stesso carattere di dimensioni inferiori:

<small> text here </small>

• di evidenziare il testo con riempimento giallo (per impostazione predefinita):

<mark> text here </mark>

• e questo ti permette di definire un paragrafo:

<p> text here </p>

Testi da destra a sinistra nelle e-mail

Oltre 550 milioni di persone parlano lingue che utilizzano la scrittura da destra a sinistra. Il testo RTL è molto più che una semplice inversione delle parole.

Ad esempio, non devi invertire numeri, parole straniere, ecc. Tutti i segni di punteggiatura che normalmente si mettono alla fine della riga, effettivamente la inizieranno. Non ci addentreremo qui nei dettagli. Ma puoi familiarizzare con tutte le linee guida del testo RTL nel nostro post sul blog "Testo da destra a sinistra". 

Mostriamo anche come attivare l'opzione RTL con Stripo, in modo da poter utilizzare gli script RTL nelle tue e-mail senza la necessità di competenze di programmazione.

Linee guida per l'accessibilità alle email

In poche parole, dovremmo considerare queste linee guida per diversi motivi:

• consentire alle persone daltoniche di leggere le nostre e-mail;

• consentire alle persone con disabilità visive di ascoltare le nostre e-mail con lettori di schermo;

• consentire ai nostri utenti che sono estremamente impegnati e che controllano le loro e-mail mentre guidano o cucinano o chiedono a Siri di "leggere" le loro email in arrivo, di ascoltare le nostre e-mail;

• consentire ai dislessici di leggere le nostre e-mail, poiché molte delle persone che soffrono di dislessia non ne sono consapevoli, ma leggere testi non adatti è abbastanza insopportabile per loro. 

Quindi, ecco le linee guida per rendere accessibile il testo della tua email:

1. Considera il contrasto di colore.

2. Rendi i tuoi testi allineati a sinistra per una più facile percezione dell'e-mail da parte dei dislessici — evita i testi allineati al centro.

3. Aggiungi sempre segni di punteggiatura alla fine di ogni elenco puntato. Sì, potrebbe essere contro le regole grammaticali, ma così facendo rendiamo le nostre e-mail più leggibili e rendiamo più felice almeno un destinatario.

4. Mantieni la dimensione del carattere di almeno 14 pixel.

5. Non sottolineare i testi.

6. Evita il corsivo. Se hai bisogno di evidenziare una parte del tuo testo, usa solo il grassetto!

7. Non usare tutte maiuscole!

Per ulteriori informazioni, consultare il nostro post sul blog "Accessibilità delle e-mail".

Qual è il miglior carattere da utilizzare per le email newsletter?

Non esiste il miglior carattere per Gmail, il miglior carattere per Outlook e qualsiasi altro client di posta elettronica. Dipende dalla lingua che parli. Di conseguenza, osiamo dire che le preferenze variano da paese a paese a causa delle caratteristiche linguistiche.

Dai vari esperimenti fatti dal team di marketing di eSputnik è risultato che i migliori caratteri per le e-mail per i paesi di lingua russa sono Arial e Tahoma. Arial è il carattere più utilizzato tra coloro che organizzano campagne di email marketing in russo. Tahoma ha un bell'aspetto sia nelle e-mail ricche di contenuti che nei testi di piccole dimensioni.

Helvetica è il carattere più popolare tra i paesi di lingua inglese. Arial occupa il 2° posto.

Per scegliere quello più leggibile secondo te, in base alle caratteristiche dell'alfabeto, puoi testare tutti i caratteri per email consigliati come abbiamo fatto noi. Puoi anche chiedere ai tuoi amici e colleghi di aiutarti con questo test.

Ho creato un modello email con l'editor Stripo con lo stesso testo e la stessa dimensione di 18px per ogni carattere.

Quindi, ecco i risultati, confronta questi caratteri e scegli quello più adatto alle tue esigenze:

Conclusioni

Considerando tutto quello che abbiamo detto, possiamo concludere dicendo che non ci sono caratteri per le email dall'aspetto professionale che siano leggibili e abbiano un bell'aspetto su tutti i tipi di dispositivi. Devi sempre scegliere:

• Georgia e Times New Roman sono troppo ristretti;

• Courier New è ampio ma forse anche troppo ampio per le email;

• Arial è più chiaro di Helvetica;

• è impossibile distinguere i caratteri Verdana e Tahoma.

Oltre a scegliere il carattere giusto per le e-mail, dobbiamo rendere accessibili le nostre e-mail attenendoci alle linee guida sopra menzionate.