Comment créer des e-mails plus accessibles

Que vous soyez propriétaire d’une entreprise ou spécialiste du marketing ou que vous attachiez tout simplement beaucoup d’importance à l’inclusivité, comprendre les principes de la conception d’e-mails accessibles constitue une étape cruciale vers un paysage numérique plus inclusif. La création d’e-mails accessibles n’est pas seulement un signe de bienveillance. Il peut s’agir d’une obligation légale dans votre entreprise et ces e-mails constituent la base d’une expérience utilisateur exceptionnelle.

Voici cinq conseils simples à suivre pour rédiger des e-mails chaleureux, informatifs et utilisables par des personnes ayant des besoins et des préférences très variés. 

Remarque : ce guide est proposé comme ressource pour vous aider à démarrer, mais il ne doit en aucun cas être considéré comme un document juridique. Squarespace ne peut pas vous fournir de conseils sur la conformité de votre site à aucune loi, réglementation et norme spécifiques en matière dʼaccessibilité du web.

1. Ajouter un texte de remplacement aux images

Le texte de remplacement est la description d’une image qui peut être captée par des technologies d’assistance. Cet outil est utile non seulement pour les personnes souffrant de déficiences visuelles, mais aussi pour :

• Les personnes souffrant de déficiences cognitives qui peuvent mieux comprendre le langage parlé que le visuel

• Les personnes utilisant des assistants vocaux lorsqu’elles ne consultent pas l’e-mail

• Les utilisateurs qui peuvent ne pas avoir accès aux images à cause d’un problème de connexion

• Les utilisateurs qui préfèrent ne pas télécharger les images pour des raisons liées au temps ou au coût

Ajouter un texte de remplacement à vos images permet de garantir que tous les lecteurs peuvent accéder aux informations les plus importantes de votre e-mail. Pour savoir quand ajouter un texte de remplacement et rédiger des descriptions utiles, posez-vous les questions suivantes :

1. L’image est-elle décorative ou véhicule-t-elle des informations ? Les images décoratives nécessitent un texte de remplacement vide étant donné qu’il est peu probable qu’elles aident les utilisateurs à mieux comprendre les informations de votre e-mail.

2. Quelles informations faut-il donner sur une image ? Toutes les parties d’une image ne servent pas à illustrer son objectif. Par exemple, la couleur de l’arrière-plan d’un portrait n’est pas nécessaire, mais le nom de la personne figurant sur la photo peut l’être. 

Lorsque vous rédigez un texte de remplacement, gardez ces autres directives à l’esprit.

• Limitez votre texte de remplacement à 250 caractères. Si une image nécessite une description plus longue et plus détaillée, incluez une légende pour la description complète. 

• N’incluez pas « une image de » ou « une photo de » dans votre description. Les technologies d’assistance identifieront les images pour les utilisateurs, de sorte que vous n’ayez pas à le faire.

Découvrir d’autres conseils pour rédiger un texte de remplacement utile

2. Structurer les e-mails avec des en-têtes

La façon dont votre contenu est organisé dans votre e-mail affecte la manière dont les personnes utilisant des technologies d’assistance le parcourront. Pour faciliter la navigation par ces technologies dans la plupart des e-mails, vous devez créer une disposition simple et cohérente et faire en sorte que les noms de chaque section de l’e-mail soient clairs et distincts.

Vous pouvez faire en sorte que la structure de votre e-mail soit facile à suivre en utilisant des en-têtes (par exemple, H1, H2, H3) plutôt que d’utiliser du texte en gras ou en italique pour séparer les différentes sections de votre e-mail. Utilisez un seul H1 par e-mail étant donné qu’un H1 indique le titre ou l’accroche, et utilisez les niveaux de titre dans l’ordre, plutôt que de passer d’un H2 à un H4, par exemple. 

Pour faciliter la lecture rapide de vos e-mails, utilisez une combinaison de tailles, d’épaisseurs et de styles de police ou même de couleurs pour différencier un paragraphe normal d’un titre. Par exemple, les polices plus grasses et plus grandes ont tendance à attirer l’attention. Il est donc préférable de les appliquer au texte que vous souhaitez mettre en valeur, comme les en-têtes de section.

3. Penser au type et à la taille de police

La lisibilité est un élément important de l’accessibilité de vos e-mails. En faisant des choix judicieux en matière notamment de taille, de style, de couleur et d’espacement de la police, vous permettez aux lecteurs de naviguer plus facilement dans votre contenu. 

Style de police 

Essayez de choisir une police lisible avec des lignes épurées et très peu d’éléments décoratifs. En règle générale, les polices sans serif, comme Arial, Calibri, Tahoma et Helvetica, ont tendance à mieux se lire sur les écrans. Ces polices permettent généralement aux lecteurs de parcourir plus facilement vos e-mails et de comprendre rapidement votre message, ce qui est très utile car de nombreuses personnes lisent leurs messages en diagonale sur leurs appareils mobiles. 

La plupart des clients de messagerie utilisent par défaut la police sans serif s’ils ne prennent pas en charge la police que vous utilisez pour une meilleure lisibilité sur toutes les plateformes et tous les appareils. Si vous avez besoin de conseils supplémentaires sur les options de police, vous pouvez également trouver une liste des polices accessibles et open source sur le site web de U.S. Web Design System. 

Taille de police

La taille de police que vous sélectionnez a un impact important sur la lisibilité de votre e-mail, en particulier pour les personnes malvoyantes. Nous vous conseillons d’opter pour une taille de police d’au moins 16 px (selon le type de police que vous utilisez).

Pensez à tester différentes tailles lors de la rédaction de votre message, car la lisibilité peut varier en fonction de la police. Il est également important d’envoyer un e-mail de test avant de l’envoyer à vos abonnés afin de voir à quoi ressemblent vos choix de design sur différents appareils et écrans.

Couleur de police 

Sélectionnez une couleur de police qui se détache clairement du reste de la couleur d’arrière-plan (comme une police noire sur un fond blanc). Plus le contraste est élevé, plus votre contenu sera lisible. 

Bien que certaines couleurs puissent sembler contrastantes (comme le vert et le rouge), les personnes qui lisent votre contenu et qui ont une déficience visuelle (comme le daltonisme rouge-vert) peuvent ne pas être en mesure de voir votre contenu. Vous pouvez utiliser un vérificateur de contraste des couleurs pour vous assurer que votre texte est lisible sur votre arrière-plan.

4. Utiliser un texte descriptif pour les liens

Si vous créez un lien hypertexte sur du texte, donnez des intitulés adaptés à vos liens. Les technologies d’assistance indiquent généralement lorsqu’un lien est présent dans le texte. Il n’est donc pas nécessaire d’inclure le mot « lien » dans votre contenu. 

Lorsque vous redirigez les utilisateurs vers une page Contact, par exemple, il est préférable d’écrire « Contactez-nous sur notre page Contact » plutôt que « Pour nous contacter, cliquez ici ». En général, il est plus facile de savoir où mènera un lien s’il suffit de lire le texte du lien sans lire le texte qui l’entoure.

Pour finir, assurez-vous que vos liens sont visuellement distincts du reste du texte qui les entoure afin que les lecteurs sachent qu’il ne s'agit pas d’un texte normal. Vous pouvez par exemple utiliser une couleur différente, le mettre en italique ou le souligner. Vous pouvez aussi utiliser une icône ou un bouton.

5. Éviter d’utiliser des GIF

Les GIF peuvent égayer les e-mails et les rendre plus intéressants, mais vous devez tenir compte du contexte et des lecteurs, car ils peuvent limiter l’accessibilité. Ils peuvent ne pas être compatibles avec les lecteurs d’écran, ce qui complique la compréhension du contenu de l’e-mail par les personnes malvoyantes. 

Les GIF peuvent être riches en informations, car ils ont tendance à afficher plus de détails ou à transmettre plus de renseignements qu’une image statique. Il peut être difficile de fournir un texte de remplacement approprié pour aider les utilisateurs de technologies d’assistance à les comprendre. Ils peuvent également être une source de distraction, créer une perturbation visuelle et détourner l’attention du message principal de l’e-mail.

Si vous décidez d’ajouter un GIF à votre e-mail, essayez d’ajouter un GIF avec des mouvements lents qui ne clignote pas et ne rebondit pas plus de trois fois par seconde, car cela peut être très désorientant pour certains lecteurs. Si possible, autorisez le lecteur à suspendre la lecture du GIF et incluez toujours un texte de remplacement le décrivant pour ceux qui ne peuvent pas voir l’image.  

Lire notre guide sur l’accessibilité web