Checklist accessibilité web complète : 50 points essentiels
En Bref : L'essentiel à retenir
- Cette checklist couvre les 50 points les plus critiques parmi les 106 critères du RGAA, organisés en 10 catégories.
- Elle permet de couvrir rapidement 80% des problèmes d'accessibilité les plus fréquents.
- Chaque point est accompagné d'une méthode de vérification simple et d'un niveau de priorité.
- À utiliser systématiquement à chaque phase de projet : conception, développement, recette et maintenance.
Cette checklist pratique regroupe les 50 points essentiels pour garantir l'accessibilité de votre site web. Utilisez-la à chaque phase de vos projets pour vous assurer que rien n'est oublié.
Comment utiliser cette checklist
Cette liste couvre les vérifications les plus critiques, organisées par thème. Pour chaque point :
- Priorité Critique : Bloque complètement certains utilisateurs
- Priorité Haute : Impact significatif sur l'expérience
- Priorité Moyenne : Amélioration importante mais non bloquante
Pour un audit complet des 106 critères RGAA, utilisez notre outil d'audit.
1. Images et médias (8 points)
Priorité Critique
- Textes alternatifs : Toutes les images informatives ont un attribut
altdescriptif - Images décoratives : Les images sans valeur informative ont un
altvide (alt="") - Vidéos sous-titrées : Les vidéos ont des sous-titres synchronisés
- Contrôle des médias : L'utilisateur peut mettre en pause/arrêter les contenus animés
Priorité Haute
- Images complexes : Les graphiques et infographies ont une description longue accessible
- Transcriptions : Les contenus audio disposent d'une transcription textuelle
- Pas d'autoplay : Les vidéos et audios ne démarrent pas automatiquement avec le son
Priorité Moyenne
- Audiodescription : Les vidéos avec informations visuelles essentielles ont une audiodescription
2. Structure et sémantique (7 points)
Priorité Critique
- Hiérarchie des titres : Un seul
<h1>par page, hiérarchie logique h1 > h2 > h3 - Landmarks : Utilisation de
<nav>,<main>,<header>,<footer>,<aside> - Listes balisées : Les listes utilisent
<ul>,<ol>,<dl>selon le contexte
Priorité Haute
- Langue de la page : L'attribut
langest présent sur la balise<html> - Changements de langue : Les passages en langue étrangère sont balisés avec
lang - Tableaux de données : Les tableaux ont des en-têtes
<th>et un<caption>
Priorité Moyenne
- Balises obsolètes : Pas de
<b>,<i>,<font>pour la mise en forme
3. Navigation et liens (6 points)
Priorité Critique
- Intitulés de liens : Chaque lien a un intitulé explicite (pas de "cliquez ici")
- Liens identiques : Les liens avec le même intitulé mènent à la même destination
- Skip link : Un lien d'évitement vers le contenu principal existe
Priorité Haute
- Navigation cohérente : Le menu principal est présent et cohérent sur toutes les pages
- Plusieurs moyens de navigation : Au moins 2 moyens pour trouver une page (menu, recherche, plan du site)
Priorité Moyenne
- Ordre des liens : L'ordre de tabulation des liens est logique
[!TIP] Pour implémenter correctement un skip link, consultez notre guide dédié.
4. Formulaires (8 points)
Priorité Critique
- Labels associés : Chaque champ a un
<label>associé viafor/id - Champs obligatoires : Les champs requis sont identifiés (pas uniquement par la couleur)
- Messages d'erreur : Les erreurs sont clairement identifiées et expliquées
Priorité Haute
- Erreurs accessibles : Les messages d'erreur sont liés au champ via
aria-describedby - Format attendu : Le format de saisie est indiqué avant le champ
- Autocomplete : Les champs de saisie utilisent l'attribut
autocompleteapproprié
Priorité Moyenne
- Groupes de champs : Les champs liés sont regroupés avec
<fieldset>et<legend> - Validation côté client : Les validations sont accessibles et n'empêchent pas la soumission
Pour approfondir, consultez notre guide des formulaires accessibles.
5. Couleurs et contrastes (5 points)
Priorité Critique
- Contraste texte : Ratio minimum 4.5:1 pour le texte normal, 3:1 pour le grand texte
- Information non chromatique : L'information n'est pas transmise uniquement par la couleur
Priorité Haute
- Contraste composants : Les éléments d'interface ont un contraste de 3:1 minimum
- Contraste focus : L'indicateur de focus est visible (ratio 3:1 minimum)
Priorité Moyenne
- Mode contraste élevé : Le site reste utilisable avec les modes de contraste système
Pour tout savoir sur les contrastes, lisez notre article dédié.
6. Navigation clavier (6 points)
Priorité Critique
- Accès clavier : Tous les éléments interactifs sont atteignables au clavier
- Pas de piège clavier : L'utilisateur peut toujours sortir d'un élément au clavier
- Focus visible : L'indicateur de focus est toujours visible
Priorité Haute
- Ordre logique : L'ordre de tabulation suit l'ordre visuel logique
- Raccourcis clavier : Les raccourcis sont documentés et désactivables si nécessaire
Priorité Moyenne
- Gestion du focus : Le focus est correctement géré lors de l'ouverture/fermeture de modales
7. Contenu textuel (4 points)
Priorité Haute
- Titres de page : Chaque page a un
<title>unique et descriptif - Lisibilité : Le texte peut être agrandi à 200% sans perte de contenu
- Espacement du texte : Le contenu reste lisible avec un interligne augmenté
Priorité Moyenne
- Abréviations : Les abréviations sont expliquées à la première occurrence
8. Composants interactifs (5 points)
Priorité Critique
- États communiqués : Les états (expanded, selected, etc.) sont communiqués via ARIA
- Boutons vs liens : Les boutons sont des
<button>, les liens des<a>
Priorité Haute
- Cibles tactiles : Les zones cliquables font au moins 44x44 pixels
- Live regions : Les mises à jour dynamiques sont annoncées aux lecteurs d'écran
Priorité Moyenne
- Timeout géré : L'utilisateur peut prolonger ou désactiver les délais d'expiration
9. Documents et téléchargeables (3 points)
Priorité Haute
- PDF accessibles : Les PDF sont balisés et accessibles
- Alternatives : Les documents non accessibles ont une alternative HTML
Priorité Moyenne
- Format indiqué : Le format et le poids des fichiers sont indiqués avant téléchargement
10. Vérification globale (3 points)
Priorité Critique
- Déclaration d'accessibilité : Une déclaration conforme est publiée et accessible
- Moyen de contact : Un canal de signalement des problèmes d'accessibilité existe
Priorité Haute
- Compatibilité : Le site fonctionne avec les navigateurs et technologies d'assistance courants
Synthèse par priorité
| Priorité | Nombre de points | Impact |
|---|---|---|
| Critique | 18 | Bloque l'accès |
| Haute | 22 | Impact significatif |
| Moyenne | 10 | Amélioration |
Comment automatiser ces vérifications
Une partie de cette checklist peut être automatisée :
Points automatisables :
- Présence des attributs
alt - Contrastes de couleurs
- Structure des titres
- Labels de formulaires
- Présence du
lang
Points nécessitant une vérification manuelle :
- Pertinence des textes alternatifs
- Logique de l'ordre de tabulation
- Expérience avec lecteur d'écran
- Compréhensibilité des messages d'erreur
Utilisez notre outil d'audit automatisé pour couvrir rapidement les vérifications automatisables, puis complétez par une vérification manuelle des points subjectifs.
[!NOTE] Cette checklist couvre les points les plus critiques. Pour une conformité RGAA complète, les 106 critères doivent être vérifiés. Consultez le référentiel RGAA officiel pour la liste exhaustive.
Conclusion
Cette checklist en 50 points vous permet de couvrir rapidement les aspects les plus impactants de l'accessibilité web. Intégrez-la à vos processus de développement et de recette pour garantir un niveau d'accessibilité minimal sur tous vos projets. Pour aller plus loin, réalisez un audit complet et consultez nos guides pratiques.
Guides RGAA associés
Pour aller plus loin sur les sujets abordés dans cet article, consultez nos fiches techniques :
Chaque image porteuse d'information doit avoir une alternative textuelle pertinente via l'attribut alt. Les images décoratives doivent avoir un attribut alt vide.
Chaque champ de formulaire doit avoir une étiquette (label) qui lui est liée explicitement.
Le contraste entre la couleur du texte et la couleur de son arrière-plan doit être suffisamment élevé (4.5:1 pour le texte normal, 3:1 pour le grand texte).
Articles similaires
Votre site est-il conforme ?
Ne prenez pas de risques avec l'accessibilité. Lancez un audit complet de votre site en quelques minutes et obtenez un rapport détaillé des corrections à apporter.