Le texte a un rapport de contraste d’au moins 4,5:1. Découvrez comment mesurer vous-même un rapport de contraste dans l’article "Utilisez suffisamment de contraste".
L’importance d’un bon contraste
Un contraste élevé entre le texte et l’arrière-plan facilite la lecture des personnes daltoniennes ou malvoyantes. De plus, bon nombre de visiteurs de votre site web lisent vos textes sur un smartphone avec un petit écran (ou un écran de moins bonne qualité) et/ou dans des mauvaises conditions de luminosité.
Il y a quelques exceptions à ce critère de succès.
-
Le texte agrandi peut avoir un contraste d’au moins 3:1. Les WCAG utilisent le terme ‘texte agrandi’ pour désigner du texte normal avec une taille minimale de 18 points ou du texte en gras avec une taille minimale de 14 points. Il va de soi qu’une police ‘en gras’ n’est pas l’autre et l’on peut donc faire preuve d’un certain pragmatisme pour appliquer ce critère de succès.
-
L’exigence de contraste ne vise pas les textes qui font partie d’un composant d’interface utilisateur inactif, comme un bouton qui n’est (temporairement) pas disponible et donc s’affiche en gris.
-
L’exigence de contraste ne doit pas non plus être respectée pour des textes purement décoratifs ou que personne n’a besoin de voir pour pouvoir utiliser ou comprendre le site web. Cette situation est très rare. Un exemple est l’utilisation de l’art ASCII.
- Les logos : il n’y a aucune exigence de contraste pour les textes faisant partie d’un logo ou d’un nom de marque.
Ce critère de succès s’applique aussi aux textes sous forme d’images
Le contraste minimum de 4,5:1 doit aussi être respecté avec les textes sous forme d’images. Ceux-ci sont généralement conçus avec un logiciel de traitement d’images et leur nom de fichier se termine par .png, .svg ou .jpg. Ils sont insérés avec un tag <img> ou à l'aide d'une technique qui remplace le texte original par une image d’arrière-plan définie dans une feuille de style. Cette technique est aussi appelée ‘image replacement’.