Linee guida per l'accessibilità delle email: criteri e procedure ottimali

Se la tua email non è accessibile, non va bene.

Mark Robbins,

Ingegnere informatico presso Parcel, amministratore del Consorzio per il Markup delle Email.

L’accessibilità delle email continua ad essere un argomento cruciale. Sebbene l'accessibilità delle email sia diventata familiare più di dieci anni fa, un sorprendente 99.97% delle email riscontra problemi di accessibilità.

Nel nostro articolo “Perché l’accessibilità è importante”, abbiamo parlato delle varie tipologie di disabilità e di come influenzano l'esperienza degli utenti. Abbiamo anche evidenziato i punti di partenza per garantire la totale accessibilità delle email. In questo articolo condivideremo le linee guida per rendere le tue email accessibili.

Principali risultati

1.  Nonostante sia una necessità riconosciuta da oltre un decennio, uno sconcertante 99,97% delle email in HTML presenta ancora problemi significativi di accessibilità, evidenziando un'enorme lacuna nelle pratiche di progettazione delle email.
2.  Circa la metà della popolazione mondiale potrebbe trarre vantaggio da un design delle email più accessibile a causa di una serie di disabilità, tra cui disturbi visivi, perdita dell'udito, disabilità motorie e disturbi cognitivi.
3. L'effettiva accessibilità delle email va oltre le semplici correzioni tecniche e richiede una strategia completa in cinque fasi: Design (per garantire l'accessibilità visiva), testo, lavoro con gli alt text, tecnologia e linking strategico. Solo questo approccio olistico garantisce un'accessibilità completa in tutti gli aspetti della comunicazione tramite email.

Statistiche sull'accessibilità, ovvero il numero di persone in tutto il mondo che trarrebbero beneficio dall'accessibilità delle email

Nel nostro precedente articolo, abbiamo presentato statistiche dettagliate sulla diffusione di varie disabilità e sullo stato attuale dell'accessibilità digitale. Ecco una rapida panoramica:

• 2,5 miliardi di persone hanno problemi di vista, di cui 2,2 miliardi con problemi di vista e 300 milioni daltonici;
• 430 milioni di persone hanno problemi di udito invalidanti (sordità) e 1,5 miliardi di persone hanno problemi di udito;
• 968 milioni di persone hanno disabilità motorie;
• 1,6 miliardi di persone hanno disabilità cognitive e di apprendimento, tra cui 960 milioni di persone con dislessia e 400 milioni con epilessia fotosensibile.

Questo grafico illustra che circa la metà della popolazione mondiale potrebbe beneficiare di email accessibili, ma il 99.97% delle email HTML ha importanti problemi di accessibilità.

You might also like

Perché l'accessibilità digitale è importante e come iniziare a conoscerla

Elenco delle migliori linee guida per l'accessibilità delle email  

Gli standard di accessibilità delle email sono un insieme di regole e consigli per la progettazione di email di facile lettura per le persone con qualsiasi tipo di disabilità. 

1. Rendi significativo il testo alt per le immagini e le GIF.
2. Se una GIF o un'immagine ha uno scopo educativo, assicurati di aggiungere una descrizione scritta e dettagliata.
3. Utilizza titoli e sottotitoli (invece di usare semplicemente caratteri più grandi) per organizzare i contenuti in modo significativo e renderli leggibili per i lettori di schermo.
4. Utilizza solo titoli, elenchi puntati e numerati formattati in modo programmatico.
5. Rendi il testo del link significativo.
6. Opta per caratteri accessibili come OpenDyslexic, Comic Sans e opzioni sans-serif come Arial, Verdana, Tahoma, Century Gothic, Trebuchet, Calibri e Open Sans.
7. Imposta l'interlinea a circa il 150%.
8. Specifica i nomi dei colori delle voci tra parentesi.
9. Controlla il contrasto di colore dei testi e delle immagini.
10. Evita di usare tutte le lettere maiuscole per il testo continuo; usa invece lettere minuscole più grandi.
11. Aggiungi la punteggiatura alla fine dell'elenco puntato e di ogni frase, compresi i titoli.
12. Usa sfondi monocolore e bianchi.
13. Allinea i testi a sinistra, senza interruzioni di riga e senza giustificazione.
14. Evita l'uso eccessivo del grassetto o del corsivo - usa il grassetto per enfatizzare.
15. La sottolineatura è consentita solo per i link.
16. Inserisci una sola immagine GIF animata in una schermata.
17. Utilizza GIF con meno di tre flash al secondo.
18. Imposta la lingua dell'email, i ruoli di presentazione e l'attributo dir per i lettori di schermo.

Questo riassume tutti gli standard di accessibilità per le email. Di seguito, ti mostreremo come abbiamo sviluppato queste regole specifiche.

Fasi per la creazione di email accessibili

Nel nostro precedente articolo, abbiamo esaminato cinque tipi di disabilità e il loro impatto specifico sull'esperienza dell'utente. Riconoscere che ogni disabilità richiede soluzioni specifiche è fondamentale. Ad esempio, concentrarsi solo sulle soluzioni per il daltonismo potrebbe non rispondere alle esigenze di chi soffre di dislessia o di chi utilizza lettori di schermo. Per creare email veramente accessibili, è necessario un approccio olistico che comprenda design, codice e testo. Questo metodo completo ci permette di soddisfare l'intero spettro delle esigenze di accessibilità, migliorando notevolmente l'esperienza dell'utente.

Ecco come fare:

Fase 1. Scrivere il testo delle email accessibili

Disabilità coperte: Disabilità visive e cognitive/di apprendimento/neurologiche.

Le linee guida per un testo accessibile includono:

• essere brevi: scrivere testi concisi in modo che i destinatari possano comprendere rapidamente il punto di vista senza dover leggere testi lunghi;
• mantenere un linguaggio semplice: Utilizza un linguaggio semplice e comprensibile anche a un bambino di terza media. Evita gerghi complessi o termini accademici;
• impostare l'interlinea a circa il 150%;
• utilizzare i sottotitoli: Suddividi il contenuto in sezioni con sottotitoli chiari per facilitare la lettura delle email;
• impostare titoli piuttosto che usare semplicemente caratteri più grandi.

Fase 2. Ottimizzazione dei testi alt

Disabilità coperte:  Non solo disabilità visive: il testo alt è utile a tutti i destinatari. Aiuta coloro che hanno le immagini bloccate a causa della lentezza di Internet, delle impostazioni di sicurezza o delle preferenze personali e supporta gli utenti dei lettori di schermo, compresi gli individui con disabilità visive, dislessia e altre difficoltà di lettura o apprendimento.

Innanzitutto, spieghiamo la differenza tra attributo alt e testo alt:

• l'attributo alt è l'attributo HTML utilizzato all'interno dell'elemento immagine;
• il testo alt è il contenuto inserito nell'attributo alt.

Vediamo cosa succede quando non è presente l'attributo alt:

• le persone che utilizzano i lettori di schermo sentiranno l'intero URL dell'immagine in hosting o il nome del file se l'immagine non è collegata, o l'URL dell'immagine se è collegata;
• tutti i destinatari non sapranno di cosa si tratta se l'immagine è bloccata.

(Fonte: Webinar con Sarah Gallardo)

Le migliori linne guida per i testi alt includono:

• considera sia il contenuto che il contesto dell'immagine;
• assicurati che il testo alt trasmetta ciò che l'immagine raffigura;
• ricordati che i lettori di schermo in genere smettono di leggere il testo alt dopo 100-120 caratteri;
• evita frasi come “questa immagine riguarda”, poiché i lettori di schermo indicano già la presenza di un'immagine;
• utilizza le maiuscole per le frasi o per i titoli, evitando il maiuscolo;
• punta su un testo alt descrittivo ma conciso;
• garantisci un buon contrasto tra il testo alt e lo sfondo per garantire la chiarezza visiva.

Fase 3. Creare link accessibili  

Disabilità coperte: Supporta gli utenti di lettori di schermo e le persone con disabilità motorie.

Le migliori linee guida per i link accessibili includono:

• attieniti a una strategia di collegamento intenzionale: aggiungere link solo alle immagini essenziali ed evitare di collegare quelle decorative;
• utilizza un testo descrittivo per indicare chiaramente dove conduce il link, evitando frasi generiche come “Per saperne di più” o “Clicca qui”.
• assicurati che il testo alt delle immagini collegate descriva la destinazione del link;
• assicurati che i link risaltino usando metodi di formattazione come la sottolineatura o il grassetto, piuttosto che affidarti solo al colore;
• quando possibile, inserire i link in pulsanti call-to-action per aiutare le persone ipovedenti o con disabilità motorie a cliccarli.

Fase 4. Ottimizzazione del design delle email per l’accessibilità

A causa della sua complessità, questa fase è suddivisa in diversi gruppi.

Gruppo 1. Linee guida per l’accessibilità della formattazione del testo 

Disabilità coperte: persone ipovedenti, persone che utilizzano lettori di schermo e dislettici.

• evita l'uso di tutte le maiuscole, perché possono essere interpretate in modo errato dalle persone dislessiche e i lettori di schermo possono leggerle come abbreviazioni;
• includi i segni di punteggiatura alla fine dei punti e dei titoli;
• riduci al minimo l'uso del corsivo e del grassetto per enfatizzare; evitare del tutto il grassetto corsivo;
• sottolinea il testo solo se si tratta di un collegamento ipertestuale;
• opta per una dimensione del testo del corpo di 16 px per garantire la leggibilità;
• utilizza caratteri accessibili come OpenDyslexic, Comic Sans, e sans-serif e opzioni come Arial, Verdana, Tahoma, Century Gothic, Trebuchet, Calibri, e Open Sans;
• allinea il tuo testo a sinistra senza giustificazione o aggiunta di interruzioni di riga.

Gruppo 2. Lavorare con i colori

Disabilità coperte: Persone affette da daltonismo, ipovisione e dislessia.

• assicura che ci sia un sufficiente contrasto cromatico tra testo e immagini;
• utilizza sfondi monocolore: per i testi inferiori a 18px grassetto e 24 normale, dovrebbe essere di 4:5:1, mentre per i testi superiori dovrebbe essere di 3:1; 
• Scegli caratteri grigio scuro su sfondi bianchi invece che nero brillante su bianco brillante;
• evita di usare solo i colori per evidenziare le informazioni importanti nelle email;
• quando si utilizzano immagini per indicare le risposte giuste o sbagliate (rispettivamente con il rosso e il verde) o le tendenze dei numeri, integrarle con descrizioni testuali o segni “+” e “-” per maggiore chiarezza.

(Fonte: Email da HubSpot)

Gruppo 3. Lavorare sulle immagini

Disabilità coperte: Persone affette da daltonismo, ipovisione, dislessia ed epilessia fotosensibile. 

Quando si lavora con GIF e immagini, ricordarsi di:

• utilizza GIF con tre o meno flash al secondo;
• utilizza un'immagine animata (GIF) per schermo;
• mantenere il contrasto dei colori come indicato in precedenza;
• includi un testo alt significativo per le immagini. Per le GIF che trasmettono istruzioni o informazioni significative, fornire descrizioni aggiuntive sotto il GIF.

Fase 5. Soddisfare i requisiti di accessibilità di un codice di email

Disabilità coperte: Supporta coloro che utilizzano i lettori di schermo e altri tipi di tecnologia assistiva.

Elenchiamo solo quelli più importanti:

• Imposta l'attributo lang sia nell'elemento <html> che nell’elemento diretto principale <body>. Questa ridondanza è necessaria in quanto alcuni client di posta elettronica possono rimuoverlo dall'elemento <html>;
• avvolgi il contenuto all'interno del <body> con un attributo dir per la direzionalità;
• assegna role="presentation" o role="none" agli elementi <table> con l'attributo role.

Strumenti per verificare se le tue email sono conformi con tutte le migliori linee guida per l’accessibilità delle email

Una volta terminate le tue campagne email, verificale con gli strumenti di verifica dell'accessibilità e/o provale con i lettori di schermo.

Ecco gli strumenti che ti aiuteranno a controllare le tue e-mail:

• accessible-email.org di Jordie van Rijn e Maarten Lierop - questo strumento controlla se il codice della tua email è compatibile con qualsiasi lettore di schermo. Può anche aiutarti a ottimizzarlo;
• Accessibility Checker, uno strumento di Parcel che ti aiuta a valutare le tue email in base alle migliori linee guida e ai problemi di accessibilità. Il programma classifica i problemi identificati in base alla gravità: critici, gravi, moderati e lievi. In questo modo è più facile stabilire le priorità per le correzioni;
• Campaign Precheck di Email on Acid, controlla se l'email è ottimizzata per i dispositivi di assistenza;
• Accessible Colors, per verificare il contrasto di colore del corpo dell'email (testo e altri elementi, escluse le immagini);
• WebAIM (web accessibility in mind), Controllo del contrasto dei colori. Considera non solo i colori, ma anche le dimensioni dei caratteri per ogni caso;
• Coblis, Simulatore di daltonismo: mostra se le immagini sono accessibili alle persone daltoniche;
• Trace RERC (PEAT),  per verificare che le tue GIF rispettino i limiti raccomandati sulla frequenza di lampeggiamento.

Esperti e risorse per saperne di più sull’accessibilità digitale e delle email

In questo articolo abbiamo condiviso le linee guida essenziali per l'accessibilità delle email e compilato un elenco di risorse chiave e di esperti da seguire per ulteriori approfondimenti sull'argomento.

1. Sarah Gallardo, lead email developer presso Oracle, è una nota specialista dell'accessibilità delle email. Offre ampie linee guida e standard di accessibilità. La sua esperienza aiuta le aziende ad allinearsi alle migliori linee guida per l'accessibilità attraverso materiali didattici approfonditi.
2. Mike Paciello, Chief Accessibility Officer presso AudioEye, si occupa attivamente di educare i brand sull'importanza dell'accessibilità attraverso le più recenti statistiche e approfondimenti. Il suo lavoro è fondamentale per motivare le aziende a implementare e dare priorità all'accessibilità.
3. Thomas Logan fornisce una consulenza esperta sull'accessibilità, aiutando le aziende a garantire che i loro contenuti digitali siano accessibili a tutti. I suoi servizi comprendono formazione, audit completi e consulenza strategica che rispettano i rigorosi standard di accessibilità.
4. Mark Robbins, sostenitore dell'accessibilità delle email, condivide la sua profonda esperienza fornendo suggerimenti praticabili e soluzioni innovative per gli addetti al marketing delle email. La sua attenzione a rendere accessibili le comunicazioni via email va a vantaggio sia dei mittenti che dei destinatari.
5. Paul Airy, specializzato in progettazione e sviluppo di email, applica la scienza comportamentale per migliorare l'usabilità e l'accessibilità delle email. Il suo approccio non solo migliora l'esperienza dell'utente, ma assicura anche che le email siano comprensibili e navigabili per tutti.
6. WCAG stabilisce gli standard internazionali per l'accessibilità, fornendo un quadro di riferimento che descrive in dettaglio come i contenuti digitali possono essere resi accessibili alle persone con disabilità. Queste regole e linee guida sull'accessibilità sono essenziali per gli sviluppatori e i creatori di contenuti di tutto il mondo.
7. Email markup consortium di Parcel, guidato da esperti di accessibilità tra cui Mark Robbins, fornisce materiali essenziali per migliorare l'accessibilità delle email. Presenta un rapporto trimestrale, un glossario dettagliato e un elenco di errori comuni con soluzioni, il tutto finalizzato ad aumentare gli standard del settore.
8. A11y.email, gestito da Sarah Gallardo, è un blog che offre materiali approfonditi sull'accessibilità delle email, trattando argomenti come testo alternativo efficace, link significativi, HTML semantico e contrasto di colori. Fornisce anche strumenti e tecniche per testare l'accessibilità delle email, rendendolo ideale per gli sviluppatori e gli esperti di marketing.
9. AudioEye, gestito da Mike Paciello, offre una grande quantità di informazioni sull'accessibilità digitale. Presenta articoli sulle migliori linee guida, sulla conformità e sulle ultime tendenze in materia di accessibilità, aiutando i marchi a garantire che i loro contenuti digitali siano inclusivi e accessibili a tutti gli utenti.
10. Il Blog Equal Entry, diretto da Thomas Logan, fornisce articoli dettagliati sull'accessibilità digitale. Copre le migliori linee guida e argomenti innovativi come GenAI nell'accessibilità delle email, del web e dei videogiochi, con l'obiettivo di rendere i contenuti digitali inclusivi per tutti.
11. British dyslexia association sensibilizza e supporta le persone affette da dislessia, fornendo risorse, informazioni e linee guida per creare e rendere i contenuti digitali accessibili e adatti alla dislessia.
12. Yale University offre articoli e risorse sull'accessibilità del web, comprese le migliori linee guida per la creazione di link e altri contenuti digitali accessibili.

Conclusione

La creazione di email accessibili è una parte essenziale delle strategie di comunicazione inclusiva che vanno a beneficio non solo delle persone con disabilità, ma di tutti i destinatari delle email. L'ampia prevalenza di problemi di accessibilità negli attuali design delle email evidenzia l'urgente necessità di sensibilizzare e implementare le migliori linee guida. Adottando le linee guida complete descritte in questo articolo, i responsabili marketing e gli sviluppatori possono migliorare significativamente l'esperienza dell'utente per un ampio pubblico, assicurando che le email non siano solo leggibili, ma veramente accessibili a tutti. Questo approccio non solo migliora il coinvolgimento, ma riflette anche un impegno all'inclusività nelle comunicazioni digitali.