Ce que dit la norme
La présentation visuelle du texte et du texte sous forme d'image a un rapport de contraste d'au moins 4,5:1, sauf dans les cas suivants :
Pourquoi c'est important
C'est de loin l'échec le plus fréquent du web, sur plus de quatre pages d'accueil sur cinq. Il touche toutes les personnes dont la sensibilité au contraste a baissé, c'est-à-dire à terme la plupart des gens après soixante ans.
À quoi ressemble un échec
- échoueDu texte indicatif ou d'aide en gris sur blanc — le classique #999 sur #fff donne 2,8:1.
- échoueDu texte blanc sur une couleur de marque choisie pour un logo, pas pour du corps de texte.
- échoueDu texte sur une photo sans voile assombrissant.
- échoueUn état désactivé si délavé que personne ne lit ce qui est désactivé.
Comment corriger
- à faireMesurez avant de livrer. Le grand texte, c'est 18,66 px en gras ou 24 px en normal — tout le reste demande 4,5:1.
- à faireAssombrissez plutôt le texte que d'éclaircir le fond ; cela préserve mieux la conception.
- à faireSur les images, ajoutez un voile opaque ou une ombre de texte qui atteint elle-même le ratio.
- à fairePour les contrôles désactivés, gardez le texte lisible et signalez l'état par des mots.
Comment A11ySignal le vérifie
1 vérification automatique s'exécute sur ce critère à chaque analyse.
gravecolor-contrastLes éléments doivent avoir un contraste de couleurs suffisant
Également sous 1.4 Distinguable
- 1.4.1 Utilisation de la couleur
- 1.4.2 Contrôle du son
- 1.4.4 Redimensionnement du texte
- 1.4.5 Texte sous forme d'image
- 1.4.6 Contraste (amélioré)
- 1.4.7 Son faible ou absent en arrière-plan
- 1.4.8 Présentation visuelle
- 1.4.9 Texte sous forme d'image (sans exception)
- 1.4.10 Redistribution
- 1.4.11 Contraste du contenu non textuel
- 1.4.12 Espacement du texte
- 1.4.13 Contenu au survol ou au focus