L’accessibilité : votre bonne résolution de l’année ?

L’importance de l’accessibilité

Premièrement, les personnes concernées par des problèmes d’accessibilité sont plus nombreuses qu’il n’y paraît. D’après l’OMS, près d’un milliard de personnes sont atteintes d’une déficience visuelle. Oui, oui, cela fait bien plus d’une personne sur dix !

Deuxièmement, ne pas proposer une version accessible de ses emails a un impact critique : l’impossibilité pour certaines personnes d’utiliser l’information qu’ils contiennent. En termes d’usabilité, c’est donc bien plus gênant qu’un email qui n’est pas responsive au pixel près (même si nous sommes d’accord, cela n’est pas terrible non plus).

Si nous mettons en perspective les deux points précédents avec le temps et l’effort que l’on passe à optimiser nos emails pour qu’ils s’affichent parfaitement sur Outlook.com – qui représente moins de 1% du marché – c’est bien qu’il y a quelque à faire côté accessibilité.

En plus de l’argument éthique, il y a également un point de vue business à prendre en compte. Ne pas rendre vos emails accessibles, c’est aussi vous priver d’une audience significative.

Et si vous n’avez ni morale ni intérêt commercial (ce qui nous étonnerait tout de même beaucoup), sachez que des lois sont en train d’être mises en place pour rendre l’accessibilité obligatoire.

Les étapes à suivre pour concevoir un email accessible

Super, vous êtes toujours là. C’est donc qu’a priori nous avons réussi à vous convaincre. Alors comment fait-on ? Lorsque l’on parle d’accessibilité, il est généralement possible de découper le problème en 3 catégories. Il y a beaucoup de choses qui peuvent être améliorées, mais nous allons nous concentrer ici sur les pratiques les plus faciles à mettre en place pour optimiser l’accessibilité de vos emails.

Le contenu

En général, votre email est construit autour d’un contenu à partager. Assurez-vous que ce contenu est accessible en vérifiant notamment que :

• Le sujet et les liens sont descriptifs. Évitez les "cliquez ici" ou "ouvrez-moi". Les personnes qui ont recours à une liseuse peuvent ainsi facilement savoir à quoi s’attendre.

• Le contenu est textuel. Les images ne comportent pas d’information importante et sont toutes accompagnées d’un texte alternatif (l’attribut "alt"). Et n’abusez pas des GIFs (à prononcer jif, bien sûr).

• Chaque paragraphe traite d’un sujet particulier et reste court. Ceci est non seulement important pour les personnes ayant recours à une liseuse (ne pouvant donc pas se permettre de lire le texte en diagonal), mais aussi pour les personnes atteintes de dyslexie ou autre trouble de l’apprentissage.

• Le contenu est facile d’accès. Évitez les tournures de phrases alambiquées et préférez plutôt les formulations et mots simples. 

Le design

Maintenant que vous avez un contenu parfait, vous allez vouloir le rendre beau comme tout. Oui, mais c’est là que ça se gâte. Point de vue design, faites attention à :

• Privilégier un sens de lecture logique. Généralement de gauche à droite et de haut en bas. À moins de créer un email pour Arlequin, évitez le design en patchwork.

• Choisir des polices suffisamment épaisses et dans une taille suffisamment grande

  (supérieure à 14px). Cela sera plus facile maintenant que vous avez raccourci votre contenu. N’oubliez pas non plus d’augmenter la line-height (hauteur minimale de ligne) pour que le contenu respire et soit facilement lisible.

• Éviter les paragraphes centrés et justifiés. Privilégiez le sens naturel de lecture et l’espace entre les mots (qui peut être déformé par la justification du texte).

• Proposer un contraste fort. Point bonus, ceci servira tous vos utilisateurs puisqu’un contraste trop faible rend la lisibilité difficile en fonction des conditions d’éclairage. Pensez aussi au "dark mode" introduit sur un nombre grandissant de clients de messagerie et navigateurs.

• Rendre ses liens et boutons faciles d’accès. Assurez-vous que les liens sont soulignés et colorés avec un contraste suffisant, et qu’ils sont faciles à cliquer ou toucher sur mobile/tablette. À l’inverse, évitez de colorer et souligner un texte qui n’est pas un lien.

Le code

Maintenant que vous avez le contenu et le design, vous allez pouvoir passer à l’implémentation. Pour pas gâcher tout le travail de vos amis rédacteurs et designers, assurez-vous de :

• Respecter la sémantique HTML. Les paragraphes viennent en bandes organisées et sont précédés de titres descriptifs. Faites donc bon usage des balises p et h* notamment.

• Définir la langue de son email avec l’attribut lang. Très facile à mettre en place, cela permettra aux liseuses de prononcer le contenu correctement.

• Inclure l’attribut role=presentation sur le tag HTML table. Cela permet aux liseuses de comprendre qu’il s’agit d’un élément de présentation et non d’un tableau de données, raison d’être initiale de ce tag ennemi numéro un des développeurs d’email.

• Proposer une version texte. Eh oui, comme encore trop d’emails sont envoyés sans respecter toutes ces bonnes pratiques, de nombreux utilisateurs préfèrent la version texte. Vous devriez être capables de générer celle-ci automatiquement depuis votre plateforme d’envoi, donc vous n’avez aucune excuse pour ne pas le faire.

Les outils pour passer à l’action

Alors oui, nous savons que vous êtes déjà très occupés et que cela fait une chose de plus à vérifier alors que vous passez déjà un temps fou à tester vos emails sur Lotus Notes et autres. Mais ne vous inquiétez pas, fort heureusement il existe des apps pour vous faciliter la vie.

À vrai dire, il y a beaucoup d’outils qui permettent de tester tout un tas de choses : lisibilité, sémantique, etc. Bien que ces outils fassent très bien leur travail, essayer de les intégrer dans son processus est trop manuel et chronophage, et se limite donc souvent à une bonne résolution qui ne sera sûrement jamais tenue, on vous connaît.

Nous vous recommandons donc plutôt accessible-email pour démarrer. Cet outil analyse un fichier HTML et renvoie les erreurs et choses à améliorer pour rendre l’email accessible. C’est donc très facile à intégrer à un workflow, tant pour vérifier son email avant l’envoi que pour mettre en place les bonnes pratiques.

Si vous souhaitez en apprendre plus, que ce soit parce que le sujet vous intéresse ou par crainte d’être remplacé(e) par une machine comme accessible-email, nous recommandons les checklists WCAG disponibles sur le site wuhcag. Ces checklists sont organisés en niveau (débutant, intermédiaire, avancé) et sont un excellent moyen de monter en compétences au fur et à mesure qu’on les utilise.

En conclusion

Encore une fois, nous savons bien que mettre en place des emails accessibles peut sembler compliqué, surtout si l'on considère tous les autres tests que vous réalisez déjà pour vous emailings. Mais, en suivant les bonnes pratiques en termes de contenu, de design et de code, on vous promet que vous pourrez facilement concevoir des emails qui toucheront toutes les personnes de votre audience et leur offriront une bonne expérience utilisateur.

Nous espérons que cet article vous aidera à faire de l’accessibilité une priorité et vous aura d’une part permis de réaliser que c’est important, et d’autre part que ce n’est pas si dur à mettre en place.

Vous voulez rester au courant des dernières tendances et actualités dans le monde de l’email ? Inscrivez-vous à notre newsletter et retrouvez-nous sur les réseaux sociaux : Twitter et LinkedIn.