Test WCAG 2.2 AA - Drummondville, ma ville!

2.4.13 Focus Appearance WCAG 2.2

L'indicateur de focus doit avoir une largeur minimale de 2px et un ratio de contraste de 3:1.

Test du focus visible

Utilisez la touche Tab pour naviguer entre ces éléments :

Lien bouton

Résultat attendu : Outline bleu de 3px avec offset de 2px, ratio > 3:1

2.4.11 Focus Not Obscured WCAG 2.2

Le focus ne doit pas être complètement masqué par du contenu fixe.

Test avec en-tête fixe

L'en-tête est fixe en haut. Utilisez Tab pour naviguer vers ce lien en bas de section :

Contenu de remplissage...

Lien en bas (devrait défiler automatiquement)

Résultat attendu : La page défile pour garder le focus visible

2.5.8 Target Size WCAG 2.2

Les cibles interactives doivent avoir une taille minimale de 24x24 pixels CSS.

Comparaison des tailles

24x24px (minimum)

44x44px (recommandé)

Exception : Les liens dans le texte comme ce lien sont exemptés.

2.5.7 Dragging Movements WCAG 2.2

Toute fonctionnalité de glisser-déposer doit avoir une alternative accessible.

Éléments réorganisables

Élément 1 - Utilisez les boutons pour déplacer

Élément 2 - Alternative au glisser-déposer

Élément 3 - Accessible au clavier

Résultat attendu : Boutons haut/bas ajoutés automatiquement par JavaScript

3.2.6 Consistent Help WCAG 2.2

L'aide doit être disponible de manière cohérente sur toutes les pages.

Formulaire avec aide

Résultat attendu : Icône d'aide "?" ajoutée automatiquement en haut du formulaire

3.3.8 Accessible Authentication WCAG 2.2

L'authentification ne doit pas dépendre de tests cognitifs.

Champ de mot de passe accessible

Points testés :

Bouton pour afficher/masquer le mot de passe
Validation en temps réel des exigences
Pas de CAPTCHA ou puzzle cognitif

3.3.7 Redundant Entry WCAG 2.2

Les informations déjà fournies ne doivent pas être redemandées.

Test de saisie automatique

Remplissez ce premier formulaire :

Puis naviguez vers ce second formulaire (les données devraient être pré-remplies) :

Résultat attendu : Les données sont mémorisées en sessionStorage

Tests WCAG 2.2 AAA Niveau AAA

2.4.12 Focus Not Obscured (Enhanced) - AAA

Le focus doit être ENTIÈREMENT visible, pas seulement partiellement.

En-tête fixe simulé

Utilisez Tab pour naviguer vers ces éléments :

Résultat AAA : L'élément est centré dans l'espace disponible, pas juste visible

3.3.9 Accessible Authentication (Enhanced) - AAA

Aucun test cognitif, mémorisation ou transcription requis.

Simulation CAPTCHA

Résultat AAA : Alternative email disponible + support biométrique si disponible

1.4.6 Contraste Amélioré - AAA

Ratio de contraste 7:1 pour le texte normal.

Texte normal avec contraste 7:1 sur fond blanc

Lien avec contraste 7:1

Placeholder avec contraste AAA

Résumé de conformité WCAG 2.2

Niveau AA atteint ✅

✓ 2.4.11 Focus Not Obscured (Minimum)
✓ 2.4.13 Focus Appearance
✓ 2.5.7 Dragging Movements
✓ 2.5.8 Target Size (Minimum)
✓ 3.2.6 Consistent Help
✓ 3.3.7 Redundant Entry
✓ 3.3.8 Accessible Authentication

Niveau AAA partiel 🌟

✓ 2.4.12 Focus Not Obscured (Enhanced)
✓ 3.3.9 Accessible Authentication (Enhanced)
✓ 1.4.6 Contraste Amélioré
✓ 2.3.3 Animation from Interactions
✗ 1.2.6 Langue des signes
✗ 3.1.5 Niveau de lecture

Tests de conformité WCAG 2.2 AA