Critère RGAA 10.2 · Présentation de l’information
Critère RGAA 10.2 : Information présente sans feuilles de styles
La présentation visuelle doit rester flexible, lisible et compréhensible lorsque les styles, le zoom ou l’orientation changent.
Comprendre le critère
Le critère RGAA 10.2 porte sur la capacité du contenu à rester lisible quand la présentation change. L’objectif est de vérifier que cette information ou cette fonctionnalité reste disponible dans le code, pas seulement dans le rendu visuel.
La conformité se teste en modifiant l’affichage : zoom, styles personnalisés, désactivation CSS, focus clavier, orientation et largeur de viewport.
Pourquoi c'est important ?
Les utilisateurs adaptent l’affichage à leurs besoins. Le contenu doit survivre au zoom, aux styles personnalisés et à la navigation clavier.
Une erreur sur "Information présente sans feuilles de styles" 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
La présentation impose une lecture ou une interaction fragile.
.notice { font-size: 12px; overflow: hidden; }Exemple conforme
Le contenu reste lisible quand l’utilisateur adapte l’affichage.
.notice { font-size: 1rem; overflow-wrap: anywhere; }Comment vérifier ce critère ?
- Identifier toutes les occurrences concernées par "Information présente sans feuilles de styles" sur la page auditée.
- Tester le zoom, l’espacement du texte, la largeur mobile et les styles personnalisés.
- Parcourir la page au clavier pour contrôler le focus et les contenus affichés au survol ou au focus.
- Désactiver ou neutraliser les CSS lorsque le critère concerne la présence ou la compréhension sans styles.
Erreurs fréquentes
- Supprimer outline sans fournir de focus visible.
- Fixer des hauteurs ou largeurs qui cassent au zoom.
- Masquer du contenu utile avec aria-hidden.
- Faire dépendre l’information de la position ou de la forme seule.
Questions fréquentes
Ce critère peut-il être testé automatiquement ?
Partiellement. Certains contrastes ou attributs se détectent, mais le zoom, le focus et les contenus additionnels doivent être manipulés.
Quel est le premier réflexe pour corriger "Information présente sans feuilles de styles" ?
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.