Contraste des couleurs : quand un ratio conforme reste illisible

Vous avez le badge vert. Le vérificateur affiche 4,6:1, le texte est conforme, la case est cochée. Et pourtant, à l'usage, ce paragraphe reste pénible à lire.

Ce n'est pas votre imagination, et ce n'est pas non plus une raison d'abandonner le ratio. Le calcul du contraste mesure une chose précise, et une seule : la différence de luminance relative entre deux couleurs. Tout ce qui fait la lisibilité réelle, la finesse des traits, la taille effective à l'écran, le sens de la polarité, lui échappe par construction.

Cet article explique ce que le calcul ne voit pas, comment le compenser, et fait le point honnête sur l'APCA, dont on lit à peu près partout qu'il est « le contraste des WCAG 3 ».

4,5:1 reste l'exigence, et ce n'est pas discutable

Commençons par le point qui n'a pas bougé. Le critère RGAA 3.2 demande un ratio de contraste d'au moins 4,5:1 pour le texte de taille normale et 3:1 pour le grand texte. C'est la règle applicable, et le RGAA 4.1.2 s'appuie sur les WCAG 2.1.

Rien de ce qui suit ne vous dispense de l'atteindre. Si vous cherchez la formulation exacte du critère, ses seuils et ses cas particuliers, la référence est la fiche critère 3.2. Pour calculer un ratio, utilisez le calculateur de contraste.

Un mot sur le critère voisin, souvent oublié : le 3.3 exige 3:1 pour les composants d'interface et les éléments graphiques porteurs d'information. Bordures de champs, icônes signifiantes, indicateurs de focus, couleurs d'un graphique. Un site peut être irréprochable sur son texte et échouer intégralement ici.

Ce que le calcul ne mesure pas

Le contraste est la première erreur d'accessibilité du web, et de loin : le WebAIM Million de février 2026 la détecte sur 83,9 % des pages d'accueil. Mais la statistique inverse est plus intéressante pour un designer : parmi les pages qui passent le test, beaucoup restent difficiles à lire. Voici pourquoi.

La graisse de la police

C'est le facteur le plus sous-estimé. Deux textes de même couleur et de même taille, l'un en 300 (Light) et l'autre en 600 (Semibold), obtiennent exactement le même ratio. À l'œil, ils n'ont rien à voir : les traits fins laissent passer le fond, et le contraste perçu s'effondre.

Si votre design système emploie des graisses Light ou Thin pour du texte courant, le ratio calculé vous rassure à tort. Le sujet croise directement celui de la taille de police et du choix de la famille typographique.

La polarité

Le blanc sur noir et le noir sur blanc au même ratio ne se lisent pas de la même façon. En clair sur fond sombre, les caractères ont tendance à « baver » optiquement, un effet qui pénalise là encore les graisses fines. C'est une limite connue du modèle des WCAG 2.x, dont le calcul est symétrique alors que la perception ne l'est pas.

En pratique : si vous proposez un mode sombre, ne vous contentez pas d'inverser vos couleurs et de revérifier le ratio. Regardez le résultat.

Les aplats saturés

Le cas d'école est le texte blanc sur orange ou sur jaune vif. La formule de luminance des WCAG 2.x traite ces teintes d'une façon qui produit des résultats contre-intuitifs, et c'est l'une des critiques les mieux documentées du modèle. Cela ne vous autorise pas à ignorer le seuil, mais cela explique pourquoi certaines combinaisons refusées vous paraissent parfaitement lisibles.

Le texte sur image

Un ratio n'a de sens qu'entre deux couleurs stables. Sur une photographie, le fond change à chaque pixel : le texte passe le test sur la zone que vous avez testée et échoue trois centimètres plus loin. La réponse n'est pas un meilleur calcul, c'est un fond opaque, un voile suffisamment dense, ou un déplacement du texte hors de l'image.

APCA : ce que c'est, et ce que ce n'est pas

L'APCA (Advanced Perceptual Contrast Algorithm) est un algorithme qui raisonne en « lightness contrast » (Lc) plutôt qu'en ratio, et qui intègre précisément ce que le modèle actuel ignore : la graisse, la taille et la polarité. Sur le fond, il répond à un vrai problème, celui décrit plus haut.

Là où il faut être précis, c'est sur son statut. On lit très souvent qu'il s'agit du « futur algorithme des WCAG 3 ». Le Working Draft des WCAG 3.0 publié le 3 mars 2026 ne mentionne pas l'APCA, et le W3C précise que le document « demande encore plusieurs années de travail » et qu'« il est inapproprié de le citer autrement que comme un travail en cours ».

Autrement dit : l'APCA est un outil de conception intéressant, développé indépendamment, qui a nourri les réflexions préparatoires. Ce n'est pas une norme en attente de promulgation, et personne ne peut aujourd'hui annoncer une date de bascule. Se servir de l'APCA pour arbitrer entre deux gris est raisonnable. Justifier auprès d'un client un texte non conforme au 4,5:1 au motif qu'« il passe l'APCA » ne l'est pas.

Que faire concrètement

1. Atteignez 4,5:1. C'est l'exigence opposable, et c'est ce qui sera audité. Le critère admet une porte de sortie, un mécanisme permettant à l'utilisateur d'afficher le texte au ratio conforme, mais c'est un dispositif à part entière à concevoir et à tester : ne comptez pas dessus pour rattraper une palette. Vérifiez aussi les états : survol, focus, champ désactivé, texte d'indication.
2. Traitez les graisses fines comme un cas à part. Sur du Light ou du Thin, visez nettement au-dessus du seuil, ou changez de graisse. Le ratio ne vous protégera pas.
3. Regardez votre mode sombre, ne le calculez pas seulement. L'inversion mécanique d'une palette conforme ne produit pas une palette conforme et confortable.
4. N'oubliez pas le 3.3. Bordures de champs, icônes porteuses de sens, indicateur de focus, séries d'un graphique : 3:1 minimum.
5. Figez les valeurs validées dans votre design system. Un contraste vérifié une fois puis laissé à l'appréciation de chacun se dégrade au premier écran suivant.

Le contraste n'est pas qu'une affaire de calcul, mais le calcul reste le plancher. La bonne posture est de le respecter d'abord, puis de regarder ce qu'il ne dit pas.

Vérifiez vos combinaisons avec le calculateur de contraste, ou lancez un audit de votre page pour repérer les textes sous le seuil.