Aller au contenu principal
Aklario

Guide pratique

Checklist WCAG 2.1 AA : 20 vérifications concrètes

7 min de lecture

Les WCAG 2.1 niveau AA — le référentiel exigé par l’European Accessibility Act — comptent 50 critères. Voici les 20 vérifications qui couvrent l’immense majorité des problèmes réels, regroupées par thème, avec le critère WCAG correspondant.

Les WCAG s’organisent autour de 4 principes — le contenu doit être perceptible, utilisable, compréhensible et robuste. Notre checklist suit les parcours concrets plutôt que la théorie.

Images & médias

  1. Chaque image informative a une alternative textuelle qui transmet la même information — pas « image1.jpg » ni une répétition du titre. (WCAG 1.1.1)
  2. Les images décoratives ont un alt vide (alt="") pour que les lecteurs d’écran les ignorent au lieu de lire le nom du fichier. (WCAG 1.1.1)
  3. Les vidéos ont des sous-titres synchronisés — et idéalement une transcription. (WCAG 1.2.2)

Couleurs & contrastes

  1. Le texte atteint un contraste de 4,5:1avec son fond (3:1 pour les grands titres). C’est l’erreur n°1 du web. (WCAG 1.4.3)
  2. Aucune information n’est portée par la couleur seule — « les champs en rouge sont obligatoires » doit aussi être indiqué par du texte ou un symbole. (WCAG 1.4.1)
  3. Les composants d’interface sont discernables : bordures de champs, icônes et états atteignent 3:1. (WCAG 1.4.11)

Formulaires

  1. Chaque champ a une étiquette visible et reliée (<label for>) — un placeholder qui disparaît à la saisie ne suffit pas. (WCAG 1.3.1, 3.3.2)
  2. Les erreurs sont explicites et localisées : « Adresse e-mail invalide » au bon endroit, pas un « formulaire incorrect » générique. (WCAG 3.3.1, 3.3.3)
  3. Les champs d’identité utilisent l’autocomplétion (autocomplete="email"…) — précieux pour les troubles cognitifs et moteurs. (WCAG 1.3.5)

Clavier

  1. Tout fonctionne au clavier seul : menus, modales, carrousels, filtres. Débranchez votre souris cinq minutes — test immédiat. (WCAG 2.1.1)
  2. Le focus est toujours visible: on doit voir où l’on se trouve en tabulant. Ne supprimez jamais l’outline sans le remplacer. (WCAG 2.4.7)
  3. Aucun piège au clavier : on peut entrer ET sortir de chaque composant (modales incluses) à la tabulation ou avec Échap. (WCAG 2.1.2)
  4. Un lien d’évitement (« aller au contenu ») apparaît au premier Tab pour sauter la navigation. (WCAG 2.4.1)

Structure & navigation

  1. Les titres sont hiérarchisés : un seul <h1>, puis h2, h3… sans sauts. Les lecteurs d’écran naviguent de titre en titre. (WCAG 1.3.1)
  2. Chaque page a un titre unique et descriptif (<title>) — « Panier (2 articles) — Boutique » plutôt que « Accueil ». (WCAG 2.4.2)
  3. Les liens sont explicites hors contexte: « Voir le rapport d’audit » plutôt que « cliquez ici ». (WCAG 2.4.4)
  4. La langue de la page est déclarée (<html lang="fr">) — sinon les synthèses vocales prononcent le français avec des règles anglaises. (WCAG 3.1.1)

Affichage & robustesse

  1. La page reste utilisable zoomée à 200 % et se recompose sur mobile sans défilement horizontal. (WCAG 1.4.4, 1.4.10)
  2. Les animations respectent prefers-reduced-motion et rien ne clignote plus de 3 fois par seconde. (WCAG 2.3.1, 2.3.3)
  3. L’ARIA est correct — ou absent : un mauvais role ou un aria-labelvide est pire que pas d’ARIA du tout. Les noms accessibles correspondent aux libellés visibles. (WCAG 4.1.2, 2.5.3)

Automatisable ou pas ?

Environ un tiers de cette liste se vérifie automatiquement et de façon fiable : contrastes, alternatives manquantes, étiquettes de champs, langue, structure des titres, validité ARIA. C’est exactement ce que détecte un scan Aklario — avec, pour chaque problème, les éléments concernés et la correction suggérée. Le reste (pertinence des textes, parcours complexes au lecteur d’écran) demande un œil humain : automatisez le premier tiers, concentrez l’expertise humaine sur le reste.