WCAG 2.2 – tous les critères de succès en un coup d’œil
Les WCAG sont la référence sur laquelle s’appuie la directive européenne sur l’accessibilité. Cette vue d’ensemble liste tous les critères de la version 2.2 – le résumé pour survoler, la page pour comprendre.
A est le socle, AA la référence pour la réglementation européenne, AAA l’optimum. C’est AA qui est normalement exigé.
A 32 · AA 24 · AAA 31 — 87 critères
| Nr. | Sommaire | En une phrase |
|---|---|---|
| 1.1 Équivalents textuels Principe 1: Perceptible | ||
| 1.1.1 | Contenu non textuel | Tout ce qui n'est pas du texte doit avoir un équivalent textuel : images, icônes, graphiques, commandes. |
| 1.2 Média temporel Principe 1: Perceptible | ||
| 1.2.1 | Contenu seulement audio ou seulement vidéo (préenregistré) | Un enregistrement sonore seul demande une transcription, une vidéo sans son une description. |
| 1.2.2 | Sous-titres (préenregistrés) | Toute vidéo préenregistrée avec du son doit être sous-titrée. |
| 1.2.3 | Audio-description ou version de remplacement (préenregistré) | Ce qui ne se voit qu'à l'image doit aussi être audible ou lisible. |
| 1.2.4 | Sous-titres (en direct) | Les diffusions en direct doivent aussi être sous-titrées. |
| 1.2.5 | Audio-description (préenregistrée) | Les vidéos préenregistrées demandent une audio-description – une transcription ne suffit plus. |
| 1.2.6 | Langue des signes (préenregistrée) | Les vidéos préenregistrées sont en plus traduites en langue des signes. |
| 1.2.7 | Audio-description étendue (préenregistrée) | Si les silences ne suffisent pas à la description, la vidéo se met en pause. |
| 1.2.8 | Version de remplacement pour un média temporel (préenregistré) | Une version texte complète existe en plus du reste. |
| 1.2.9 | Contenu seulement audio (en direct) | Le contenu parlé en direct sans image reçoit un équivalent textuel en temps réel. |
| 1.3 Adaptable Principe 1: Perceptible | ||
| 1.3.1 | Information et relations | La structure doit exister dans le code, pas seulement dans l'apparence. |
| 1.3.2 | Ordre séquentiel logique | L'ordre du code doit produire le même sens que la disposition à l'écran. |
| 1.3.3 | Caractéristiques sensorielles | Les instructions ne doivent pas reposer sur la forme, la couleur, la taille ou la position seules. |
| 1.3.4 | Orientation Nouveau dans WCAG 2.1 | Le contenu ne doit pas être bloqué en mode portrait ou paysage. |
| 1.3.5 | Identifier la finalité de la saisie Nouveau dans WCAG 2.1 | Les champs qui demandent des données personnelles doivent être identifiables par la machine. |
| 1.3.6 | Identifier la finalité Nouveau dans WCAG 2.1 | Les commandes et les icônes reçoivent aussi une signification lisible par la machine. |
| 1.4 Distinguable Principe 1: Perceptible | ||
| 1.4.1 | Utilisation de la couleur | La couleur ne doit jamais être le seul moyen de transmettre une information. |
| 1.4.2 | Contrôle du son | Un son qui démarre seul et dure plus de trois secondes doit pouvoir être arrêté. |
| 1.4.3 | Contraste (minimum) | Le texte demande un contraste d'au moins 4,5:1, le grand texte 3:1. |
| 1.4.4 | Redimensionnement du texte | Le texte doit pouvoir être agrandi à 200 % sans perte de contenu. |
| 1.4.5 | Texte sous forme d'image | Le texte doit être livré comme texte, pas comme image. |
| 1.4.6 | Contraste (amélioré) | Le texte atteint au moins 7:1, le grand texte 4,5:1. |
| 1.4.7 | Arrière-plan sonore faible ou absent | Dans les enregistrements parlés, les bruits de fond sont faibles ou désactivables. |
| 1.4.8 | Présentation visuelle | Le lecteur peut régler couleurs, largeur de ligne, interlignage et alignement. |
| 1.4.9 | Texte sous forme d'image (sans exception) | Le texte en image ne sert plus qu'à la décoration et aux logos. |
| 1.4.10 | Redistribution Nouveau dans WCAG 2.1 | Le contenu doit se recomposer dans une fenêtre étroite sans défilement horizontal. |
| 1.4.11 | Contraste du contenu non textuel Nouveau dans WCAG 2.1 | Les commandes et les graphiques porteurs de sens demandent aussi 3:1. |
| 1.4.12 | Espacement du texte Nouveau dans WCAG 2.1 | Augmenter interligne, espacement des mots et des paragraphes ne doit rien faire perdre. |
| 1.4.13 | Contenu au survol ou au focus Nouveau dans WCAG 2.1 | Le contenu qui apparaît doit rester atteignable et ne pas disparaître seul. |
| 2.1 Accessibilité au clavier Principe 2: Utilisable | ||
| 2.1.1 | Clavier | Tout doit être utilisable au clavier. |
| 2.1.2 | Pas de piège au clavier | Le focus clavier ne doit rester bloqué nulle part. |
| 2.1.3 | Clavier (sans exception) | Utilisation au clavier sans les exceptions de 2.1.1. |
| 2.1.4 | Raccourcis clavier utilisant un caractère Nouveau dans WCAG 2.1 | Les raccourcis à une seule lettre doivent pouvoir être désactivés ou réattribués. |
| 2.2 Délai suffisant Principe 2: Utilisable | ||
| 2.2.1 | Réglage du délai | Les limites de temps doivent pouvoir être désactivées, prolongées ou ajustées. |
| 2.2.2 | Mettre en pause, arrêter, masquer | Le contenu animé ou qui se met à jour seul doit pouvoir être arrêté. |
| 2.2.3 | Pas de délai | Aucune limite de temps – sauf pour les événements en direct. |
| 2.2.4 | Interruptions | Les interruptions peuvent être différées ou supprimées. |
| 2.2.5 | Ré-authentification | Après expiration d'une session, on continue sans perte de données. |
| 2.2.6 | Délais d'expiration Nouveau dans WCAG 2.1 | L'utilisateur est prévenu si l'inactivité peut faire perdre des données. |
| 2.3 Crises et réactions physiques Principe 2: Utilisable | ||
| 2.3.1 | Pas plus de trois flashs | Rien ne doit clignoter plus de trois fois par seconde. |
| 2.3.2 | Trois flashs | Aucun clignotement au-delà de trois par seconde – sans les exceptions de 2.3.1. |
| 2.3.3 | Animation à partir d'interactions Nouveau dans WCAG 2.1 | Les animations de mouvement peuvent être désactivées. |
| 2.4 Navigable Principe 2: Utilisable | ||
| 2.4.1 | Contourner des blocs | Les blocs répétés comme la navigation doivent pouvoir être sautés. |
| 2.4.2 | Titre de page | Chaque page a besoin d'un titre explicite. |
| 2.4.3 | Parcours du focus | L'ordre de tabulation doit avoir du sens. |
| 2.4.4 | Fonction du lien (selon le contexte) | Le lien – au besoin avec son contexte – doit révéler sa destination. |
| 2.4.5 | Accès multiples | Il existe plus d'un moyen d'atteindre une page. |
| 2.4.6 | En-têtes et étiquettes | Les titres et les étiquettes doivent décrire leur objet. |
| 2.4.7 | Visibilité du focus | L'élément qui a le focus doit être mis en évidence visuellement. |
| 2.4.8 | Localisation | L'utilisateur sait où il se trouve dans le site. |
| 2.4.9 | Fonction du lien (lien seul) | Le texte du lien seul doit révéler sa destination. |
| 2.4.10 | En-têtes de section | Les contenus longs sont structurés par des titres. |
| 2.4.11 | Focus non masqué (minimum) Nouveau dans WCAG 2.2 | L'élément qui a le focus ne doit pas être entièrement caché. |
| 2.4.12 | Focus non masqué (amélioré) Nouveau dans WCAG 2.2 | L'élément qui a le focus ne doit pas être masqué du tout – même partiellement. |
| 2.4.13 | Apparence du focus Nouveau dans WCAG 2.2 | L'indicateur de focus demande une taille et un contraste minimaux. |
| 2.5 Modalités d'entrée Principe 2: Utilisable | ||
| 2.5.1 | Gestes du pointeur Nouveau dans WCAG 2.1 | Ce qui demande plusieurs doigts ou un tracé doit aussi fonctionner simplement. |
| 2.5.2 | Annulation du pointeur Nouveau dans WCAG 2.1 | Une action déclenchée par erreur doit pouvoir être annulée. |
| 2.5.3 | Étiquette dans le nom Nouveau dans WCAG 2.1 | Le texte visible d'un élément doit figurer dans son nom accessible. |
| 2.5.4 | Activation par le mouvement Nouveau dans WCAG 2.1 | Les fonctions qui réagissent au secouement ou à l'inclinaison demandent une alternative. |
| 2.5.5 | Taille de la cible (amélioré) Nouveau dans WCAG 2.1 | Les commandes mesurent au moins 44 sur 44 pixels CSS. |
| 2.5.6 | Mécanismes de saisie concomitants Nouveau dans WCAG 2.1 | Le mode de saisie disponible ne doit pas être restreint. |
| 2.5.7 | Mouvements de glissement Nouveau dans WCAG 2.2 | Ce qui se glisse doit aussi fonctionner sans glisser. |
| 2.5.8 | Taille de la cible (minimum) Nouveau dans WCAG 2.2 | Les commandes mesurent au moins 24 sur 24 pixels CSS, ou sont suffisamment espacées. |
| 3.1 Lisible Principe 3: Compréhensible | ||
| 3.1.1 | Langue de la page | La langue de la page doit figurer dans le code. |
| 3.1.2 | Langue d'un passage | Les passages dans une autre langue sont signalés. |
| 3.1.3 | Mots rares | Les termes techniques et les expressions imagées sont expliqués. |
| 3.1.4 | Abréviations | Les abréviations sont développées à leur première apparition. |
| 3.1.5 | Niveau de lecture | Si le texte demande plus qu'un niveau de fin de collège, une version plus simple existe. |
| 3.1.6 | Prononciation | Là où la prononciation conditionne le sens, elle est indiquée. |
| 3.2 Prévisible Principe 3: Compréhensible | ||
| 3.2.1 | Au focus | Donner le focus à un élément ne doit rien déclencher. |
| 3.2.2 | À la saisie | Modifier un réglage ne doit pas changer le contexte tout seul. |
| 3.2.3 | Navigation cohérente | La navigation se trouve au même endroit et dans le même ordre sur toutes les pages. |
| 3.2.4 | Identification cohérente | Une même fonction porte partout le même nom. |
| 3.2.5 | Changement à la demande | Les changements de contexte n'ont lieu que sur demande explicite. |
| 3.2.6 | Aide cohérente Nouveau dans WCAG 2.2 | Les moyens d'obtenir de l'aide se trouvent au même endroit sur toutes les pages. |
| 3.3 Assistance à la saisie Principe 3: Compréhensible | ||
| 3.3.1 | Identification des erreurs | Une erreur de saisie doit être signalée – sous forme de texte. |
| 3.3.2 | Étiquettes ou instructions | Les champs de saisie ont besoin d'une étiquette. |
| 3.3.3 | Suggestion après une erreur | Quand c'est possible, indiquez aussi comment corriger. |
| 3.3.4 | Prévention des erreurs (juridique, financier, données) | Les saisies à conséquences peuvent être vérifiées, corrigées ou annulées. |
| 3.3.5 | Aide | Une aide contextuelle accompagne les formulaires. |
| 3.3.6 | Prévention des erreurs (toutes) | Vérification, correction et annulation valent pour tous les formulaires. |
| 3.3.7 | Saisie redondante Nouveau dans WCAG 2.2 | Les informations déjà fournies ne sont pas redemandées. |
| 3.3.8 | Authentification accessible (minimum) Nouveau dans WCAG 2.2 | La connexion ne doit pas exiger un effort de mémoire. |
| 3.3.9 | Authentification accessible (améliorée) Nouveau dans WCAG 2.2 | La reconnaissance d'objets ou d'images est également exclue pour se connecter. |
| 4.1 Compatible Principe 4: Robuste | ||
| 4.1.1 | Analyse syntaxique (supprimé) Supprimé dans WCAG 2.2 | Supprimé dans WCAG 2.2 – les navigateurs modernes rattrapent le balisage fautif. |
| 4.1.2 | Nom, rôle et valeur | Chaque commande doit exposer son nom, son rôle et son état à la machine. |
| 4.1.3 | Messages d'état Nouveau dans WCAG 2.1 | Les messages qui apparaissent sans changement de focus doivent être annoncés. |
Wave Access teste votre site au regard de ces critères, en corrige une partie dans le code livré et vous indique quoi faire pour le reste.
Découvrir Wave Access →