Résultat
Ce que cette auto-évaluation ne couvre pas encore. La méthode RGAA demande de vérifier la restitution par des lecteurs d'écran (environnement de test de référence). Ces tests restent à réaliser : NVDA avec Firefox, JAWS avec Firefox, VoiceOver avec Safari (macOS et iOS), TalkBack avec Chrome (Android).
Tant qu'ils ne sont pas faits, le module reste déclaré non conforme au sens du RGAA, même si aucune non-conformité n'a été relevée. L'état de conformité sera mis à jour après ces tests.
Périmètre
L'évaluation porte sur le module seul : bouton d'ouverture, panneau de réglages et effets appliqués à la page (taille du texte, animations, contraste, espacement, police, lecture vocale). Le contenu des sites qui utilisent le module relève de leur propre déclaration d'accessibilité.
Méthode et environnement de test
- Revue du code critère par critère (structure, rôles et propriétés ARIA, gestion du focus, CSS).
- Tests automatisés dans un vrai navigateur : Chrome for Testing 153 (Playwright), axe-core 4.13 (règles WCAG 2.0, 2.1 et 2.2 niveaux A et AA) sur le panneau ouvert.
- Tests clavier scriptés : ouverture à Entrée, parcours à Tab, interrupteurs à Espace, fermeture à Échap, retour du focus, maintien du focus après chaque réglage.
- Mesures de présentation : écran de 320 × 256 px (zoom 400 %), 640 × 360 px (zoom 200 %),
texte à 200 %, espacements du critère 10.12, mode contraste élevé de Windows (
forced-colors), site hôte enfont-size: 62,5 %, thème volontairement peu contrasté (correction automatique vérifiée). - Pages de test : page de démonstration dédiée et sites en production (enum.fr, carrefourdhecate.fr, idfpaysage.fr).
Critères applicables
| Critère | Sujet | Résultat | Vérification |
|---|---|---|---|
| 1.2 | Images de décoration ignorées | Conforme | Icône et pictogramme 🔊 en aria-hidden ; les boutons ont un nom accessible |
| 3.1 | Information pas donnée que par la couleur | Conforme | État « Activé / Désactivé » écrit à côté de chaque interrupteur |
| 3.2 | Contraste du texte | Conforme | Contrastes recalculés à l'exécution : texte ≥ 4,5:1 quel que soit le thème configuré |
| 3.3 | Contraste des composants d'interface | Conforme | Contours des interrupteurs, boutons et focus en couleur du texte (≥ 3:1) |
| 6.1 | Liens explicites | Conforme | « Déclaration d'accessibilité » |
| 6.2 | Liens avec un intitulé | Conforme | axe-core link-name |
| 7.1 | Scripts compatibles avec les technologies d'assistance | Conforme* | role="dialog" + aria-modal + titre relié, role="switch" + aria-checked, aria-expanded, aria-disabled ; *restitution lecteurs d'écran à confirmer |
| 7.3 | Scripts contrôlables au clavier | Conforme | Toutes les fonctions au clavier ; focus conservé après chaque réglage |
| 7.4 | Changement de contexte à l'initiative de l'utilisateur | Conforme | Le panneau ne s'ouvre qu'à l'activation du bouton ; la page est rendue inerte puis réactivée |
| 7.5 | Messages de statut | Conforme | Zone role="status" : taille du texte, réinitialisation, début et fin de lecture |
| 8.2 | Code valide | Conforme | Balisage généré sans identifiant dupliqué ni imbrication invalide |
| 8.7 | Changements de langue | Conforme | Attribut lang sur le module (10 langues), voix de lecture dans la langue du contenu |
| 8.9 | Balises non utilisées à des fins de présentation | Conforme | Titre h2, paragraphe, boutons natifs |
| 9.1 | Titres | Conforme | Titre de niveau 2 « Accessibilité » en tête du panneau |
| 10.1 | Feuilles de styles pour la présentation | Conforme | CSS isolé dans le Shadow DOM |
| 10.2 | Contenu visible sans CSS | Conforme | Libellés textuels dans le balisage |
| 10.3 | Information compréhensible sans CSS | Conforme | Ordre du code = ordre visuel |
| 10.4 | Texte agrandi à 200 % | Conforme | Tailles en em ; aucun texte coupé à 200 % |
| 10.5 | Couleurs de fond et de police déclarées ensemble | Conforme | Revue du CSS |
| 10.7 | Focus visible | Conforme | Contour de 3 px sur chaque élément actif |
| 10.8 | Contenus cachés ignorés | Conforme | Panneau fermé en display: none |
| 10.9 | Information pas donnée que par la forme ou la position | Conforme | État écrit des interrupteurs |
| 10.10 | Idem, pour chaque élément | Conforme | Boutons désactivés signalés par aria-disabled et un contour pointillé |
| 10.11 | Lecture sans défilement horizontal à 320 px | Conforme | Panneau pleine largeur en bas d'écran, sans défilement horizontal |
| 10.12 | Espacement du texte modifiable | Conforme | Aucune perte avec interligne 1,5, lettres 0,12 em, mots 0,16 em, paragraphes 2 em |
| 11.9 | Intitulé des boutons pertinent | Conforme | « Agrandir la taille », « Fermer le panneau d'accessibilité »… |
| 12.8 | Ordre de tabulation cohérent | Conforme | Ordre du panneau, focus maintenu dans la fenêtre modale |
| 12.9 | Pas de piège au clavier | Conforme | Échap et bouton « Fermer » ; focus rendu au bouton d'ouverture |
| 13.8 | Contenus en mouvement contrôlables | Conforme | Seule animation : apparition de 0,18 s, supprimée si les animations sont réduites |
| 13.9 | Consultable quelle que soit l'orientation | Conforme | Portrait et paysage |
| 13.11 | Actions déclenchées au relâchement du pointeur | Conforme | Activation au clic (événement de relâchement) |
Non applicables au module : thèmes 2 (cadres), 4 (multimédia), 5 (tableaux) ; critères 1.1 et 1.3 à 1.9 (aucune image porteuse d'information), 8.1, 8.3 à 8.6, 8.8 et 8.10 (propres à la page du site), 10.6, 10.13 et 10.14, 11.1 à 11.8 et 11.10 à 11.13 (aucun champ de formulaire), 12.1 à 12.7, 12.10 et 12.11, 13.1 à 13.7, 13.10 et 13.12.
Limites connues
- « Taille du texte » agrandit la taille de base du site. Un site qui fixe ses textes en pixels ne grossit pas : le zoom du navigateur reste alors la solution (à traiter dans la déclaration du site).
- La lecture vocale dépend des voix installées sur l'appareil ; si le navigateur ne propose pas la synthèse vocale, les options de lecture sont masquées et un message l'indique.
Contact
Pour signaler un défaut : rgaa@e-cosplay.fr. Voies de recours : voir la déclaration d'accessibilité.