Le daltonisme peut modifier la manière dont certaines couleurs sont perçues. Sur un site web, cela devient un problème lorsque la couleur est le seul moyen de comprendre une information, distinguer un état ou repérer une action.
Un site accessible ne doit donc pas simplement “avoir de belles couleurs”. Il doit rester compréhensible lorsque certaines teintes sont difficiles à distinguer, que le contraste est faible ou que l’utilisateur adapte l’affichage à ses besoins.
Pourquoi le daltonisme concerne-t-il l’accessibilité web ?
Les formes de daltonisme ne produisent pas toutes la même perception. La protanopie et la deutéranopie affectent notamment la perception de certaines différences entre rouges et verts, tandis que la tritanopie concerne davantage certaines différences entre bleus et jaunes.
Le problème n’est pas d’interdire ces couleurs. Il faut surtout éviter qu’une information essentielle repose uniquement sur leur différence.
Une couleur seule ne doit pas porter l’information
Un exemple classique est un formulaire où les champs corrects deviennent verts et les champs en erreur rouges, sans autre indication. Une personne qui distingue difficilement ces couleurs peut ne pas comprendre ce qui doit être corrigé.
Une meilleure approche consiste à combiner plusieurs signaux :
- une couleur ;
- un texte explicite ;
- une icône ou un symbole lorsque cela aide à comprendre ;
- un libellé ou un message d’erreur associé au champ concerné.
La même logique s’applique aux graphiques, tableaux, boutons, statuts, disponibilités et indicateurs de progression.
Le contraste reste essentiel
Le daltonisme et le contraste sont deux sujets liés mais différents. Même lorsqu’une couleur est identifiable, un texte peut rester difficile à lire si son contraste avec l’arrière-plan est insuffisant.
Les WCAG 2.2 définissent notamment des critères de contraste pour le texte et certains éléments d’interface. Pour du texte courant, le rapport attendu est généralement d’au moins 4,5:1, avec des règles adaptées pour les textes de grande taille. Certains composants graphiques et éléments d’interface sont également concernés par des exigences de contraste.
Ces valeurs servent de référence technique, mais une vérification utile doit aussi tenir compte du contexte réel : taille du texte, état du composant, survol, focus, mode sombre et utilisation sur mobile.
Comment concevoir un bouton ou un lien plus robuste ?
Un bouton ne devrait pas être reconnaissable uniquement parce qu’il est vert ou doré. Sa forme, son libellé, son contraste et son comportement doivent aussi permettre de comprendre qu’il s’agit d’une action.
Pour les liens intégrés dans un paragraphe, la couleur peut être complétée par un soulignement ou un autre indice visuel suffisamment clair lorsque le contexte le nécessite.
Comment rendre un graphique compréhensible sans dépendre des couleurs ?
Un graphique peut devenir difficile à lire lorsque plusieurs séries se distinguent uniquement par des couleurs proches. Pour améliorer sa compréhension, on peut combiner les couleurs avec :
- des libellés directement associés aux données ;
- des motifs ou styles de lignes différents ;
- des symboles distincts ;
- une légende claire ;
- une version textuelle des informations importantes lorsque nécessaire.
L’objectif est que le sens du graphique ne disparaisse pas si les couleurs sont perçues différemment.
Protanopie, deutéranopie et tritanopie : faut-il créer trois versions du site ?
Non. Il n’est normalement pas nécessaire de créer une version séparée du site pour chaque profil de perception des couleurs.
La priorité consiste à construire une interface qui ne dépend pas exclusivement de la couleur, qui possède des contrastes suffisants et qui utilise plusieurs moyens pour transmettre l’information.
Des profils d’affichage peuvent ensuite offrir un confort supplémentaire à certains utilisateurs. Ils doivent être considérés comme une aide complémentaire, pas comme un remplacement des bonnes pratiques d’accessibilité du site.
Comment tester les couleurs d’un site web ?
Un premier contrôle consiste à parcourir les pages principales et à rechercher tous les endroits où la couleur semble porter une information : erreurs, succès, boutons, liens, graphiques, statuts, alertes ou sélections.
Il faut ensuite vérifier si cette information reste compréhensible sans se fier uniquement à la couleur. Les contrastes doivent également être contrôlés dans les différents états de l’interface, notamment au repos, au survol, au focus et lorsqu’un élément est désactivé.
Les simulations de profils de daltonisme peuvent aider à repérer certains problèmes visuels, mais elles ne remplacent pas les autres contrôles d’accessibilité ni l’analyse du fonctionnement réel de l’interface.
Le panneau d’accessibilité suffit-il ?
Non. Un panneau proposant des profils de couleurs, un contraste renforcé ou d’autres réglages peut améliorer le confort d’utilisation. Le site doit toutefois rester accessible sans obliger l’utilisateur à ouvrir ce panneau.
Chez DOMMAT, ces options sont donc considérées comme des fonctionnalités de confort supplémentaires. La base reste une conception qui tient compte des contrastes, de la structure, du clavier, du zoom, des formulaires et des différents moyens de transmettre l’information.
Que peut vérifier un audit d’accessibilité ?
Un audit peut notamment contrôler si les contrastes sont suffisants, si une information dépend uniquement d’une couleur, si les états d’un composant restent compréhensibles et si les principaux parcours restent utilisables dans différentes conditions d’affichage.
Pour aller plus loin, découvrez ce que vérifie un audit d’accessibilité web, consultez l’approche Accessibilité DOMMAT ou lisez notre article sur l’agrandissement du texte et le zoom.
Vous pouvez également présenter votre besoin d’accessibilité.