Pourquoi devrions-nous nous soucier de l'accessibilité du Web ?

Pourquoi devrions-nous nous soucier de l'accessibilité du Web ? Parce que c'est la bonne chose à faire. Non seulement parce qu'il est illégal d'ignorer l'accessibilité (conformité à la section 508 aux États-Unis, à la conformité EN 301 549 en Europe, etc.), mais aussi pour ne pas exclure une personne ayant des besoins spéciaux pour accéder à votre site Web. Il est éthique, respectueux, optimisé pour le référencement, améliore la convivialité sur mobile et aide les utilisateurs disposant de réseaux à faible bande passante. Alors pourquoi pas?

Nous verrons différents aspects de l'accessibilité du Web dans cet article.

À qui profite l'accessibilité Web ?

1. Personnes ayant une déficience visuelle — Les personnes aveugles, malvoyantes et daltoniennes peuvent bénéficier de l'utilisation de lecteurs d'écran, de loupes et de sites Web qui ne reposent pas uniquement sur les couleurs pour fournir des informations.
2. Personnes malentendantes — Les audios et les vidéos doivent avoir des transcriptions.
3. Personnes à mobilité réduite — Certaines pourraient ne pas avoir la capacité d'utiliser une souris. Par conséquent, des raccourcis clavier doivent être fournis pour tout type d'interaction avec le site Web.
4. Personnes ayant des troubles cognitifs — Les personnes ayant des capacités intellectuelles limitées peuvent bénéficier d'un contenu simple, facile à utiliser et non distrayant (évitez de nombreuses publicités) sur le site Web.

La norme internationale WCAG (Web Content Accessibility Guidelines) fournit des directives sur la façon de rendre votre application Web accessible. Certains différenciateurs WCAG notables pour chaque niveau sont

1. WCAG 2.0 Niveau A : Conformité minimale
2. Navigation au clavier
3. Alternatives de contenu non textuel
4. Légendes vidéo
5. Le sens n'est pas transmis uniquement par la forme, la taille, la couleur, etc.
• Le contraste des couleurs est, dans la plupart des cas, d'au moins 4,5:1
• Le texte alternatif ou une solution similaire est utilisé pour les images qui véhiculent un sens
• Les éléments de navigation sont cohérents sur tout le site
• Les champs de formulaire ont des étiquettes précises
• Les mises à jour de statut peuvent être transmises via un lecteur d'écran
• Les titres sont utilisés dans un ordre logique
• Interprétation en langue des signes pour contenu audio ou vidéo
• Le contraste des couleurs est d'au moins 7:1 dans la plupart des cas
• Le timing n'est pas un élément essentiel de toute activité
• Une aide contextuelle est disponible

Opérable :

Utilisable indique que les composants de l'interface utilisateur et la navigation doivent être utilisables.

1. Toutes les fonctionnalités doivent être accessibles à l'aide des commandes du clavier, à quelques exceptions près, où cela ne peut pas être fait, comme le dessin à main levée
2. Aucun piège au clavier où l'utilisateur est bloqué lors de la navigation
3. Moment réglable pour effectuer une opération telle que la réservation d'un vol
4. Les alertes devraient avoir la possibilité de reporter.
5. Si la session d'authentification expire, les utilisateurs doivent avoir la possibilité de se ré-authentifier sans perdre d'informations

Les utilisateurs doivent être capables de percevoir les informations d'une manière ou d'une autre, en utilisant un ou plusieurs de leurs sens.

1. Fournir un texte alternatif pour les images. N'intégrez pas non plus de textes dans les images, placez-les plutôt dans le document
2. Fournir des transcriptions pour l'audio et la vidéo
3. Les contrôles de l'interface utilisateur doivent avoir une étiquette indiquant le but
4. Des formes alternatives de captcha doivent être fournies
5. Utiliser les textes associés aux icônes
6. N'UTILISEZ PAS de codes de couleur pour le statut

Robust indique que le contenu doit être suffisamment robuste pour pouvoir être interprété de manière fiable par une grande variété d'agents utilisateurs, y compris les technologies d'assistance.

1. Le contenu doit être facilement analysable par les lecteurs d'écran
2. Le nom, le rôle et la valeur de chaque élément de formulaire doivent être déterminables par programme
3. Les utilisateurs de technologies d'assistance sont informés des nouveaux messages d'état ajoutés à la page.

Compréhensible indique que les informations et le fonctionnement de l'interface utilisateur doivent être compréhensibles.

1. Le langage humain par défaut de chaque page Web doit être détectable via le code.
2. Les abréviations doivent être accompagnées d'extensions
3. Un mécanisme devrait être fourni pour permettre aux utilisateurs d'accéder à la prononciation des mots là où ils sont nécessaires pour comprendre pleinement le contenu.

Vous pouvez utiliser les outils d'évaluation de l'accessibilité Web pour évaluer si le site Web répond aux directives mentionnées ci-dessus. Ce serait formidable s'il était intégré au pipeline CICD et exécuté automatiquement, comme celui pris en charge par Azure Dev Ops

Comment le navigateur prend-il en charge l'accessibilité ?

Les navigateurs construisent l'arborescence DOM (Document Object Model) à partir des balisages. Cela inclut tous les éléments, attributs et nœuds de texte de l'interface utilisateur. Les navigateurs créent également une arborescence d'accessibilité à partir de l'arborescence DOM qui est utilisée par les API d'accessibilité spécifiques à la plate-forme pour fournir une représentation utilisée par les technologies d'assistance telles que les lecteurs d'écran.

Conclusion

L'accessibilité est l'un des aspects les plus importants d'une application Web. Cependant, il existe encore de nombreuses applications qui ne disposent même pas de fonctionnalités d'accessibilité minimales. En tant que leader de l'ingénierie ou développeur, je recommanderais que nous intégrions fortement cette fonctionnalité dans notre cycle de développement et que nous fournissions des processus de déclenchement pour répondre aux directives WCAG.

~ Aruna Veerappan