Come creare e-mail per tutti in 3 semplici passaggi: registrazione webinar + domande e risposte

Pubblicato: 2019-08-02

L'accessibilità alla posta elettronica è stata votata come una delle tendenze più in voga nel design della posta elettronica del 2019 ed è ora una priorità per la maggior parte dei marchi. Ma è anche vero che molti marketer non sanno come iniziare a rendere le proprie e-mail più inclusive.

L'implementazione delle best practice per l'accessibilità è più facile di quanto pensi. In questo webinar, gli esperti di accessibilità di Litmus, Jason Rodriguez e Alice Li, illustrano le statistiche e le ricerche che dimostrano che vale la pena investire nell'accessibilità e condividono i 3 passaggi che dovrai compiere per creare un'email migliore per tutti.

Non hai avuto la possibilità di guardare il webinar in diretta? Non preoccuparti. Puoi accedere alla registrazione completa in qualsiasi momento e leggere le domande e risposte di seguito.

Domande e risposte

Un grande ringraziamento a tutti coloro che sono intervenuti durante il webinar con una domanda! Ecco un riassunto delle nostre risposte alle domande più popolari, insieme alla nostra interpretazione di alcune delle domande a cui non siamo arrivati ​​durante il webinar dal vivo. Hai altre domande? Si prega di lasciarli nei commenti.

Come spieghi i limiti cognitivi?

Bettina : Ci sono molti tipi diversi di disabilità cognitive, dall'avere difficoltà a memorizzare le cose o prestare attenzione alla dislessia o all'autismo. Ognuna di queste condizioni è unica, ma seguire i suggerimenti nella sezione copywriting e design di questo webinar contribuirà notevolmente a rendere le tue e-mail più accessibili alle persone con limitazioni cognitive. Ad esempio, mantieni la tua copia della posta elettronica chiara e concisa ed evita l'uso di parole o gergo difficili. Mantieni i tuoi layout semplici e sviluppa una chiara gerarchia visiva che renda facile per i tuoi iscritti scansionare la tua email e capire rapidamente cosa è importante (e cosa no).

Qual è lo screen reader più utilizzato? Come fai a provarlo?

Alice: I due lettori di schermo più popolari sono NVDA e JAWS . NVDA è uno strumento gratuito e open source sviluppato da NV Access, un'organizzazione straordinaria che dedica il proprio lavoro a rendere la tecnologia più accessibile per le persone con disabilità visive. JAWS è un popolare strumento di lettura dello schermo basato su abbonamento.

Se non vuoi installare software per capire come suonerebbe la tua email su uno screen reader, puoi usare Litmus per questo! Abbiamo recentemente integrato NVDA in Litmus, quindi ora puoi ascoltare un'anteprima audio della tua e-mail direttamente all'interno di Litmus Checklist. Scopri di più .

Inoltre, tutti i moderni sistemi operativi offrono anche un qualche tipo di supporto nativo per la lettura dello schermo. Su Mac, ad esempio, è VoiceOver .

Quali sono alcuni marchi che fanno un ottimo lavoro ottimizzando le loro e-mail per l'accessibilità? mi piacerebbe un po' di ispirazione!

Jason : Uno dei miei preferiti è deque . Fanno un sacco di formazione sull'accessibilità, hanno un fantastico blog e ottime e-mail! Le loro e-mail non solo seguono le migliori pratiche di accessibilità, ma presentano anche ottimi contenuti che ti aiutano a conoscere l'argomento. Dovresti iscriverti alla loro newsletter !

A rischio di sembrare presuntuoso, sono rimasto molto colpito dal lavoro che Alice e il team di posta elettronica hanno svolto sulla newsletter Litmus . Non solo è ben progettato, ma hanno lavorato molto per renderlo accessibile sulla base delle migliori pratiche discusse in The Ultimate Guide to Email Accessibility.

Qualche informazione su come strumenti come "Alexa" o "Siri" differiscono dagli altri lettori di schermo? O la funzione di lettura ad alta voce di Outlook?

Jason : In un recente episodio del podcast Delivering ho approfondito gli assistenti vocali. Ho scoperto che Alexa è l'unico che legge veramente la tua email, ma leggerà solo il testo HTML, ignorando eventuali attributi alt, tabelle o altri elementi HTML. È diverso da come gestirebbe la posta elettronica uno screen reader. Gli assistenti vocali sono orientati alla praticità, non necessariamente all'accessibilità, quindi non funzionano allo stesso modo di uno screen reader completo come, ad esempio, NVDA. In molti casi, hai ancora bisogno del tuo telefono o del tuo laptop per navigare nei contenuti, l'assistente vocale ti supporta solo. Per una panoramica completa su come Alexa, Google Home, Siri e Cortana gestiscono la posta elettronica, sintonizzati su questo episodio del podcast.  

Che ne dici di GIF animate? Li usi o no? Causano problemi ai lettori?

Alice : Puoi usarli, ma fai attenzione a come. Le animazioni possono innescare crisi epilettiche fotosensibili, quindi non vorrai mai includere una GIF troppo stridente o lampeggiante. Inoltre, non vuoi includere informazioni cruciali come la copia nelle tue GIF. La copia nascosta nella GIF non è accessibile agli screen reader e non verrà visualizzata nei client di posta elettronica in cui le immagini sono disabilitate, quindi rischi di perdere parti cruciali della tua messaggistica.

Dove posso trovare esempi di modelli di email accessibili?

Jason : Ci sono così tanti modelli gratuiti là fuori, ma non molti di loro sono ottimizzati pensando all'accessibilità! Ecco perché di recente abbiamo creato quattro nuovissimi modelli che seguono le migliori pratiche di accessibilità e sono disponibili gratuitamente nella community di tornasole . Dai un'occhiata ai nostri modelli se vuoi costruire...

  • Newsletter accessibili
  • Note personali accessibili
  • Email transazionali accessibili
  • Annunci di prodotti accessibili

In che modo l'uso degli emoji influisce sull'accessibilità?

Jason: Sebbene la maggior parte degli screen reader comprenda gli emoji e li possa leggere, potrebbe non essere l'esperienza ottimale per gli utenti. Ascoltiamo NVDA che legge questo oggetto di esempio con un'emoji:

La più grande vendita dell'anno

Puoi sentire come suona un'emoji sconnessa accanto al testo. Mentre gli emoji sono all'ordine del giorno e gli utenti di tecnologie assistive sono probabilmente abituati a sentirli, a seconda dell'emoji può ancora sembrare imbarazzante. Come qualsiasi altro elemento o copia in un'e-mail, il modo migliore per vedere se funziona o meno è testarlo e ascoltare la tua e-mail utilizzando uno strumento come NVDA o Litmus Accessibility Checker.

Devo applicare "ruolo=presentazione" anche ai DIV?

Alice : No! role="presentation" ha solo lo scopo di dire agli screen reader di ignorare il significato semantico dei tag, quindi le tabelle ne hanno bisogno perché i dati tabulari come i grafici richiedono tutte le informazioni su colonne e righe affinché le persone possano navigarli e comprenderli correttamente. Nella posta elettronica, gli sviluppatori spesso si affidano alle tabelle per la presentazione anziché ai dati tabulari, motivo per cui le tabelle lo richiedono. I DIV, d'altra parte, non hanno un significato semantico che dovrebbe essere sovrascritto per gli screen reader.

Per i clienti che insistono nell'utilizzare e-mail basate su immagini, ci sono best practice che dovremmo seguire?

Bettina : Questa è dura! Ci sono innumerevoli ragioni per cui inviare e-mail con tutte le immagini è un'idea orribile. Quindi, come primo passo, fai tutto il possibile per convincere il tuo cliente che questo approccio viene fornito con un'esperienza orribile per gli abbonati. Il nostro post sul blog su Perché non dovresti inviare e-mail di sole immagini contiene molti spunti e suggerimenti per aiutarti a sostenere il tuo caso.

Se non c'è modo di portare il tuo cliente sulla strada giusta, allora tutto ciò che puoi fare è ottimizzare la visualizzazione dell'immagine con il testo ALT ( puoi persino modellare quel testo ALT ) e utilizzare pulsanti a prova di proiettile in modo che almeno i tuoi CTA funzionano ancora quando le immagini sono disabilitate.

L'uso dei caratteri web influisce sull'accessibilità?

Alice : Dal punto di vista del codice, non dovrebbe. Dal punto di vista del design, significa che dovresti sempre assicurarti che sia il carattere web che il suo fallback sicuro per il web soddisfino gli standard del rapporto di contrasto per essere leggibili. Ad esempio, se il tuo carattere web è più spesso del fallback, assicurati solo che il fallback passi anche i punteggi del rapporto di contrasto poiché il fallback è ciò che gli utenti, ad esempio, su Gmail, potrebbero vedere invece.

L'unica modifica che non abbiamo apportato al nostro modello di codice è l'utilizzo dell'elemento semantico per intestazioni o paragrafi. Attualmente stiliamo la cella della tabella per il testo. Quali problemi può presentare per l'accessibilità?

Alice : Presumo che la tabella che avvolge il testo abbia già il suo ruolo impostato su "presentazione" o "nessuno" per frenare qualsiasi rumore inutile dello screen reader. Quindi, a parte questo problema, non utilizzare i tag di intestazione/paragrafo corretti presenterebbe un problema di navigazione per i dispositivi di assistenza, poiché alcune tecnologie consentono agli utenti di saltare da un'intestazione all'altra (e i relativi paragrafi) come se fosse un sommario.

I caratteri speciali, come apostrofi ricci, virgolette, e commerciali, ecc., possono essere letti dagli screen reader?

Alice : Dipende. Le e commerciali vengono spesso lette come "e". Le virgolette e gli apostrofi ricci vengono ignorati come qualcuno potrebbe non pronunciarli mentre legge qualcosa ad alta voce. Altri caratteri speciali sono considerati caso per caso, come i punti elenco vengono letti come "proiettile". In genere consiglierei sempre di testare per essere sicuri.

Qualche suggerimento sulla formattazione del testo solo per l'accessibilità? Uso diverse interruzioni "=" o "-" tra le sezioni. Come vengono gestiti quelli?

Alice : I trattini e i trattini bassi tendono a non essere letti, quindi vanno bene. Tuttavia, gli screen reader leggeranno il segno "uguale", quindi consiglierei di evitarlo.