Accessibilité web WCAG 2.2 — guide technique pour les développeurs en 2026
95,9 % des sites du top million ont des erreurs WCAG détectables. WCAG 2.2 ajoute 9 nouveaux critères (dont 6 au niveau AA). L'EAA est en vigueur depuis juin 2025 et le RGAA 5 est attendu fin 2026. Ce guide couvre les nouveaux critères, ARIA en 2026, les tests automatisés, et fournit du code accessible prêt à copier.
Les 9 nouveaux critères WCAG 2.2
Niveau AA (les plus impactants) :
- 2.4.11 Focus Not Obscured — le focus ne doit pas être entièrement caché par des sticky headers ou bandeaux cookies
- 2.5.7 Dragging Movements — alternative au drag-and-drop obligatoire
- 2.5.8 Target Size Minimum — 24×24 CSS pixels minimum pour les cibles tactiles
- 3.3.8 Accessible Authentication — pas de test cognitif (CAPTCHA) pour l'authentification
:focus-visible {
outline: 3px solid #005fcc;
outline-offset: 2px;
}
button, a, input[type="checkbox"] {
min-width: 24px;
min-height: 24px;
}Critère supprimé : 4.1.1 Parsing (obsolète — les technologies d'assistance ne parsent plus le HTML brut).
ARIA en 2026 : moins c'est mieux
Statistique clé : les pages utilisant ARIA ont 41 % d'erreurs de plus que celles sans (WebAIM Million). Les 5 règles d'ARIA : ne pas utiliser si le HTML natif suffit, ne pas changer les sémantiques natives, tous les contrôles ARIA doivent être accessibles au clavier, ne pas masquer les éléments focusables, tous les éléments interactifs doivent avoir un nom accessible.
<!-- Modal accessible avec dialog natif -->
<dialog id="my-dialog" aria-labelledby="dialog-title">
<h2 id="dialog-title">Confirmer l'action</h2>
<p>Êtes-vous sûr de vouloir continuer ?</p>
<form method="dialog">
<button value="cancel">Annuler</button>
<button value="confirm" autofocus>Confirmer</button>
</form>
</dialog>RGAA et cadre légal français 2026
Le RGAA 4.1.2 actuel est basé sur WCAG 2.1 AA (106 critères). Le RGAA 5 (attendu fin 2026) intégrera WCAG 2.2, les critères mobiles et les documents bureautiques, avec l'ARCOM comme autorité de contrôle.
EAA en vigueur depuis juin 2025 : s'applique au e-commerce, banques, transports, télécoms. L'ARCOM vise 2 000 contrôles/an dès 2026. Amendes : 7 500 € par infraction EAA, 50 000 € pour le service public, pénalités quotidiennes jusqu'à 300 000 €.
Documentation obligatoire : déclaration d'accessibilité, schéma pluriannuel (3 ans), plan d'action annuel, mention en page d'accueil.
Tests automatisés : axe-core et Pa11y en CI/CD
axe-core détecte jusqu'à 57 % des problèmes, avec zéro faux positif et support WCAG 2.2. Limitation critique : les outils automatisés ne couvrent que 25-40 % des violations → test manuel indispensable.
// Pa11y en CI/CD
const results = await pa11y('http://localhost:3000', {
runners: ['axe', 'htmlcs'],
standard: 'WCAG2AA',
timeout: 30000
});
if (results.issues.length > 0) process.exit(1);Outil français : Ara (DINUM) pour les audits RGAA. Tests manuels essentiels : NVDA+Firefox, JAWS+Chrome, VoiceOver+Safari. Checklist clavier : Tab/Shift+Tab, Enter/Space, flèches, Escape, pas de piège au clavier.
APCA et l'avenir du contraste
WCAG 2.x impose 4.5:1 (texte normal), 3:1 (grand texte). APCA (candidat pour WCAG 3.0) tient compte de la taille/poids de police et distingue texte clair/sombre. Recommandation pragmatique : utiliser APCA pour une meilleure lisibilité réelle, tout en respectant les ratios WCAG 2.x pour la conformité légale.
WCAG 3.0 : Working Draft (sept. 2025), conformité Bronze/Silver/Gold. Pas finalisé avant 2028-2030. Ne pas attendre — se conformer à WCAG 2.2 AA dès maintenant.