Leçon 8Principes et normes d'accessibilité du Web
- Notion 51 - Tout commence par les WCAG (Directives pour l'accessibilité du contenu Web)
- Notion 52 - Le 1er principe des WCAG : Perceptible
- Notion 53 - Le deuxième principe des WCAG : Utilisable
- Notion 54 - Le troisième principe des WCAG : Compréhensible
- Notion 55 - Le 4e principe des WCAG : Robustesse
- Notion 56 - Comprendre les trois niveaux de conformité à l'accessibilité du Web (A, AA, AAA)
- Notion 57 - Pouvez-vous évaluer le degré de conformité d'une page Web aux niveaux de conformité WCAG ?
- Notion 58 - Utiliser les principes et les normes d'accessibilité du web pour les médias sociaux
- Notion 59 - Revue des concepts principaux
Notion 57
Pouvez-vous évaluer le degré de conformité d'une page Web aux niveaux de conformité WCAG ?
Compétences ciblées
Exercice
À l'aide de la liste de contrôle figurant dans le texte des ressources, déterminez les critères de réussite WCAG de chaque niveau de conformité auxquels la page Web ci-dessous répond et ceux auxquels elle ne répond pas.
Vous pouvez également ouvrir la page Web en externe à cette source : https://www.delish.com/cooking/recipe-ideas/a35555471/loaded-aranitas-recipe/.
Dans l'exemple fourni, l'objectif de la page Web est de montrer aux utilisateurs comment réaliser une recette de cuisine.
Ressources
Utilisez les critères de réussite de cette liste de contrôle pour évaluer la conformité aux niveaux de conformité WCAG :
Description
Une liste de critères correspondant aux niveaux de conformité WCAG, A, AA et AAA.
Pour des critères de réussite plus techniques, visitez cette ressource de la notion 91 : https://color.a11y.com/?wc3.
Vous pouvez y saisir l'URL de la page Web ou les codes couleur HEX du texte et de l'arrière-plan pour déterminer s'ils sont suffisamment contrastés.
Code couleur du texte : #3b3734
Code couleur de l'arrière-plan : #ffffff
Correction
Comment pensez-vous avoir réussi ? Pour le savoir, jetez un coup d'œil à la liste de contrôle complétée et aux explications correspondantes.
Description de l'image
La même liste de critères remplie avec seulement quelques critères cochés (détaillés ci-après).
Principaux points à retenir :
- La page Web est partiellement conforme à tous les niveaux de conformité, mais elle n'a pas entièrement rempli les critères de réussite de chaque niveau.
- Pour le niveau A :
Même si la page Web présente une vidéo avec des sous-titres, la vidéo est également réglée pour être lue automatiquement (comme le montre l'invite dans le coin supérieur droit de la vidéo "Click to unmute"). La page Web comporte un titre utile et clair, mais elle ne comporte pas de lien "Passer au contenu". Au lieu de cela, l'utilisateur doit faire défiler une interview verbeuse, même si son objectif principal en venant sur la page était de lire une recette.
- Pour le niveau AA :
La page Web ne fournit pas de description audio du contenu de la vidéo. Pourtant, elle respecte trois bonnes pratiques : fournir des titres et des étiquettes, offrir plus d'un moyen de trouver le contenu (avec un menu et une fonction de recherche) et appliquer un contraste de couleurs suffisant.
- Pour le niveau AAA :
Le texte est rédigé de manière compréhensible et détaillée pour aider les utilisateurs. Cela signifie qu'il est accessible aux personnes ayant au moins neuf ans de scolarité. Cependant, le texte aurait pu être mieux divisé avec davantage de titres. Une autre bonne pratique manquante consiste à permettre aux utilisateurs de savoir où ils se trouvent (par exemple, en ajoutant des fils d'Ariane conceptuels).