best practice Posts

E-mail e stili CSS

Un interessante articolo scritto da Alessandro Fulciniti per html.it spiega come utilizzare gli stili nella realizzazione di e-mail in html.

Lo stesso autore segnala un articolo in inglese in cui vengono pubblicate delle tabelle di compatibilità (file pdf) degli stili con le principali web mail e con i più utilizzati client di posta.

I consigli e le tecniche consigliate sono molto interessanti e dell’utilizzo degli stili in linea ne avevo già parlato anch’io qualche tempo fa.

Nella mia esperienza ho avuto modo di constatare che l’unico modo per rendere il più possibile compatibile un’e-mail con client e web mail è quello di utilizzare i tag html.

Se da una parte questa soluzione non permette molti virtuosismi grafici, rendendo molto rigida la scelta dei caratteri, soprattutto per quanto riguarda le dimensioni, dall’altra garantisce che il messaggio non subisca grosse variazioni nella formattazione.

I link nelle e-mail in html

Nella realizzazione delle e-mail in formato html è utile tenere presente un piccolo, ma fondamentale accorgimento che riguarda i link.

Quando si inserisce un link in una e-mail è sempre consigliabile mettere nel codice l’attributo target ed assegnargli il valore _blank.

Se è vero che qualsiasi client di posta elettronica apre una finestra del browser quando si clicca un link contenuto in una e-mail, non sempre questo accade con le web mail.

L’esempio principale è la posta di libero che apre il messaggio in un frame. In questi casi, l’assenza dell’attributo target con valore _blank, porterebbe all’apertura della pagina di destinazione del link nel frame di libero, con tre conseguenze principali:

1. Difficoltà di navigazione del sito di destinazione
2. Compromissione dell’immagine del sito che si intende promuovere
3. Rischio di perdere l’attenzione del destinatario che non riuscendo a navigare potrebbe chiudere la finestra.

Rendiamo leggibili le e-mail in html

Inviando e-mail in formato html è possibile che il messaggio inviato non venga visualizzato correttamente. Lo stesso codice che nel browser appare perfetto, potrebbe essere completamente illeggibile se visto con i client di posta.

Essere sicuri della corretta formattazione di una e-mail in html non è facile perché non esistono standard universali per l’html nella posta elettronica. Alcuni accorgimenti possono però essere utili per rendere il più compatibile possibile il nostro messaggio.

Non essere classista
Il primo accorgimento è quello di evitare i fogli di stile. Per formattare il testo è consigliabile utilizzare stili in linea o i tag html. Anche se i fogli di stile ci permettono soluzioni grafiche migliori, spesso vengono ignorati dai client di posta o dalle web mail tipo hotmail, compromettendo in tal modo l’aspetto del messaggio.

Il background è importante
Utilizzare colori e immagini di sfondo può essere rischioso perché spesso non vengono correttamente visualizzati. Il problema è evidente soprattutto quando ad un colore di sfondo viene associato il colore del testo sopra stante. Il consiglio in questi casi è quello di utilizzare sempre sfondi chiari e font del testo scuri in modo da rendere sempre visibili i contenuti. Utilizzando infatti font di colore chiaro su sfondi scuri si potrebbe verificare l’ipotesi che. non venendo visualizzato lo sfondo. il testo rimanga su sfondo bianco e quindi non leggibile.

Html valido
I client di posta sono molto più sensibili dei browser per quanto riguarda l’interpretazione del codice. Un codice validato facilita la corretta visualizzazione dell’e-mail. Inoltre, il corretto utilizzo dell’html limita il rischio che l’e-mail venga filtrata dai sistemi antispam.

Gli effetti speciali solo sul sito, grazie!
Evitare di inserire nelle e-mail script, flash e form che vengono bloccati dai client. Se volete stupire i vostri contatti, cercate di condurli sul sito web.

Le informazioni essenziali vanno scritte
Non inserire testi e contenuti rilevanti nelle immagini. Queste infatti vengono sempre bloccate dai principali client di posta che ne impediscono la visualizzazione al destinatario.
Se vengono inserite delle immagini nell’e-mail bisogna avere cura che il messaggio sia comunque leggibile a prescindere dalla loro visualizzazione.

Questi sono alcuni consigli utili per realizzare una buona e-mail in formato html. Una volta realizzata non resta che testarla con quanti più client di posta possibili, con la visualizzazione delle immagini abilitata o disabilitata, inviando e-mail di prova ai principali provider

Email Marketing: un piccolo consiglio

Utilizzare al meglio gli spazi offerti dalla finestra di anteprima dei client di posta consente di incrementare i tassi di apertura e lettura delle email da parte dei destinatari.

Gli utenti che hanno l’anteprima del messaggio abilitata valutano dagli elementi in essa contenuti la rilevanza o meno del messaggio. Catturare subito l’attenzione dell’utente è fondamentale per mantenere il suo interesse vero il resto dell’email.

Bisogna saper sfruttare questo spazio per convincere il lettore che il contenuto è interessante, rilevante e fornire delle valide motivazioni per fargli leggere anche il resto del messaggio. In pochi secondi il lettore deciderà se continuare nella lettura o cestinare il messaggio, bisogna quindi sfruttare al massimo questo tempo.

In testa la messaggio è consigliabile inserire sempre:

  1. Il nome della newsletter o mailing list;
  2. Nome e logo aziendale;
  3. Numero della pubblicazione;
  4. Data;
  5. Sommario dei contenuti;
  6. Titolo rilevante;
  7. Il link al sito web.

Se il sommario è breve (ed è consigliabile che lo sia) si possono inserire dei brevi richiami all’articolo, avendo cura che la lettura possa proseguire in pochi click. E’ inoltre fondamentale non inserire oggetti nel sommario che non siano facilmente reperibili all’interno dell’email.

E’ anche possibile inserire, in testa all’email, degli inviti a compiere delle azioni (“call to action”) inserendo elementi grafici cliccabili che portano a offerte speciali o approfondimenti.

E’ molto importante testare ciò che appare nel riquadro di anteprima con quanti più client di posta possibili per verificare che quanto appare sia in linea con quello che vogliamo che appaia.

Da evitare assolutamente

I testi molto lunghi e poco chiari che trasmettono una sensazione di pesantezza e sicuramente scoraggiano la lettura;

I contenuti e le pubblicità di terze parti che trasmettono una sensazione troppo commerciale dell’emai;

Una promozione esagerata dei propri prodotti o servizi in quanto solitamente i destinatari di newsletter e email amano ricevere pubblicità, ma soprattutto contenuti rilevanti ed interessanti. E’ quindi necessario trovare il giusto equilibrio tra informazione e promozione.