Comprendre les normes WCAG
Objectifs du module
- Expliquer ce que sont les WCAG (Web Content Accessibility Guidelines).
- Comprendre les principes fondamentaux POUR (Perceivable, Operable, Understandable, Robust).
- Identifier les niveaux de conformité (A, AA, AAA).
- Savoir comment appliquer ces normes dans un projet web.
1. Qu’est-ce que les WCAG ?
Créées par le W3C (World Wide Web Consortium), les WCAG sont un ensemble de règles internationales qui servent de référence pour rendre le web accessible. Elles sont utilisées comme base pour de nombreuses législations nationales, comme la Section 508 aux États-Unis ou le RGAA en France.
2. Les 4 principes POUR
Les WCAG s’organisent autour de 4 principes fondamentaux pour une expérience accessible :
- Perceivable (Perceptible) : Le contenu doit pouvoir être perçu par tous les sens.
Exemple : textes alternatifs pour les images, sous-titres pour les vidéos. - Operable (Utilisable) : Le site et ses fonctionnalités doivent être navigables.
Exemple : tout doit être accessible au clavier, pas seulement à la souris. - Understandable (Compréhensible) : Le contenu et l’interface doivent être clairs.
Exemple : un langage simple, des instructions claires dans les formulaires. - Robust (Robuste) : Le site doit être compatible avec les technologies d’assistance.
Exemple : un code HTML valide et sémantique que les lecteurs d’écran peuvent interpréter.
3. Les niveaux de conformité
Les règles des WCAG sont classées en trois niveaux de priorité :
- Niveau A : C’est le niveau d’accessibilité minimal. Ne pas l’atteindre rend le site inutilisable pour certains groupes.
- Niveau AA : C’est le standard recommandé et l’objectif visé par la plupart des sites et des législations.
- Niveau AAA : C’est le plus haut niveau d’accessibilité, souvent très exigeant et réservé à des sites spécifiques (par exemple, des services pour personnes handicapées).
Outils Pratiques
Pour appliquer ces principes, des outils sont indispensables. Le contraste des couleurs, par exemple, est un critère clé du principe « Perceptible ».
- Vérificateur de contraste : Pour vous assurer que vos couleurs sont conformes à la norme AA, vous pouvez utiliser cet analyseur de contraste.
Exercices Interactifs
Exercice 1 – Associez
Associez le principe WCAG avec l’exemple :
- Navigation uniquement possible à la souris → ❓
- Ajouter une alternative texte à une image → ❓
- Écrire en langage clair → ❓
- Utiliser du code HTML valide → ❓
Afficher la correction
- Navigation uniquement possible à la souris → B (Operable)
- Ajouter une alternative texte à une image → A (Perceivable)
- Écrire en langage clair → C (Understandable)
- Utiliser du code HTML valide → D (Robust)
Exercice 2 – Vrai ou Faux
- Le niveau AAA est obligatoire pour tous les sites web.
- Le principe « Operable » signifie qu’on doit pouvoir utiliser un site au clavier.
- Les WCAG ne concernent que les images.
Afficher la correction
- ❌ Faux → Seul le niveau A est obligatoire dans certains contextes, AA est le standard recommandé.
- ✅ Vrai → « Operable » inclut la navigation au clavier comme un critère essentiel.
- ❌ Faux → Les WCAG couvrent tous les aspects : textes, images, vidéos, formulaires, structure, etc.
Exercice 3 – Mise en situation
Un site de e-commerce affiche un message d’erreur dans un formulaire : ❌ “Error 123”
Question : Pourquoi ce message n’est pas conforme aux WCAG et comment le corriger ?
Afficher la correction
Problème : “Error 123” est incompréhensible et n’aide pas l’utilisateur → non conforme au principe Understandable (Compréhensible).
Version conforme : “Votre adresse email est invalide. Veuillez entrer une adresse au format exemple@site.com.”
Résumé en slides
Prêt pour la suite ?
Maintenant que vous connaissez les fondations théoriques, passons à la pratique avec les règles d’accessibilité pour le contenu textuel.
Accéder au Module 2
Laisser un commentaire