Critère RGAA 3.3 · Couleurs
Critère RGAA 3.3 : Contraste des composants d’interface et éléments graphiques
L’information ne doit jamais dépendre uniquement de la couleur et les contrastes doivent permettre une lecture confortable.
Comprendre le critère
Le critère RGAA 3.3 porte sur la perception de l’information visuelle et des contrastes. L’objectif est de vérifier que cette information ou cette fonctionnalité reste disponible dans le code, pas seulement dans le rendu visuel.
Le contrôle combine une lecture humaine du message transmis et des mesures de contraste avec les couleurs réellement affichées.
Pourquoi c'est important ?
La couleur et le contraste conditionnent la compréhension pour les personnes daltoniennes, malvoyantes, fatiguées ou utilisant l’écran dans un environnement lumineux.
Une erreur sur "Contraste des composants d’interface et éléments graphiques" peut créer une rupture très concrète : contenu non annoncé, action impossible au clavier, information ambiguë ou parcours incompréhensible pour une technologie d’assistance.
Exemple non conforme
Le message dépend d’un indice visuel fragile.
<span class="status red">●</span>Exemple conforme
Le même message est disponible sous forme textuelle.
<span class="status red" aria-hidden="true">●</span><span>Erreur à corriger</span>Comment vérifier ce critère ?
- Identifier toutes les occurrences concernées par "Contraste des composants d’interface et éléments graphiques" sur la page auditée.
- Repérer les informations transmises par couleur, contraste, état visuel ou icône.
- Mesurer les contrastes avec les couleurs finales rendues à l’écran.
- Vérifier qu’un texte, une forme ou un motif complète la couleur lorsque celle-ci porte une information.
Erreurs fréquentes
- Indiquer une erreur uniquement en rouge.
- Mesurer le contraste sur la maquette au lieu du rendu final.
- Oublier les états hover, focus, disabled ou selected.
Questions fréquentes
Ce critère peut-il être testé automatiquement ?
Oui pour une partie des contrastes, mais l’information transmise uniquement par la couleur demande une analyse humaine.
Quel est le premier réflexe pour corriger "Contraste des composants d’interface et éléments graphiques" ?
Revenir au besoin utilisateur, puis utiliser le HTML natif le plus approprié avant d’ajouter ARIA, CSS ou JavaScript.
Quand considérer le critère comme non applicable ?
Uniquement lorsque la page ne contient aucun contenu, composant ou cas visé par le critère. Cette décision doit être justifiée dans la grille d’audit.
Tester ce critère avec AllyNizer
Lancez une analyse de page pour repérer les erreurs automatiques, puis complétez avec les vérifications manuelles proposées dans cette fiche.