Si votre e-mail n'est pas accessible, votre e-mail est cassé.
L'accessibilité des e-mails reste un sujet crucial. Bien que l'accessibilité des e-mails soit devenue familière il y a plus d'une décennie, 99.97% des e-mails sont encore confrontés à des problèmes d'accessibilité critiques.
Dans notre article intitulé “Pourquoi l'accessibilité est importante,” nous avons abordé les différents handicaps et la manière dont ils affectent l'expérience des utilisateurs. Nous avons également souligné les points de départ pour assurer une accessibilité totale des e-mails. Dans cet article, nous allons partager des lignes directrices sur l'optimisation de vos e-mails pour l'accessibilité.
Principaux enseignements
- Bien qu'il s'agisse d'une nécessité reconnue depuis plus d'une décennie, 99,97 % des e-mails HTML présentent encore des problèmes d'accessibilité importants, ce qui met en évidence une énorme lacune dans les pratiques de conception des e-mails.
- Les ajustements d'accessibilité dans les e-mails ne sont pas un simple détail mais une nécessité, car environ la moitié de la population mondiale pourrait bénéficier de conceptions d'e-mails plus accessibles en raison de divers handicaps, notamment les déficiences visuelles, la perte d'audition, les handicaps moteurs et les troubles cognitifs.
- Pour être efficace, l'accessibilité des e-mails ne se limite pas à de simples corrections techniques, mais nécessite une stratégie globale en cinq étapes : La conception (assurer l'accessibilité visuelle), le texte, le travail avec les textes alt, la technologie et les liens stratégiques. Seule cette approche holistique garantit une accessibilité complète dans tous les aspects de la communication par e-mail.
Statistiques sur l'accessibilité, ou le nombre de personnes dans le monde qui bénéficieraient de l'accessibilité des e-mails.
Dans notre précédent article, nous avons présenté des statistiques détaillées sur la prévalence de diverses déficiences et sur l'état actuel de l'accessibilité numérique. En voici un bref aperçu :
- 2,5 milliards de personnes souffrent de déficiences visuelles, dont 2,2 milliards de problèmes de vision et 300 millions de daltoniens ;
- 430 millions de personnes ont une déficience auditive invalidante (sourds), et 1,5 milliard de personnes ont une perte d'audition ;
- 968 millions de personnes ont des handicaps moteurs ;
- 1,6 milliard ont des troubles cognitifs et d'apprentissage, dont 960 millions souffrent de dyslexie et 400 millions d'épilepsie photosensible.
Ce graphique montre qu'environ la moitié de la population mondiale pourrait bénéficier d'e-mails accessibles, alors que 99.97% des e-mails HTML présentent des problèmes d'accessibilité importants.
Liste des meilleures pratiques en matière d'accessibilité des e-mails
Les normes d'accessibilité des e-mails sont un ensemble de règles et de recommandations pour la conception d'e-mails faciles à lire pour les personnes souffrant de tous types de handicaps.
- Faites en sorte que le texte alt des images et des GIF soit significatif.
- Si un GIF ou une image a une vocation pédagogique, veillez à ajouter une description écrite et détaillée.
- Utilisez des titres et des sous-titres (au lieu d'utiliser simplement des polices plus grandes) pour organiser votre contenu de manière significative et le rendre lisible pour les lecteurs d'écran.
- Utilisez uniquement des titres, des listes à puces et des listes numérotées formatés par programme.
- Faites en sorte que le texte des liens soit significatif.
- Optez pour des polices accessibles telles que OpenDyslexic, Comic Sans et des options sans empattement comme Arial, Verdana, Tahoma, Century Gothic, Trebuchet, Calibri et Open Sans.
- Réglez l'interligne à environ 150 %.
- Spécifiez les noms des couleurs des éléments entre parenthèses.
- Vérifiez le contraste des couleurs de votre copie et de votre imagerie.
- Évitez d'utiliser toutes les lettres majuscules pour un texte continu ; utilisez plutôt des lettres minuscules plus grandes.
- Ajoutez de la ponctuation à la fin des puces et de chaque phrase, y compris les titres.
- Utilisez des arrière-plans unicolores et blanc cassé.
- Alignez votre copie à gauche, sans saut de ligne ni justification.
- Évitez les caractères gras ou italiques excessifs - utilisez les caractères gras pour mettre l'accent.
- Le soulignement n'est autorisé que pour les liens.
- Ne placez qu'une seule image GIF animée sur un écran.
- Utilisez des images GIF avec moins de trois flashs par seconde.
- Définissez la langue de l'e-mail, les rôles de présentation et l'attribut dir pour les lecteurs d'écran.
Ceci résume toutes les normes d'accessibilité pour les e-mails. Nous vous expliquons ci-dessous comment nous avons élaboré ces règles spécifiques.
Étapes de la création d'e-mails accessibles
Dans notre précédent article, nous avons exploré cinq types de handicaps et leurs impacts uniques sur l'expérience utilisateur. Il est essentiel de reconnaître que chaque handicap nécessite des aménagements spécifiques. Par exemple, se concentrer uniquement sur des solutions pour le daltonisme pourrait ne pas répondre aux besoins des personnes souffrant de dyslexie ou utilisant des lecteurs d'écran. Pour créer des e-mails réellement accessibles, nous devons adopter une approche holistique qui englobe la conception, le code et le texte. Cette méthode globale permet de répondre à l'ensemble des besoins en matière d'accessibilité, ce qui améliore considérablement l'expérience de l'utilisateur.
Voici comment procéder :
Étape 1. Rédiger un e-mail accessible
Handicaps couverts : Handicaps visuels et cognitifs, d'apprentissage et neurologiques.
Les lignes directrices en matière d'accessibilité des textes comprennent :
- faites court : rédigez des textes concis afin que les destinataires puissent rapidement saisir votre point de vue sans avoir à lire de longs textes ;
- rester simple : utilisez un langage direct qu'un élève de 8ème année peut facilement comprendre. Évitez le jargon complexe ou les termes académiques ;
- réglez l'interligne à environ 150 % ;
- utilisez des sous-titres : divisez votre contenu en sections avec des sous-titres clairs pour faciliter la lecture de vos e-mails ;
- définissez des titres plutôt que d'utiliser simplement des polices de caractères plus grandes.
Étape 2. Optimiser les textes alt
Comme les personnes souffrant de déficiences visuelles ne peuvent pas voir vos images, un texte alternatif clair et descriptif est essentiel pour une communication efficace.
Handicaps couverts : Le texte alt ne concerne pas seulement les handicaps visuels : il profite à tous les destinataires. Il aide les personnes dont les images sont bloquées en raison de la lenteur de l'internet, des paramètres de sécurité ou de préférences personnelles, ainsi que les utilisateurs de lecteurs d'écran, y compris les personnes souffrant de déficiences visuelles, de dyslexie et d'autres troubles de la lecture ou de l'apprentissage.
Expert
Tout d'abord, expliquons la différence entre l'attribut alt et le texte alt :
- l'attribut alt est l'attribut HTML utilisé dans l'élément image ;
- le texte alt est le contenu placé à l'intérieur de l'attribut alt.
Voyons ce qui se passe lorsqu'il n'y a pas d'attribut alt :
- les personnes qui utilisent des lecteurs d'écran entendront l'intégralité de l'url de l'image hébergée ou le nom du fichier si l'image n'est pas liée, ou l'url de l'image si l'image est liée ;
- tous les destinataires n'auront aucune idée du sujet de l'image si celle-ci est bloquée.
(Source: Webinar en ligne avec Sarah Gallardo)
Chaque image contenue dans un e-mail DOIT avoir un attribut alt.
Les meilleures pratiques en matière de textes alternatifs sont les suivantes :
Expert
- tenez compte à la fois du contenu et du contexte de l'image ;
- veillez à ce que votre texte alt transmette ce que l'image représente ;
- se rappeler que les lecteurs d'écran cessent généralement de lire le texte alt après 100-120 caractères ;
- éviter les phrases telles que « cette image est à propos de », car les lecteurs d'écran indiquent déjà la présence d'une image ;
- utiliser la casse des phrases ou des titres, en évitant les majuscules ;
- viser un texte alt descriptif mais concis ;
- assurer un bon contraste entre le texte alt et l'arrière-plan pour une meilleure clarté visuelle.
Étape 3. Rendre liens accessibles
Handicaps couverts : Aide aux utilisateurs de lecteurs d'écran et aux personnes souffrant de déficiences motrices.
Expert
Les meilleures pratiques en matière de liens accessibles sont les suivantes
- s'en tenir à une stratégie de liens intentionnelle : n'ajouter des liens qu'aux images essentielles et éviter de lier les images décoratives ;
- utiliser un texte de lien descriptif pour indiquer clairement où mène le lien, en évitant les phrases génériques telles que « en savoir plus “ ou ” cliquez ici ; »
- veiller à ce que le texte alt des images liées décrive la destination du lien ;
- s'assurer que les liens se distinguent en utilisant des méthodes de mise en forme telles que le soulignement ou le gras plutôt que de s'appuyer uniquement sur la couleur ;
- dans la mesure du possible, encapsuler les liens dans des boutons d'appel à l'action afin d'aider les personnes malvoyantes ou souffrant d'un handicap moteur à cliquer dessus.
Étape 4. Optimiser la conception des e-mails pour l'accessibilité
En raison de sa complexité, cette étape est divisée en plusieurs groupes.
Groupe 1 : Lignes directrices sur l'accessibilité de la mise en forme du texte
Handicaps couverts : les personnes malvoyantes, celles qui utilisent des lecteurs d'écran et les personnes dyslexiques.
- éviter d'utiliser des majuscules, car elles peuvent être mal interprétées par les personnes atteintes de dyslexie et les lecteurs d'écran peuvent les lire comme des abréviations ;
- inclure des signes de ponctuation à la fin des puces et des titres ;
- minimiser l'utilisation de l'italique et du gras pour mettre l'accent ; éviter complètement l'italique gras ;
- ne souligner le texte que s'il s'agit d'un lien hypertexte ;
- opter pour une taille de corps de texte de 16 px pour la lisibilité ;
- utiliser des polices accessibles telles que opendyslexic, comic sans, et des options sans-serif comme arial, verdana, tahoma, century gothic, trebuchet, calibri et open sans ;
- alignez votre texte à gauche sans justification ni ajout de sauts de ligne.
Bien que le critère de réussite 1.4.8 (conformité AAA) le permette, les meilleures pratiques recommandent d'éviter le texte justifié pour les raisons mentionnées. Alignez le texte d'un seul côté.
Groupe 2 : Travailler avec les couleurs
Handicaps couverts : Les personnes daltoniennes, malvoyantes et dyslexiques.
Expert
- assurer un contraste de couleur suffisant entre le texte et les images ;
- utiliser des arrière-plans unicolores - pour les textes en dessous de 18px gras et 24 normal, il doit être de 4:5:1, tandis que pour les textes au-dessus, il doit être de 3:1 ;
- choisir des polices gris foncé sur fond blanc cassé plutôt que noir vif sur blanc vif ;
- éviter d'utiliser uniquement les couleurs pour mettre en évidence les informations importantes dans les emails ;
- lors de l'utilisation d'images pour indiquer les bonnes ou mauvaises réponses (avec du rouge et du vert, respectivement) ou les tendances dans les chiffres, compléter par des descriptions textuelles ou des signes "+" et "-" pour plus de clarté.
(Source: Email de HubSpot)
Groupe 3 : travail sur l'imagerie
Handicaps couverts : Les personnes daltoniennes, malvoyantes, dyslexiques et épileptiques photosensibles.
Lorsque vous travaillez avec des GIF et des images, n'oubliez pas de :
- utiliser des GIF avec trois flashs ou moins par seconde ;
- utiliser une image animée (GIF) par écran ;
- maintenir le contraste des couleurs comme indiqué précédemment ;
- inclure un texte alt significatif pour les images. Pour les GIF qui transmettent des instructions ou des informations importantes, fournir des descriptions supplémentaires sous le GIF.
Étape 5. Répondre aux exigences d'accessibilité d'un code email
Handicaps couverts : soutient les personnes qui utilisent des lecteurs d'écran et d'autres types de technologies d'assistance.
Pour en savoir plus sur l'accessibilité des emails et les technologies d'assistance, consultez notre webinaire avec Sarah Gallardo et Dmytro Kudrenko.
Nous ne citerons que les plus importants :
- définir l'attribut lang à la fois dans l'élément <html> et dans les enfants directs de l'élément <body>. Cette redondance est nécessaire car certains clients email peuvent le supprimer de l'élément <html> ;
- envelopper le contenu dans le <body> avec un attribut dir pour la directionnalité ;
- attribuer aux éléments <table> le rôle="presentation" ou le rôle="none" à l'attribut role.
Si vous utilisez Stripo, vous n'avez pas à vous soucier de vous assurer que les emails HTML sont optimisés pour les lecteurs d'écran, car tous les emails construits avec Stripo sont déjà entièrement optimisés.
Outils permettant de vérifier si vos emails sont conformes à toutes les bonnes pratiques en matière d'accessibilité des emails.
Lorsque vous avez terminé vos campagnes d'email, vérifiez-les avec des outils de test d'accessibilité et/ou essayez-les avec des lecteurs d'écran.
Vous devez manger votre propre nourriture pour chien. Cela signifie qu'il faut tester, toujours tester le résultat.
Mike Paciello,
Voici les outils qui vous aideront à consulter vos emails :
- accessible-email.org par Jordie van Rijn et Maarten Lierop - cet outil vérifie si le code de votre email est compatible avec n'importe quel lecteur d'écran. Il peut même vous aider à l'optimiser ;
- Accessibility Checker, Parcel est un outil qui vous aide à évaluer les pratiques exemplaires et les problèmes d'accessibilité de vos emails. Il classe les problèmes identifiés par ordre de gravité : critique, grave, modéré et léger. Il est ainsi plus facile d'établir un ordre de priorité pour les correctifs ;
- Campaign Precheck par Email on Acid — il vérifie si votre email est optimisé pour les appareils d'assistance ;
- Accessible Colors pour vérifier le contraste des couleurs du corps de l'email (texte et autres éléments, à l'exclusion des images) ;
- WebAIM (web accessibility in mind) — vérificateur de contraste des couleurs. Il prend en compte non seulement les couleurs, mais aussi la taille des polices dans chaque cas ;
- Coblis, simulateur de daltonisme - il indique si vos images sont accessibles aux daltoniens ;
- Trace RERC (PEAT) pour vérifier que vos GIF respectent les limites recommandées en matière de fréquence de clignotement.
Experts et ressources pour en savoir plus sur l'accessibilité numérique et l'accessibilité des emails
Dans cet article, nous avons partagé les pratiques essentielles pour l'accessibilité dans les emails et compilé une liste de ressources clés et d'experts à suivre pour plus d'informations sur le sujet.
- Sarah Gallardo, En tant que développeur principal d'emails chez Oracle, Sarah Gallardo est une spécialiste reconnue de l'accessibilité des emails. Elle propose des lignes directrices et des normes d'accessibilité détaillées. Son expertise aide les organisations à s'aligner sur les meilleures pratiques en matière d'accessibilité grâce à du matériel pédagogique approfondi.
- Mike Paciello, responsable de l'accessibilité chez AudioEye, sensibilise activement les marques à l'importance de l'accessibilité en s'appuyant sur les statistiques et les informations les plus récentes. Son travail est essentiel pour inciter les entreprises à mettre en œuvre l'accessibilité et à en faire une priorité.
- Thomas Logan fournit des conseils d'expert en matière d'accessibilité, aidant les organisations à s'assurer que leur contenu numérique est accessible à tous. Ses services comprennent des formations, des audits complets et des conseils stratégiques qui respectent des normes d'accessibilité strictes.
- Mark Robbins, défenseur de l'accessibilité des emails, partage son expertise en fournissant des conseils pratiques et des solutions innovantes pour les spécialistes de l'email marketing. Son souci de rendre les communications par email accessibles profite aussi bien aux expéditeurs qu'aux destinataires.
- Paul Airy, spécialisé dans la conception et le développement d'emails, applique la science du comportement pour améliorer la convivialité et l'accessibilité des emails. Son approche permet non seulement d'améliorer l'expérience utilisateur, mais aussi de s'assurer que les emails sont compréhensibles et navigables pour tous.
- WCAG définissent les normes internationales en matière d'accessibilité, en fournissant un cadre qui détaille la manière dont le contenu numérique peut être rendu accessible aux personnes handicapées. Ces règles et lignes directrices en matière d'accessibilité sont essentielles pour les développeurs et les créateurs de contenu du monde entier.
- Email markup consortium par Parcel, dirigé par des experts en accessibilité, dont Mark Robbins, fournit des documents essentiels pour améliorer l'accessibilité des emails. Il comprend un rapport trimestriel, un glossaire détaillé et une liste d'erreurs courantes avec des solutions, le tout visant à améliorer les normes de l'industrie.
- A11y.email, géré par Sarah Gallardo, est un blog qui propose des documents détaillés sur l'accessibilité des emails, couvrant des sujets tels qu'un texte alt efficace, des liens significatifs, du HTML sémantique et des contrastes de couleurs. Il fournit également des outils et des techniques pour tester l'accessibilité des emails, ce qui le rend idéal pour les développeurs d'emails et les spécialistes du marketing.
- AudioEye, dirigé par Mike Paciello, offre une mine d'informations sur l'accessibilité numérique. Il propose des articles sur les meilleures pratiques, les directives de conformité et les dernières tendances en matière d'accessibilité, afin d'aider les marques à s'assurer que leur contenu numérique est inclusif et accessible à tous les utilisateurs.
- Le blog Equal Entry, dirigé par Thomas Logan, fournit des articles détaillés sur l'accessibilité numérique. Il couvre les bonnes pratiques et les sujets innovants comme la GenAI dans l'accessibilité des emails, du web et des jeux vidéo, visant à rendre les contenus numériques inclusifs pour tous.
- L'association britannique de la dyslexie sensibilise et soutient les personnes atteintes de dyslexie, en fournissant des ressources, des informations et des lignes directrices pour créer et rendre le contenu numérique accessible et adapté à la dyslexie.
- L'Université de Yale propose des articles et des ressources sur l'accessibilité du web, y compris les meilleures pratiques pour créer des liens accessibles et d'autres contenus numériques.
Conclusion
La création de courriels accessibles est un élément essentiel des stratégies de communication inclusive qui profitent non seulement aux personnes handicapées, mais aussi à tous les destinataires d'emails. La grande prévalence des problèmes d'accessibilité dans les conceptions actuelles d'emails met en évidence le besoin urgent de sensibilisation et de mise en œuvre des meilleures pratiques. En adoptant les lignes directrices complètes décrites dans cet article, les spécialistes du marketing et les développeurs peuvent améliorer considérablement l'expérience utilisateur pour un large public, en veillant à ce que les emails soient non seulement lisibles, mais aussi réellement accessibles à tous. Cette approche permet non seulement d'améliorer l'engagement, mais reflète également un engagement en faveur de l'inclusion dans les communications numériques.
0 commentaires