Come progettare un'e-mail Le persone leggeranno effettivamente sui loro telefoni
L'email marketing è uno dei modi più popolari per raggiungere un pubblico. Aspetta, probabilmente non sono nuove informazioni. Ma sapevi quale sarà la maggior parte di tali visualizzazioni su un dispositivo mobile? Quindi, se non stai progettando le tue e-mail per i telefoni, questo è il giorno di iniziare.
Progettare un'e-mail mobile richiede pianificazione e pensiero. Molti client di software di posta elettronica di terze parti includono modelli reattivi nei loro pacchetti, ma non tutti gli strumenti convertiranno automaticamente il tuo messaggio nel design dell'idea. Devi pensare a come apparirà la tua e-mail e assicurarti che il messaggio sia focalizzato. Potrebbe anche essere il luogo perfetto per iniziare con una strategia di progettazione mobile-first.
Attenersi a una colonna
Potrebbe essere la decisione di progettazione più semplice che tu abbia mai preso: quando si tratta di e-mail mobile, attenersi a un formato a una colonna. Questa decisione da sola renderà più semplice gestire ogni considerazione. Risolve anche una serie di problemi relativi al piccolo schermo.
Il formato a una colonna è facile per gli utenti a corto di tempo, crea organizzazione e flusso. È anche lo standard di progettazione per tutto su un piccolo schermo. (Pensa a ogni app o gioco che apri. Presentano tutto in un unico design orientato verticalmente.)
Il formato a una colonna può costringerti a modificare alcuni dei tuoi pezzi di design standard. Le e-mail mobili richiedono un'intestazione e una navigazione semplificate. Gli elementi di design dovrebbero essere abbastanza piccoli in modo che l'inizio del messaggio di posta elettronica sia visibile nella prima schermata.
Rendi il tipo più grande
Uno dei maggiori problemi quando si tratta di e-mail mobile è la leggibilità. Le e-mail non dovrebbero essere difficili da leggere. La soluzione è rendere il testo un po 'più grande.
Lo standard per il tipo di e-mail mobile è compreso tra 14 e 16 punti per il tipo di corpo principale e da 22 a 24 punti per i titoli. E non dimenticare di disattivare la sillabazione, che può essere fonte di distrazione per la lettura di piccoli blocchi di tipo. Questo standard sta diventando così comune che l'iOS di Apple ha una dimensione minima del carattere di 13 punti e regolerà automaticamente qualsiasi cosa inferiore a quella.
All'inizio questo potrebbe sembrare scomodo. È probabile che il tipo appaia enorme mentre stai lavorando attraverso la progettazione, ma diventerà più comodo e gli utenti ti ringrazieranno con più aperture e maggiori tempi di interazione.
Dì agli utenti di fare qualcosa
Un'e-mail mobile ha bisogno di un ovvio invito all'azione. Perché stai inviando l'e-mail? C'è uno spazio progettato per gli utenti per completare questa azione?
La seconda domanda è la chiave per i designer. Non ci sono molti modi per creare segnali secondari nelle e-mail mobili, come gli stati al passaggio del mouse che includono suggerimenti sugli strumenti, quindi ogni elemento deve essere progettato in modo che l'azione dell'utente sia ovvia. Ciò può includere qualsiasi aspetto, dall'aspetto dei pulsanti al testo - "Acquista ora", "Fai clic qui", Ulteriori informazioni "che viene visualizzato nel disegno.
Pensa attentamente alle immagini
Esiste un segmento significativo di utenti che in realtà non vedrà le immagini da una newsletter e-mail mobile. I dispositivi iOS di Apple sono l'unico segmento in cui le immagini vengono automaticamente visualizzate nelle e-mail. Quindi includere le immagini dovrebbe essere una decisione consapevole.
Prima di rinunciare completamente alle immagini, fai una piccola ricerca. Studia le tue analisi per vedere da quali tipi di dispositivi gli utenti visualizzano il tuo messaggio. Le immagini sono uno strumento importante e non devono essere trascurate a causa delle specifiche del dispositivo.
Quando si utilizzano immagini nei progetti di progettazione di e-mail mobili, tenere presente quanto segue:
- Taglia. L'immagine dovrebbe essere visualizzabile senza scorrere.
- Composizione. Il contenuto dell'immagine deve essere comprensibile a dimensioni ridotte.
- HTML. Non cadere nella trappola di trasformare testo o pulsanti in immagini. Gli elementi di testo e di interfaccia utente devono essere HTML e ogni immagine dovrebbe avere testo HTML di supporto.
- Messaggio. Ricorda che il tuo messaggio deve essere comprensibile anche se un utente non vede l'immagine.
- Non esagerare. Se prevedi di utilizzare le immagini, attenersi a una. Gli utenti saranno frustrati se gran parte del messaggio sembra mancare.
Dividi lo schermo in Design Framework
In termini di progettazione e-mail mobile, la semplicità è il re. Tutto, dalla lingua al design, dovrebbe essere semplice e facile da capire. Il messaggio e gli inviti all'azione dovrebbero essere ovvi.
Quando pensi al design mobile, immagina che il piccolo schermo abbia tre parti: intestazione e marchio, messaggio introduttivo e azione. Idealmente, ognuno di questi dovrebbe avere un posto nella prima schermata del design dell'email. (Anche se non sempre.)
Prendi in considerazione i dispositivi e la scala
La cosa più difficile da considerare quando si tratta di design mobile sono tutte le dimensioni dello schermo possibili su cui verrà visualizzata un'e-mail. La realtà è questa: è impossibile da fare.
Ma puoi pensare in comune. Apple iOS ridimensionerà automaticamente le e-mail mobili per adattarle alla larghezza dello schermo, quindi è una cosa in meno a cui pensare se stai pianificando una dimensione dello schermo ridotta. (Altri sistemi operativi non lo stanno ancora facendo.)
La larghezza più standard per il design mobile è larga 640 pixel. Le altezze tendono a variare un po 'di più. Puoi trovare un elenco di dispositivi e dimensioni dai Suggerimenti tecnici di Ken.
Prendi in considerazione il tocco e l'ergonomia
Gli elementi che devono essere cliccati o toccati nell'e-mail mobile devono avere un design ovvio. Questo spesso include la progettazione di questi elementi con colori più audaci e con dimensioni maggiori di quelle a cui potresti essere abituato.
Come regola generale, ogni elemento progettato per l'azione dell'utente dovrebbe essere abbastanza grande da poter essere facilmente toccato con un dito ed essere chiaramente distinguibile dagli oggetti vicini con molto spazio. Gli elementi dovrebbero anche essere facili da toccare, prendendo in considerazione gli utenti che usano solo una mano per tenere e toccare gli oggetti sullo schermo.
- Lo standard nel dimensionamento "intuitivo" è di almeno 46 pixel quadrati.
- Scegli inviti all'azione a tutta larghezza, in modo che gli utenti mancini o destrimani possano toccarli facilmente.
Consentire un ampio spazio aperto attorno agli elementi cliccabili. Quando si utilizzano collegamenti in-text su cui è necessario fare clic, aggiungere più parole al collegamento per facilitare il contatto con il collegamento e limitare il numero di collegamenti incorporati. Più collegamenti ravvicinati aumentano la possibilità che un utente tocchi quello sbagliato. Usa elementi di design come il colore e il grassetto per tutti i link in modo che gli utenti abbiano un chiaro segnale visivo che il testo fa qualcosa.
Bonus: 5 cose da evitare
Ora che hai un'idea delle cose da fare con una campagna di posta elettronica mobile, ci sono alcune cose che dovresti ricordare di evitare. Questi errori comuni sono le cose che possono distruggere un'e-mail mobile altrimenti eccezionale.
- Dimenticare di aggiungere la navigazione. Includi una navigazione semplicissima che può riportare gli utenti al tuo sito Web, ma ricorda di ottimizzarlo per i dispositivi mobili. La barra di navigazione del tuo sito Web è probabilmente ridimensionata in modo errato per un dispositivo mobile.
- Creazione di una tavolozza di colori "sottile". Gli utenti regolano molto il contrasto e il colore sui propri dispositivi mobili. Evita le tavolozze di colori con tonalità o colori morbidi senza molto contrasto. Deve essere leggibile.
- Il tipo piccolo su un dispositivo piccolo è killer. Le persone scorreranno. Rendi il tipo abbastanza grande da leggere con facilità.
- Pulsanti piccoli o nascosti dalle icone dell'interfaccia utente standard. Pensa all'iPhone, ad esempio, in cui il tentativo si apre dalla parte inferiore dello schermo. Se si posizionano pulsanti o elementi in questa posizione, verranno nascosti quando gli utenti tentano di interagire con essi.
- Il disordine è un disastro mobile. Determinare un singolo messaggio per dispositivi mobili e attenersi ad esso. Gli utenti non hanno il tempo o l'intervallo di attenzione per filtrare molte informazioni da un'e-mail sui loro telefoni.
Conclusione
La progettazione di e-mail mobile può testare alcune delle cose che pensi della progettazione per il Web. È un aspetto unico con considerazioni distinte. Molte delle cose che devi considerare sono diverse rispetto ad altri progetti.
La mia raccomandazione è questa: tutte le newsletter e le e-mail o la corrispondenza devono essere ottimizzate per i dispositivi mobili. Crea ogni messaggio usando i suggerimenti sopra e poi pensa a eventuali piccole modifiche che puoi apportare per formati più grandi. Questo funziona perché creerai un messaggio unico e unificato su più piattaforme con un'idea focalizzata. Capirai cosa vuoi ottenere con l'e-mail prima di andare troppo avanti e prendere importanti decisioni sui contenuti nelle prime fasi del processo e non ti sentirai come se fossi costretto a eliminare contenuti per gli utenti mobili.