Grace & Partners è una società di consulenza aziendale e servizi tecnologici per il Marketing. Sfruttando le competenze acquisite in ambito di consulenza e interactive marketing Grace & Partners supporta i clienti nell'innovazione di tutti gli aspetti del loro business con Idee Persone e Progetti. Le Idee più Innovative, le Persone Giuste ed i Progetti Migliori.
Top

Come creare email design responsive?

Grace & PartnersStandard Business Come creare email design responsive?
email design responsive

Come creare email design responsive?

Quasi metà delle email, oggi, viene aperta da mobile.  Un trend che oggi conosciamo tutti e che è sempre più supportato dai dati. Abbiamo già parlato di come il mobile scandisca la nostra giornata, tanto da indurre Google a passare dal desktop first index al mobile first index. Si capisce allora quanto sia fondamentale l’ottimizzazione dell’email, la sua capacità di essere responsive e perfettamente visualizzabile da smartphone e da tablet, in altre parole assicurare una email design responsive.

 

Cosa si intende per email design responsive

 

Il principio è semplice: il contenuto del messaggio si adatta alla larghezza dello schermo, secondo regole dettate dalle media query CSS.

La soluzione si affida a una serie di regole innescate dall’effettiva dimensione dello schermo:

  1. i contenuti si riorganizzano e ridispongono in modo da risultare ben fruibili in tutti i contesti;
  2. la dimensione del font, delle CTA e delle immagini si adatta in modo intelligente alle dimensioni dello schermo, garantendo una leggibilità e una cliccabilità ottimale anche sugli schermi più piccoli;
  3. il ridimensionamento viene gestito cambiando le proporzioni degli elementi in base alla media query rilevante.

Per riassumere, una email design responsive fornisce la miglior risposta al mobile e assicura che ogni device visualizzi una versione differente del messaggio, ottimizzata proprio per quella specifica dimensione.

 

I layout (mobile oriented) per le email

 

Se per le visualizzazioni da desktop ogni orientamento può essere adottato, per il mobile il cerchio si restringe di molto.

Ad imporlo è la verticalità che caratterizza visualizzazione e fruizione delle email su smartphone. Possiamo dire che la mobile responsiveness ammette uno al massimo due tipologie di layout.

  1. Layout a colonna singola:

costituito da uno o più moduli che riempiono l’intera larghezza dell’email, tutti impilati uno sopra l’altro.

Vantaggi: facilità di lettura, grazie alla gerarchia ben definita, dall’alto in basso in base all’importanza e priorità del contenuto. Disposizione narrativa che asseconda lo storytelling, accompagnando il destinatario nella lettura dei contenuti.

  1. Layout ibrido:

molti brand inviano email con un header principale in alto e contenuti secondari in più colonne parallele sottostanti. Si tratta di un layout ibrido che passa da una colonna singola a colonna multipla.

Vantaggi: funzionale alla gerarchizzazione, poiché il primo modulo (a colonna unica) marca la sua preminenza. Funzionale alla call-to-action multipla, offrendo il maggior grado di flessibilità.

 

Call-to-action: posizione e specifiche tecniche

 

La maggior parte di noi, quando apre l’email non sa bene cosa fare. È necessario quindi indicarlo, in modo forte e chiaro. Lo strumento fondamentale per farlo è la call-to-action, ben strutturata, chiara ed evidente, a maggior ragione su mobile.

Ecco allora alcune best practice.

  1. Rendi il bottone visibile all’apertura – C’è un modo preciso con cui i destinatari interagiscono con lo smartphone e le email. Una sola mano, il pollice che agisce sullo schermo, le altre dita che sorreggono il device.

Per questo la posizione ottimale per il bottone è nella parte superiore dello schermo, visibile senza nemmeno uno scroll.

  1. Gioca con il bottone – Ci sono anche brand che giocano con l’elemento della call-to-action. C’è addirittura chi ironizza sulla best practice, collocando provocatoriamente il bottone lontano dall’header di apertura. Un gioco che, se a prima vista può sembrare disfunzionale, hai il grande pregio di creare engagement, interazione.
  2. Crea un bottone bulletproof – Bulletproof significa “antiproiettile” e, nell’email design, indica un elemento grafico scritto in HTML, la cui visualizzazione non può “rompersi” in nessuna circostanza. Il vantaggio? Viene visualizzato e funziona correttamente in qualsiasi casella di posta, non trattandosi di un’immagine.
  3. Non creare bottoni testuali – Molte email che vediamo in giro presentano un bottone di call-to-action testuale. Si tratta però di un’opzione non consigliabile in ottica mobile, dal momento che una stringa di testo (seppur ben evidenziata con colore e bold) risalta troppo poco nell’insieme.

Fonte: ninjamarketing

Nessun Commento

Lascia un commento

Utilizzando il sito, accetti l'utilizzo dei cookie da parte nostra. maggiori informazioni

Questo sito utilizza i cookie per fornire la migliore esperienza di navigazione possibile. Continuando a utilizzare questo sito senza modificare le impostazioni dei cookie o cliccando su "Accetta" permetti il loro utilizzo.

Chiudi