Qu'est-ce que le daltonisme ? Types, causes et impact sur le design

Le daltonisme touche environ 300 millions de personnes dans le monde — soit environ 1 homme sur 12 et 1 femme sur 200. C'est l'un des traits génétiques les plus courants dans la population humaine, et pourtant la majorité des interfaces visuelles sont encore conçues avec l'hypothèse implicite que tous les utilisateurs perçoivent le spectre visible de la même façon.

Comprendre le daltonisme — ses bases biologiques, ses différents types et ses implications pour le design — n'est pas simplement une case à cocher en matière d'accessibilité. C'est une compétence pratique pour tout designer, développeur ou chef de produit qui souhaite que son travail communique clairement à l'ensemble des utilisateurs qui le rencontreront.

Comment fonctionne la vision humaine des couleurs

Avant d'examiner ce qui se passe mal dans le daltonisme, il est utile de comprendre comment la vision normale des couleurs fonctionne.

La rétine au fond de l'œil contient deux types de photorécepteurs : les bâtonnets et les cônes. Les bâtonnets sont responsables de la vision en faible luminosité et de la vision périphérique, mais ne distinguent pas les couleurs. Les cônes sont les cellules sensibles aux couleurs, et ils existent en trois types :

• Cônes L (longue longueur d'onde) : sensibilité maximale autour de 560 nm, dans la gamme rouge-orange
• Cônes M (moyenne longueur d'onde) : sensibilité maximale autour de 530 nm, dans la gamme verte
• Cônes S (courte longueur d'onde) : sensibilité maximale autour de 420 nm, dans la gamme bleu-violet

La vision normale des couleurs — la trichromatique — résulte du fonctionnement correct des trois types de cônes. Le cerveau compare les signaux relatifs des cônes L, M et S pour dériver la perception de la teinte, de la saturation et de la luminosité.

Le système visuel humain utilise un modèle de couleurs opponentes en interne : les signaux des trois types de cônes sont combinés en :

• Canal de luminance (L+M) : informations de luminosité
• Canal rouge-vert (L-M) : discrimination chromatique entre le rouge et le vert
• Canal bleu-jaune (S-(L+M)) : discrimination chromatique entre le bleu et le jaune

Le daltonisme résulte généralement de l'absence, du mauvais fonctionnement ou d'une sensibilité altérée d'un ou plusieurs types de cônes, perturbant ces canaux opponentes.

La génétique du daltonisme

Les formes les plus courantes de daltonisme sont héritées selon un mode récessif lié à l'X. Les gènes codant pour les cônes L et M sont situés sur le chromosome X. Les hommes (XY) n'ayant qu'un seul chromosome X, un seul gène affecté entraîne le daltonisme. Les femmes (XX) nécessitent deux copies affectées — une sur chaque chromosome X — pour être daltoniennes ; si une seule est affectée, elles sont porteuses mais ont généralement une vision des couleurs normale ou quasi-normale.

C'est pourquoi le daltonisme est beaucoup plus courant chez les hommes (environ 8 %) que chez les femmes (environ 0,5 %) dans les populations d'ascendance européenne. La prévalence varie selon l'origine ethnique, étant légèrement plus faible dans les populations est-asiatiques et africaines.

Le déficit en cônes S (tritanopie) est codé sur le chromosome 7, pas sur le chromosome X, il affecte donc les hommes et les femmes à égalité — bien qu'il soit également beaucoup plus rare.

Deutéranopie et protanopie : daltonisme rouge-vert

Les formes les plus courantes de daltonisme impliquent le système de discrimination rouge-vert — la paire de cônes L et M. Ces pathologies affectent ensemble environ 8 % des hommes d'ascendance européenne.

Deutéranomalie et deutéranopie

La deutéranomalie est la forme la plus courante de déficit de vision des couleurs dans l'ensemble, touchant environ 5 % des hommes. Elle implique une sensibilité réduite ou décalée des cônes M (verts), réduisant la discrimination rouge-vert sans l'éliminer.

La deutéranopie est l'absence complète ou la non-fonctionnalité des cônes M, affectant environ 1 % des hommes. Sans cônes sensibles au vert fonctionnels, les deutéranopes sont des dichromates — ils voient les couleurs selon un axe plutôt que deux, réduisant considérablement le nombre de couleurs distinguables.

Pour les deutéranopes et les personnes atteintes de deutéranomalie sévère :

• Le rouge et le vert se confondent : les deux peuvent apparaître comme un brun-jaune similaire ou de l'olive
• L'orange, le jaune et le vert tombent dans une gamme perceptuelle similaire
• Le bleu et le violet sont relativement inaffectés et distinguables
• La couleur #00FF00 (vert pur) et #FF0000 (rouge pur) peuvent apparaître comme des nuances de brun-jaunâtre presque identiques

La deutéranopie ne réduit pas significativement la perception globale de la luminosité, car le canal de luminance repose sur les cônes L+M — et les cônes L seuls peuvent encore fournir des informations de luminance.

Protanomalie et protanopie

La protanomalie implique une sensibilité réduite ou décalée des cônes L (rouges), affectant environ 1 % des hommes. La protanopie est l'absence complète de cônes L fonctionnels, affectant également environ 1 % des hommes.

La protanopie et la deutéranopie produisent une confusion rouge-vert similaire, mais avec des différences clés :

• Le rouge paraît beaucoup plus sombre : comme le cône L contribue fortement au canal de luminance, les protanopes voient les objets rouges comme significativement plus sombres qu'ils ne le sont réellement. Un rouge #FF0000 peut paraître presque noir à un protanope.
• Les feux rouges de la circulation peuvent être difficiles à voir la nuit
• Le rouge foncé et le noir se confondent facilement
• La palette perceptuelle globale est décalée, avec moins de discriminabilité dans la gamme des longues longueurs d'onde (rouge-orange)

Ce brunissement du rouge est une distinction pratiquement importante : alors que les deutéranopes et les protanopes confondent des couleurs similaires, les protanopes ont en plus des difficultés avec les éléments rouges à faible luminance qui peuvent être critiques pour la sécurité.

Implications design du daltonisme rouge-vert

La catégorie de confusion rouge-vert est la plus importante pour le design UI parce que :

1. Les métaphores de feux de circulation (vert = bon, rouge = mauvais/erreur) sont extrêmement courantes dans les patterns UI
2. Les graphiques utilisent fréquemment le rouge et le vert pour distinguer les lignes, barres ou séries
3. La validation de formulaires utilise souvent le rouge pour les erreurs et le vert pour le succès
4. Les interfaces financières utilisent le rouge pour les pertes et le vert pour les gains

Tous ces patterns échouent pour une proportion significative d'utilisateurs. Le rouge et le vert ne doivent jamais être la seule caractéristique différenciante des éléments d'interface adjacents.

Tritanopie : daltonisme bleu-jaune

La tritanomalie (sensibilité réduite des cônes S) et la tritanopie (cônes S absents) affectent l'axe de discrimination bleu-jaune. Contrairement aux déficits rouge-vert, la tritanopie touche les hommes et les femmes à égalité et est beaucoup plus rare — environ 0,01 % de la population.

Pour les tritanopes :

• Le bleu et le vert se confondent (les deux peuvent paraître similaires)
• Le jaune et le violet se confondent
• Le rouge et le rose sont difficiles à distinguer du jaune-orange
• La vision nocturne est parfois aussi affectée, car les cônes S contribuent à la vision scotopique (en faible luminosité)

Couleurs fréquemment confondues par les tritanopes :

• #0000FF (bleu) et #008000 (vert) — peuvent apparaître comme des tons grisâtres similaires
• #FFFF00 (jaune) et #FF69B4 (rose vif) — les deux peuvent apparaître comme des oranges pâles similaires
• #00FFFF (cyan) et #FFFFFF (blanc) — peuvent être difficiles à distinguer

Bien que la tritanopie soit rare, le principe design qu'elle impose — ne pas utiliser les distinctions bleu-jaune comme seule caractéristique différenciante — bénéficie également aux utilisateurs âgés, dont le jaunissement du cristallin peut décaler la perception du bleu, et aux utilisateurs regardant des écrans sous un éclairage artificiel chaud.

Achromatopsie : daltonisme total

L'achromatopsie (monochromatie des bâtonnets) est l'absence complète de cellules cônes fonctionnelles. Les personnes atteintes ne voient qu'en nuances de gris — essentiellement une vision en noir et blanc. Elle est extrêmement rare, touchant environ 1 personne sur 30 000.

Caractéristiques de l'achromatopsie :

• Absence complète de discrimination chromatique : toute perception des couleurs est basée uniquement sur la luminance
• Sensibilité sévère à la lumière (photophobie) : les cônes régulent normalement la sensibilité en pleine lumière ; sans eux, la lumière du jour en extérieur peut être douloureuse ou aveuglante temporairement
• Acuité visuelle réduite : la fovéa (centre de la rétine) est densément peuplée de cônes ; leur absence réduit la netteté de la vision centrale
• Nystagmus : un mouvement oculaire involontaire est courant

Une pathologie connexe mais moins sévère, la monochromatie des cônes bleus, implique des cônes S fonctionnels uniquement. Les personnes atteintes ont une vision des couleurs très limitée et une photophobie sévère, mais une discrimination chromatique légèrement supérieure à l'achromatopsie complète.

Pour les besoins du design, l'achromatopsie est le cas extrême du principe selon lequel la couleur seule ne doit jamais transmettre d'information essentielle. Si un design est lisible et utilisable en niveaux de gris, il fonctionne pour le scénario de vision des couleurs le plus rare et le plus difficile.

Concevoir des UI inclusives pour les utilisateurs daltoniens

Concevoir pour le daltonisme ne signifie pas supprimer les couleurs des interfaces. La couleur est un canal de communication précieux. L'objectif est de s'assurer que la couleur n'est jamais le seul canal portant une information critique.

Principe 1 : Ne jamais utiliser la couleur seule

Chaque instance où la couleur transmet du sens doit inclure un indice redondant. Les indices redondants les plus utiles pour les utilisateurs daltoniens sont :

• La forme : icônes, symboles et différenciation géométrique
• Le motif : hachures, textures, tirets dans les graphiques
• Les étiquettes textuelles : l'étiquetage direct élimine totalement l'interprétation des couleurs
• La position : l'arrangement spatial peut remplacer le codage par couleur dans de nombreux contextes
• La bordure/le contour : un contour qui change en même temps que la couleur de remplissage

Exemple — Validation de formulaire : - Mauvais : bordure rouge pour l'erreur, bordure verte pour le succès - Bon : bordure rouge + icône d'erreur (symbole X) + étiquette textuelle d'erreur pour l'erreur ; bordure verte + icône de succès (coche) + étiquette textuelle de succès pour le succès

Exemple — Graphiques : - Mauvais : deux lignes distinguées uniquement par la couleur rouge vs verte - Bon : styles de ligne distincts (plein vs pointillé) + marqueurs distincts (cercle vs triangle) + étiquettes de données directes + remplissages à motifs pour les graphiques en barres

Principe 2 : Choisir des palettes adaptées aux daltoniens

Certaines combinaisons de couleurs sont plus universellement distinguables que d'autres. Les règles les plus importantes :

Évitez la juxtaposition rouge-vert pour les distinctions critiques. Cela affecte 8 % des hommes — le sous-groupe le plus large.

Utilisez le bleu-orange comme paire à fort contraste alternative. #0072B2 et #E69F00 sont la paire sécurisée pour le daltonisme d'IBM pour cette raison. Elles sont distinguables par les protanopes, deutéranopes et tritanopes.

Ajoutez du contraste de luminance, pas seulement du contraste de teinte. Un rouge et un vert avec des valeurs de luminosité significativement différentes sont plus distinguables par les utilisateurs daltoniens qu'un rouge et un vert de luminance similaire. Si la ligne rouge et la ligne verte de votre graphique ont une luminosité perçue similaire, elles paraîtront presque identiques à un deutéranope même à haute saturation.

Palettes recommandées pour la visualisation de données : - Palette Okabe-Ito : conçue spécifiquement pour la sécurité du daltonisme dans la visualisation de données - IBM Color Blind Safe : un ensemble de couleurs soigneusement sélectionnées qui fonctionnent pour tous les types majeurs de déficit - Viridis, Plasma, Magma : cartes de couleurs perceptuellement uniformes qui maintiennent la distinguabilité en niveaux de gris ou pour les utilisateurs daltoniens

Principe 3 : Maintenir un contraste de luminance suffisant

Les exigences de contraste WCAG 2.1 existent en partie pour cette raison. Deux couleurs qui semblent distinctes en teinte mais ont des valeurs de luminance presque identiques (valeurs L* similaires en termes CIELAB) paraîtront identiques pour :

• Les utilisateurs daltoniens qui ne peuvent pas distinguer la teinte
• Les utilisateurs dans des environnements à forte luminosité ambiante
• Les contextes d'impression en niveaux de gris ou de capture d'écran

Utilisez le Vérificateur de contraste pour vérifier que vos paires de couleurs respectent au minimum les exigences de contraste WCAG AA. Un ratio de contraste de 4,5:1 pour le texte normal et de 3:1 pour le grand texte fournit une base de différenciation de luminance qui aide à compenser la perte de discrimination de teinte.

Notez que les ratios de contraste WCAG mesurent le contraste de luminance, pas directement l'adaptation au daltonisme. Un bleu et un orange avec un ratio de 4,5:1 fonctionneront pour la plupart des utilisateurs daltoniens. Un rouge et un vert avec un ratio de 4,5:1 respecteront le contraste de luminance mais peuvent toujours créer de la confusion pour les utilisateurs qui ne peuvent pas distinguer la teinte — ils verront la différence de luminosité mais pas la différence de teinte.

Principe 4 : Tester avec un simulateur

Utilisez le Simulateur de daltonisme pour prévisualiser l'apparence de votre interface, palette ou design sous chaque type majeur de déficit :

• Deutéranopie : la variante la plus courante ; comment l'interface se lit-elle quand le rouge et le vert sont indiscernables ?
• Protanopie : le rouge est à la fois confus en couleur et plus sombre ; les éléments rouges peuvent disparaître
• Tritanopie : confusion bleu-jaune
• Achromatopsie : niveaux de gris complets — le test de lisibilité ultime

Simuler votre design est plus rapide et plus fiable que de demander à des collègues daltoniens d'évaluer chaque décision de design. Intégrez cette vérification à votre processus de révision, pas comme une réflexion après coup.

Principe 5 : Couleurs d'état accessibles

Les conventions de couleurs d'état — le point d'échec de daltonisme le plus courant dans le design UI — peuvent être rendues accessibles avec des ajouts simples :

L'icône et l'étiquette textuelle sont les indices redondants. Si un utilisateur ne peut pas distinguer le vert du rouge, la coche versus le X rend le sens sans ambiguïté.

Texte sur fonds colorés

Le daltonisme peut rendre le texte sur des fonds teintés plus difficile à lire même lorsque la différence de teinte est évidente pour les utilisateurs à vision normale. Par exemple, du texte blanc sur un fond vert moyen respecte le contraste WCAG pour les utilisateurs à vision normale — mais si un deutéranope perçoit le fond comme brun plutôt que vert, le blanc-sur-brun peut paraître différent de ce qui était prévu. Le ratio de contraste peut encore être respecté, mais l'intention esthétique (une bannière de succès verte, par exemple) est perdue.

C'est généralement acceptable pour les contextes décoratifs — l'intention peut ne pas être communiquée, mais la lisibilité est maintenue. Pour les indicateurs d'état critiques, ajouter une icône ou une étiquette supprime entièrement la dépendance à l'interprétation de la teinte.

Points clés

• Le daltonisme résulte de cellules cônes absentes ou altérées dans la rétine, perturbant la discrimination chromatique selon l'axe rouge-vert, bleu-jaune ou tous les axes chromatiques.
• La deutéranopie et deutéranomalie (cônes M absents ou réduits) et la protanopie et protanomalie (cônes L absents ou réduits) constituent ensemble le daltonisme rouge-vert, affectant environ 8 % des hommes.
• La protanopie entraîne en outre une apparence très sombre du rouge — les éléments rouges peuvent paraître presque noirs, une préoccupation critique pour la sécurité.
• La tritanopie (cônes S absents) affecte la discrimination bleu-jaune et est beaucoup plus rare (~0,01 %), touchant les hommes et les femmes à égalité.
• L'achromatopsie (tous cônes absents) est extrêmement rare mais énonce le principe design dans sa forme la plus pure : toute information essentielle doit être communiquée sans aucune dépendance à la couleur.
• La règle design principale : la couleur ne doit jamais être le seul canal transmettant une information critique. Associez toujours la couleur à la forme, au motif, au texte ou à l'iconographie.
• Évitez la juxtaposition rouge-vert pour les distinctions critiques ; préférez les paires bleu-orange pour une distinguabilité maximale entre types.
• Utilisez le Simulateur de daltonisme pour prévisualiser vos designs et le Vérificateur de contraste pour vérifier que le contraste de luminance respecte les exigences WCAG.