Une nouvelle version du WCAG 2.x se prépare, le WCAG 2.2. Cet article se base sur la version draft du 21/05/2021*. Il est susceptible que les éléments présentés ne soient plus pertinents lors de la publication officielle du WCAG 2.2.
Il est d’abord important de noter que tout support conforme au WCAG 2.2 le sera également au WCAG 2.1.
Jetons un coup d’œil ensemble sur la synthèse des modifications, par rapport à la version 2.1.
En premier lieu, l'addition de 9 nouveaux critères d’accessibilité qui renforce la prise en compte des utilisateurs ayant des troubles cognitifs, utilisateurs malvoyants et utilisateurs sur mobile.
On note actuellement :
- 4 nouveaux critères niveau A
- 4 nouveaux critères niveau AA
- 1 nouveau critère niveau AAA
A cela s’ajoute le passage du niveau double A (AA) au niveau simple (A) A pour le critère 2.4.7 Focus visible. Ce changement renforce l’importance de la navigation clavier dans cette nouvelle version.
Les nouveaux critères niveau A
3.2.6 Cohérence de l’aide (Nouveau critère, Niveau A)
Le critère : pour une page web ou un ensemble de pages qui présente une aide à l’utilisateur, cette aide ou l’accès à celle-ci doit être positionnée de façon cohérente. Les mécanismes d’aide possible sont les suivants :
- Les coordonnées de contacts (téléphone, email, heures d’ouverture du service) ;
- Un dispositif de contact comme un système de messagerie, chat, formulaire de contact, réseaux sociaux ;
- Une FAQ, page support ou mécanisme équivalent ;
- Un mécanisme de contact complètement automatisé comme un chatbot.
L’accès à ces mécanismes pourra être directement intégré sur chacune des pages du site web ou bien via un lien à la page qui contient cette information.
Commentaire : ce critère doit permettre aux utilisateurs de retrouver facilement l’aide quelle que soit la page du site consulté.
L’aide est un élément essentiel pour toute personne sur un site internet. Rendre cohérent le positionnement et l’accès aux aides est un principe de conception à adopter au-delà du numérique accessible. L’ajout de ce critère est un gage d’amélioration des interfaces et d’amélioration de l’expérience utilisateur.
Remarque : ce critère ne demande pas qu’un support soit proposé. Il demande que lorsque l’aide est disponible, celle-ci soit disponible de la même manière sur chaque page.
3.3.7 Authentification accessible (Nouveau critère, Niveau A)
Le critère : pour chaque étape d'un processus d'authentification qui repose sur un test cognitif, au moins une autre méthode d'authentification est disponible qui ne repose pas sur un test cognitif, ou un mécanisme est disponible pour aider l'utilisateur à effectuer le test.
Pour information, un test cognitif est une tâche qui requiert une mémorisation, une manipulation ou une transcription d’information de la part de l’utilisateur.
Ex : faire un calcul mathématique pour vérifier son identité, transcrire un texte …
Une alternative peut donc être de faire un copier-coller pour les transcriptions.
Commentaire : sur une majorité de site, les authentifications demandées ne sont pas accessibles à une partie de la population et bloquent tout simplement l’usage même du site. L’absence de prise en compte de l’accessibilité est donc critique pour les utilisateurs en situation de handicap. On peut noter, par exemple, les CAPTCHA visuels qui ne sont pas accessibles aux personnes malvoyantes ou aveugles, utilisant un lecteur d’écran avec aucune alternative à ces méthodes d'authentification.
Lors de la mise en œuvre de ce genre d’authentification, la réflexion autour de la présence d'alternatives doit devenir un réflexe et une obligation dans tout projet.
3.3.8 Entrées redondantes (Nouveau critère, A)
Le critère : les informations précédemment saisies ou fournies par l’utilisateur ne doivent pas être saisies une nouvelle fois pour le même processus ou dans la même session utilisateur.
Ces informations sont alors :
- Soit automatiquement remplies
- Soit séléctionnables par l’utilisateur.
Ce critère ne s’applique pas lorsque :
- La ressaisie des informations est indispensable,
- Les informations sont nécessaires pour assurer la sécurité du contenu
- Les informations entrées précédemment ne sont plus valides.
Commentaire : outre la plus-value concernant l’accessibilité, ce critère diminue la charge mentale de n’importe quel utilisateur dans le remplissage de formulaires, par exemple. L’expérience utilisateur se voit donc améliorée pour tous. Le respect de ce critère facilite également grandement lors du remplissage des formulaires sur mobiles ou la saisie est plus difficile.
Exemple lors de l’accès à un compte Google, les accès sont déjà enregistrés, ce qui évite à l’utilisateur d’avoir à les réécrire à chaque processus similaire
2.4.13 Navigation par saut de pages (Nouveau critère, Niveau A)
Le critère : pour tous les contenus web avec des marqueurs de saut de pages, un mécanisme est disponible pour naviguer entre chaque marqueur.
Commentaire : ce critère s’adresse notamment aux services du Digital Publishing (dont notre logiciel Publispeak fait partie), qui donnent accès à tout type de personnes au contenu d’un livre, par exemple.
Le fait d’avoir une pagination digitale équivalente à un fichier print permet de se référer à n’importe quelle interface et de se repérer de façon identique quelle que soit l’interface utilisée.
Exemple de marqueur de saut de pages :
Une version digitale, ebook, inclut des marqueurs de sauts de pages pour qu’elles s’alignent à la version print (la page sur l’ebook est la même que celle de la version print).
Les nouveaux critères niveau AA
2.4.11 Apparence du focus (Nouveau critère, Niveau AA)
Le critère : lorsque les composants de la page reçoivent le focus clavier, les conditions suivantes doivent être remplies :
- Zone contrastée : le rapport de contraste entre les couleurs de l’état focussé et non focussé est de 3 :1 minimum
- Zone minimale : la zone focussée doit être au moins aussi grande que :
- Le périmètre du composant non focussé. La zone focussée doit avec une épaisseur d’au moins 1 pixel CSS, ou
- Une bordure d’au moins 4 pixels CSS d’épaisseur sur le côté le plus court du composant et ne devant pas être inférieure à 2 pixels CSS
- Le contraste du focus devra respecter le ratio 3 : 1 par rapport aux couleurs adjacente
- L’élément sélectionné ne doit pas être masqué par le contenu
Commentaire : ce critère renforce l’importance donnée à la prise en compte de la navigation clavier. Cet élément d’interface souvent oublié lors de la conception devra faire l’objet d’une réflexion plus approfondie en matière de design et ce, quels que soit les éléments focusables : liens, boutons, images liens, mais également l’ensemble des champs de formulaires.
La lecture de ce critère peut paraître complexe et laisser peu de choix de conception. C’est tout le contraire ! Les choix de conception du focus sont multiples : l’encadré du composant, le soulignement, le remplissage, une barre sur le côté du composant, son agrandissement, etc..
L’important est de respecter la notion de perception minimal du composant : sa taille, son épaisseur et son contraste.
2.5.7 Mouvement de glissement (Nouveau critère, AA)
Le critère : toutes les fonctionnalités nécessitant un mouvement de glissement pour réaliser une action doivent pouvoir être réalisées également sans glisser et par un seul pointeur. Ce critère n’est pas valable si le mouvement est indispensable à la réalisation de l’action.
Commentaire : sur des sites qui jouent beaucoup sur l’interactivité, le glissé-déposé est souvent employé sans alternative. C’est une bonne résolution que de demander une alternative fonctionnelle au glissé-déposé, très présent dans les habitudes des utilisateurs. Ce critère est également axé sur l’usage au clavier.
La prise en compte de ce critère demande un changement conséquent des habitudes de conception en intégrant comme élément de spécification, la navigation clavier au même titre que la navigation à la souris ou tactile.
2.5.8 Taille des éléments cliquables (Nouveau critère, Niveau AA)
Le critère : les cibles ont une superficie d'au moins 24 x 24 pixels CSS, sauf dans les cas suivants :
- La taille de l’élément ajouter et l’écart entre les élément cibles adjacentes fait au moins 24 pixels CSS;
- L’élément cible est dans une phrase ou un bloc de texte ;
- Une présentation particulière de l’élément cible est essentielle à l'information véhiculée.
Commentaire : ce critère, souvent recommandé, est désormais inscrit dans la mise à jour du WCAG 2.2. Auparavant, seul le critère triple A (AAA) 2.5.5 Taille cible (améliorée) existait. Ce nouveau critère permet de donner un niveau supplémentaire pour l’intégration de recommandations à destination des personnes ayant des difficultés dans l’atteinte des cibles trop petites.
Le respect de ce critère doit permettre aux utilisateurs d’activer facilement une zone sans activer accidentellement une zone adjacente.
Dans le premier exemple, les icônes représentent 50 px de diamètre. Le critère est validé.
Dans le deuxième exemple, les icônes (20 px) + l’écart entre les icônes sont supérieurs à 24px. Le critère est également valide.
3.2.7 Contrôles Visibles (Nouveau critère, AA)
Le critère : lorsque que le survol de l’élément focusable ou la prise de focus clavier déclenche la visibilité de composants de l'interface utilisateur, les informations nécessaires pour identifier que les composants de l'interface utilisateur sont disponibles sont visibles, sauf lorsque :
- Les informations nécessaires pour identifier les composants de l'interface utilisateur sont disponibles via un composant équivalent qui est visible sur la même page ou à une étape différente dans un processus à plusieurs étapes sans nécessiter le survol du pointeur ou le focus clavier ;
- Le composant est fourni spécifiquement pour améliorer l'expérience de navigation au clavier ;
- Un mécanisme est disponible pour rendre les informations visibles de manière persistante ;
- Cacher les informations nécessaires à l'identification du composant est essentiel.
Commentaire : le respect de ce critère doit permettre aux personnes en situation de handicap cognitif, de perte de vision ou de handicaps moteur de trouver facilement les composants d’interface et notamment les composants de contrôle.
Ce critère prend bien sûr en compte certains éléments qui ne sont pas accessibles à la tabulation comme les liens d’évitement. Ces derniers n’ont pas d’obligation d’être visible en permanence.
Le nouveau critère niveau AAA
2.4.12 Apparence du focus - Amélioré (Nouveau critère, Niveau AAA)
Le critère : lorsque les composants de la page reçoivent le focus clavier, les conditions suivantes doivent être remplies :
- Zone contrastée : le rapport de contraste entre les couleurs de l’état focussé et non focussé est de 4.5 :1 minimum
- Zone minimale : la zone focusée doit être au moins aussi grande que le périmètre du composant non focussé avec une épaisseur d’au moins 2 pixels CSS,
- Aucune partie du focus n’est masquée par le contenu créé
Commentaire : ce critère vient renforcer la visibilité du focus et donc permet d’améliorer la perception du focus pour les personnes naviguant uniquement au clavier ; les personnes malvoyantes et les personnes ayant des limitations de l’attention de mémoire à cout termes par exemple.
--------------------------------------------------------------
Les critères ajoutés participent à rendre l’interface utilisateur plus opérationnelle (5 critères) et plus compréhensible (4 critères) pour les utilisateurs en situation de handicap. Certains nouveaux critères renforcent la nécessité de repenser les bases de la conception : intégrer la navigation clavier comme une composante à part entière de l’obligation d’accessibilité des designers ; penser aux alternatives des composants riches (glissé-déposé / captcha, etc..) ; taille minimale des composants, etc...
Des réflexions, pendant la rédaction du draft du WCAG 2.2, sont encore en cours et des ajustements seront sans doute réalisés en vue de renforcer l’accessibilité numérique. L’évolution du WCAG est permanente et d’autres critères viendront certainement enrichir cette obligation légale (interface vocale ou tactile par exemple.)
*Sources
