WCAG 2.2 : les neuf nouveaux critères de succès
WCAG 2.2 est une recommandation du W3C depuis le 5 octobre 2023. Elle ajoute neuf critères de succès à WCAG 2.1 (six de niveaux A et AA, trois de niveau AAA) et retire le critère 4.1.1 « Analyse syntaxique ».
En bref
- 9 nouveaux critères : 6 en A/AA (retenus par le RGAA 5) et 3 en AAA.
- Les plus visibles : focus non masqué, glissement, cible de 24 px, aide cohérente, saisie redondante, authentification.
- Le critère 4.1.1 est supprimé car obsolète avec les navigateurs actuels.
Les neuf critères en un coup d’œil
| Critère | Niveau | Exigence résumée |
|---|---|---|
| 2.4.11 Focus non masqué (minimum) | AA | Un composant qui reçoit le focus n’est pas entièrement masqué par du contenu ajouté par l’auteur. |
| 2.4.12 Focus non masqué (renforcé) | AAA | Aucune partie du composant focalisé n’est masquée. |
| 2.4.13 Apparence du focus | AAA | Indicateur de focus d’une taille et d’un contraste minimaux. |
| 2.5.7 Mouvements de glissement | AA | Toute fonction de glissement a une alternative à pointeur unique. |
| 2.5.8 Taille de cible (minimum) | AA | Cibles d’au moins 24 × 24 px CSS, sauf exceptions. |
| 3.2.6 Aide cohérente | A | Les mécanismes d’aide répétés apparaissent au même endroit relatif. |
| 3.3.7 Saisie redondante | A | Ne pas redemander une information déjà fournie dans le même processus. |
| 3.3.8 Authentification accessible (minimum) | AA | Aucune étape de connexion ne repose sur un test cognitif sans alternative. |
| 3.3.9 Authentification accessible (renforcé) | AAA | Version sans exception sur la reconnaissance d’objets ou de contenu personnel. |
Focus non masqué (2.4.11)
Cas typique : un en-tête collant recouvre le lien focalisé. Réservez l’espace avec scroll-padding (voir RGAA 5). Test : tabulez jusqu’au pied de page puis remontez avec Maj+Tab.
Mouvements de glissement (2.5.7)
Proposez toujours une alternative simple : un menu « Déplacer vers… », des boutons monter/descendre, un champ numérique à côté d’un curseur.
<li draggable="true">
Rédiger la FAQ
<label>Déplacer vers
<select name="colonne"><option>À faire</option><option>En cours</option><option>Terminé</option></select>
</label>
</li>Taille de cible (2.5.8)
La zone cliquable compte, pas l’icône. Exceptions : espacement suffisant, lien dans une phrase, contrôle natif du navigateur, taille essentielle.
.icon-button { min-width: 24px; min-height: 24px; display: inline-grid; place-items: center; }
/* Actions importantes : viser 44px (critère AAA 2.5.5) */Aide cohérente (3.2.6) et saisie redondante (3.3.7)
Placez contact, FAQ ou chat dans le même ordre relatif sur toutes les pages, via un composant de gabarit unique. Dans un tunnel de commande, proposez « adresse de facturation identique à la livraison » plutôt que de redemander l’adresse.
Authentification accessible (3.3.8)
Évitez les tests de mémorisation, de transcription ou de résolution d’énigme sans alternative. Laissez coller le mot de passe et le code.
<input type="password" name="password" autocomplete="current-password">
<input type="text" name="otp" autocomplete="one-time-code" inputmode="numeric" maxlength="6" pattern="\d{6}">Un CAPTCHA reste possible si une alternative est proposée.
Questions fréquentes
WCAG 2.2 remplace-t-il WCAG 2.1 ?
WCAG 2.2 est rétrocompatible : un contenu conforme à WCAG 2.2 satisfait aussi WCAG 2.1, à l’exception du critère 4.1.1 supprimé.
Quels critères WCAG 2.2 sont les plus souvent oubliés ?
La taille de cible, le focus masqué par un en-tête fixe et le blocage du collage dans les champs d’authentification.
Les outils automatiques détectent-ils WCAG 2.2 ?
Très partiellement : seule la taille de cible peut être détectée automatiquement, et encore avec des exceptions qui exigent un contrôle humain.