Comment tester l'accessibilité de votre site Web • WPShout

By | janvier 26, 2021

WordPress pas cher

Plus d'un milliard de personnes dans le monde et 1 adulte américain sur 4 ont un handicap. Les sites Web qui ne sont pas conçus pour être accessibles sont difficiles pour les personnes handicapées à naviguer et à utiliser, et les sites Web inaccessibles exposent leurs propriétaires au risque de recevoir une plainte ou une poursuite en matière d'accessibilité. Il est de plus en plus important pour les développeurs aux États-Unis, au Canada et dans l'UE de s'assurer que les sites Web qu'ils créent sont accessibles.

Vous ne savez pas ce qu'est l'accessibilité du site Web et comment vous assurer que les sites Web que vous créez sont accessibles? Vous êtes au bon endroit. Ce didacticiel couvre les principes de base pour comprendre l'accessibilité Web en tant que développeur et comment tester votre site Web pour les problèmes d'accessibilité.

Qu'est-ce que l'accessibilité Web exactement?

L’accessibilité du Web fait référence à la convivialité d’un site Web pour les personnes présentant diverses limitations permanentes ou situationnelles. La cécité, les troubles auditifs, les troubles moteurs qui limitent la capacité d’utiliser une souris ou un clavier et les troubles cognitifs sont des exemples de handicaps qui peuvent avoir un impact sur la capacité des utilisateurs à utiliser un site Web sans considérations de codage spécifiques.

Un site Web accessible est un site Web auquel les utilisateurs de toutes capacités, y compris les utilisateurs de technologies d'assistance, peuvent facilement accéder, interagir et naviguer. Depuis 2008, il existe des normes internationalement reconnues que les concepteurs et les développeurs peuvent suivre pour s'assurer que leurs sites Web sont accessibles. Ces normes sont appelées les Directives pour l'accessibilité du contenu Web (WCAG).

Principales caractéristiques des sites Web accessibles

Les Directives pour l'accessibilité du contenu Web se composent de «critères de réussite» qui peuvent être utilisés pour mesurer le niveau d'accessibilité d'un site Web. Les critères ont été créés pour garantir que les sites Web sont:

  • Perceptible: les informations et éléments présents sur le site peuvent être perçus par les utilisateurs quelle que soit leur expérience. Par exemple, les utilisateurs aveugles peuvent demander à leurs lecteurs d'écran de lire le texte du site Web qu'ils ne peuvent pas voir, et les utilisateurs d / sourds peuvent lire une transcription ou des légendes si une vidéo est présente qu'ils ne peuvent pas entendre.
  • Opérable: Toutes les personnes sur tous les appareils peuvent utiliser tous les composants de l'interface utilisateur, les éléments interactifs et la navigation du site. Le site Web doit être entièrement fonctionnel pour les personnes qui n'utilisent pas de clavier et de souris traditionnels pour naviguer sur le Web.
  • Compréhensible: Le contenu et les fonctionnalités du site Web doivent être compréhensibles. Cela s'applique également aux éléments tels que le niveau de lecture de la page et le contenu textuel réel du site Web, ainsi qu'aux fonctionnalités du site Web.
  • Robuste: La façon dont le site Web est construit, à la fois par le biais du code et de la saisie de contenu, doit pouvoir être consultée et interprétée par une variété d'appareils et de technologies d'assistance.

La meilleure façon de s'assurer que les sites Web que vous développez sont accessibles aux personnes de toutes capacités est d'effectuer des tests d'accessibilité manuels en plus d'exécuter une analyse automatisée de l'IA.

Comment choisir un outil d'analyse d'accessibilité automatisé

Les scanners d'accessibilité automatisés sont une bonne première étape pour identifier si des erreurs d'accessibilité sont présentes sur un site Web et s'il ne répond pas aux normes d'accessibilité du Web. Les outils de vérification automatisée de l'accessibilité utilisent les consignes mentionnées ci-dessus pour signaler les erreurs d'accessibilité qui peuvent être identifiées par programme en consultant le code du site Web.

Lors du choix d'un outil automatisé, il est essentiel de prendre en compte les éléments suivants:

  • Combien de pages et d'articles ai-je sur mon site Web? Cet outil sera-t-il capable de les numériser tous?
  • Est-ce que je veux un outil distinct de mon site Web ou un outil que je peux utiliser sans quitter mon site Web?
  • Dois-je utiliser cet outil sur plus d'un site Web? Si tel est le cas, puis-je utiliser cet outil sur plus d'un site Web simultanément?
  • Que faire si j'ai besoin d'aide pour résoudre les erreurs d'accessibilité signalées par cet outil sur mon site Web? Le développeur de l'outil propose-t-il une assistance supplémentaire?

En gardant à l'esprit les réponses à ces questions, vous pouvez trouver un outil d'accessibilité automatisé qui fonctionnera le mieux pour vous. Vous trouverez ci-dessous quelques exemples d'outils couramment utilisés pour analyser les sites Web à la recherche d'erreurs ou de problèmes d'accessibilité.

VAGUE

WAVE est un service gratuit développé par WebAIM, une organisation dédiée aux pratiques d'accessibilité Web. WAVE évalue le contenu Web et signale les erreurs d'accessibilité et WCAG.

WAVE est parfait pour les petits sites Web qui peuvent numériser les pages une par une. Pour utiliser cet outil, visitez la page d'évaluation de l'accessibilité WAVE, entrez l'URL de la page que vous souhaitez analyser, et WAVE vous fournira une liste de toutes les erreurs d'accessibilité trouvées sur la page. WAVE fournit également des détails sur les erreurs et comment vous pouvez les corriger.

Si vous souhaitez analyser plus d'une page à la fois, WAVE dispose d'une API à laquelle les développeurs peuvent se connecter pour effectuer une analyse en masse de plusieurs pages Web ou de sites Web entiers. Les crédits API commencent à 0,025 $ chacun. Selon la quantité d'informations que vous souhaitez recevoir sur la page, chaque analyse peut utiliser 1 à 4 crédits. Si vous développez un site Web avec un budget important pour la surveillance continue de l'accessibilité du site Web ou si vous êtes d'accord pour effectuer des analyses ponctuelles d'une seule page, WAVE peut être une bonne option pour vos besoins.

hache

ax est un outil d'analyse d'accessibilité de Deque. ax propose une extension gratuite de Google Chrome, ainsi que trois options payantes pour l'analyse d'accessibilité: ax DevTools, ax Auditor et ax Monitor. DevTools aide les développeurs Web à atteindre l'accessibilité grâce à des tests guidés. L'auditeur effectue des audits WCAG automatisés sur le contenu Web et les applications. Monitor scanne les sites Web et signale les erreurs d'accessibilité.

ax est un excellent outil pour les développeurs Web et les créateurs de contenu qui ont besoin de rapports d'accessibilité séparés. L'extension gratuite ax Chrome est disponible en téléchargement instantané et, comme WAVE, est un excellent outil pour la numérisation déclenchée manuellement sur une seule page.

Vérificateur d'accessibilité

Accessibility Checker est un plugin WordPress d'analyse d'accessibilité automatisée d'Equalize Digital. Offert en versions gratuite et professionnelle, Accessibility Checker peut analyser en masse les pages et les publications pour détecter les erreurs d'accessibilité et fournit des rapports directement dans l'éditeur WordPress. Le plugin analyse le contenu Web pour la conformité WCAG 2.1 et aide les développeurs et les gestionnaires de contenu à tester les sites Web pour les problèmes d'accessibilité sur une base continue.

Le vérificateur d'accessibilité peut être utilisé par les utilisateurs de WordPress de tous les niveaux de compétence, que vous en ayez besoin pour un site ou plusieurs. Le plugin gratuit Accessibility Checker peut être téléchargé sur WordPress.org, et le plugin Accessibility Checker Pro peut être acheté auprès d'Equalize Digital. Avec le vérificateur d'accessibilité, il n'y a pas de limite au nombre de pages numérisées (ou aux frais d'API associés), et les rapports sont visibles directement sur l'écran de publication.

Cela permet aux gestionnaires de contenu – qui sont peut-être moins familiarisés avec l'accessibilité – de voir si le contenu qu'ils ajoutent ou modifient est accessible une fois que vous leur avez remis le site Web.

La version Pro d'Accessibility Checker comprend des listes centralisées de problèmes en suspens et des analyses groupées selon un calendrier, ce qui permet de gagner du temps sur l'exécution d'analyses d'une seule page une par une.

Comment utiliser une analyse AI pour rendre votre site Web accessible

Une fois que vous avez sélectionné votre outil de test d'accessibilité automatisé, tester votre site Web est aussi simple que de déclencher une analyse et d'examiner les rapports. Avec le vérificateur d'accessibilité, par exemple, vous pouvez voir une liste de toutes les erreurs ou avertissements identifiés dans une analyse sur l'écran d'édition de cette page ou de cette publication en particulier.

Quel que soit l'outil que vous avez utilisé pour analyser, vous devrez examiner chaque erreur ou avertissement, déterminer s'ils ont été correctement signalés et élaborer un plan d'action pour résoudre le problème. Si vous n'êtes pas sûr qu'un problème signalé soit réellement un problème d'accessibilité, le test manuel de la page peut vous aider à déterminer l'ampleur du problème.

Qu'est-ce que le test d'accessibilité manuel?

Le test d'accessibilité manuel est lorsqu'une personne examine une page Web (plutôt qu'un scanner IA) et détermine s'il existe des problèmes d'accessibilité. Voici quelques exemples de tests manuels:

  • Vérification des médias intégrés, tels que les fichiers vidéo et audio, pour les sous-titres et les transcriptions.
  • Utiliser uniquement un clavier pour naviguer sur le site Web.
  • Analyse du contenu du site Web avec un lecteur d'écran.
  • Examiner le site Web sur différents appareils et avec différentes résolutions.

Il est important de noter que l'accessibilité manuelle est différente des tests utilisateur. Le test utilisateur implique l'embauche de personnes handicapées pour tester l'accessibilité d'un site Web et fournir des commentaires.

Les tests d'accessibilité manuels sont un élément essentiel de l'identification des erreurs d'accessibilité, car 30 à 40% seulement des problèmes d'accessibilité peuvent être identifiés par un outil de test automatisé.

Comment effectuer des tests d'accessibilité manuels

La façon dont vous testez manuellement l'accessibilité de votre site Web dépendra du fait que votre site Web est déjà en ligne ou non.

Pour les sites Web en direct, il est préférable de tester les pages de votre site Web dans cet ordre:

  1. Testez la page de votre site Web qui reçoit le plus de trafic. Vous pouvez utiliser le logiciel de suivi que vous préférez pour trouver ces informations, mais Google Analytics est couramment utilisé.
  2. Testez toutes les pages sur lesquelles une conversion est attendue. Les exemples incluent les pages de panier, les pages avec des formulaires Web, les pages de contact et les pages de destination de publicité.
  3. Testez votre page d'accueil.
  4. Testez une page représentative de chaque type de publication. Les types de publication peuvent inclure un blog, une page de biographie des employés, des pages de calendrier d'événements, etc. Vous devez également tester la page d'archive pour chacun de ces types de publication.
  5. Testez le reste des pages et des publications sur votre site Web, dans l'ordre des pages avec le plus de trafic vers les pages avec le moins de trafic. Continuez jusqu'à ce que vous ayez examiné manuellement chaque URL publique de votre site Web.

Si votre site Web n'est pas encore en ligne, vous pouvez tester manuellement votre contenu en commençant par la page d'accueil, puis en parcourant le reste du site Web dans l'ordre qui vous convient le mieux.

Tester la navigation au clavier

La meilleure façon de démarrer les tests d'accessibilité manuels consiste à effectuer un test de navigation au clavier.

Certaines personnes qui visitent votre site Web devront utiliser leur clavier pour y naviguer au lieu d'une souris. Cela peut inclure des utilisateurs aveugles ou malvoyants ou des utilisateurs souffrant de blessures ou de déficiences motrices.

Pour tester au clavier votre site Web, chargez la page que vous souhaitez tester en premier. Utilisez l'onglet et les touches fléchées pour parcourir les pages de votre site Web et interagir avec les fonctionnalités de chacune. Votre objectif est d'accomplir tout ce que vous pouvez avec une souris en utilisant uniquement votre clavier.

Lors du test du clavier de votre site Web, tenez compte des éléments suivants:

  • Pouvez-vous voir où se trouve l'état du focus et où vous vous trouvez sur une page à tout moment?
  • Les états de focus des boutons et des liens ont-ils suffisamment de contraste avec l'arrière-plan?
  • Pouvez-vous accéder à différentes pages en utilisant uniquement votre clavier?
  • Votre page Web comporte-t-elle un lien qui vous permet d’accéder au contenu principal de la page?
  • Pouvez-vous interagir avec des fonctionnalités de page spéciales, telles que des curseurs d'image, des cartes ou des vidéos?
  • Êtes-vous en mesure de soumettre des formulaires Web et d'effectuer des achats de produits?

Test avec des lecteurs d'écran

Après avoir testé votre site Web pour la navigation au clavier, vous pouvez commencer à le tester avec des lecteurs d'écran.

Un lecteur d'écran est un type de technologie d'assistance que les personnes aveugles et malvoyantes utilisent souvent pour naviguer sur un site Web et lire du contenu Web. Si vous possédez un Mac, vous pouvez tester votre site Web à l'aide de VoiceOver, un logiciel de lecture d'écran intégré à votre ordinateur. Si vous n'avez pas de Mac, vous pouvez télécharger NVDA, un lecteur d'écran gratuit et open source. Vous pouvez également envisager de tester avec JAWS, un lecteur d'écran payant très populaire auprès des utilisateurs aveugles et malvoyants.

Vous pouvez tester votre site Web avec un seul de ces lecteurs d'écran, mais le test avec deux ou plus offrira de meilleurs résultats car tous les lecteurs d'écran ne lisent pas la même chose lorsqu'ils rencontrent des éléments.

Pour tester votre site Web avec un lecteur d'écran, installez le logiciel de lecture d'écran sur votre ordinateur, allumez-le et chargez la page que vous souhaitez tester. Parcourez la page comme vous l'avez fait lors du test manuel du clavier, à l'aide de l'onglet et des touches fléchées. Écoutez ce que dit le lecteur d'écran et notez tout ce qui semble déroutant ou incorrect, comme:

  • Un lien qui ne décrit pas sa finalité. Par exemple, vous pouvez entendre "lien cliquable" ou "en savoir plus". Les liens doivent expliquer ce qu'ils sont censés faire ou où ils emmènent un utilisateur.
  • Éléments automatiques. Si vous avez des vidéos ou des curseurs qui se lisent automatiquement, ils peuvent perturber les lecteurs d'écran et dérouter l'utilisateur.
  • Éléments de page complexes. Si votre page comporte des éléments complexes, tels que du contenu à onglets ou des accordéons, vous devez vous assurer que l'état du focus se déplace vers le contenu à l'intérieur de l'accordéon. Si ce n'est pas le cas, les utilisateurs de lecteurs d'écran ne pourront pas trouver et lire le contenu.

Vérifier les médias intégrés

Divers éléments multimédias doivent être testés manuellement, y compris les vidéos YouTube, les curseurs d'image et de texte, les documents intégrés et les widgets ou iFrames tiers. Chacun de ces intégrations doit être accessible.

Pour tester l'accessibilité des médias intégrés, vous devrez visiter le front-end de votre site Web et observer visuellement son apparence. Passez en revue la transition et la synchronisation des curseurs et des vidéos. Assurez-vous que les vidéos comportent des sous-titres codés ou des transcriptions distinctes. Testez chacune des intégrations pour le lecteur d'écran et la navigation au clavier.

Comment résoudre les problèmes d'accessibilité identifiés?

Une fois que vous avez terminé vos analyses automatisées et vos tests manuels, vous devrez résoudre tous les problèmes identifiés afin de vous assurer que le site Web est accessible et conforme aux lois applicables.

Étant donné qu'il existe de nombreuses pièces mobiles dans les sites WordPress, différents problèmes d'accessibilité peuvent nécessiter des solutions différentes. Dans WordPress, atteindre l'accessibilité peut impliquer de modifier le code du thème, de saisir à nouveau le contenu dans l'éditeur ou de changer la façon dont la conception d'une page est plus accessible.

Si le problème existe dans un plugin tiers, vous pourrez peut-être contacter le développeur du plugin pour lui demander de faire le changement. S'ils ne sont pas disposés à effectuer le changement, vous pouvez coder un patch dans votre thème ou un plugin, ou vous devrez peut-être remplacer ce plugin par un autre plugin.

Pour certains problèmes d'accessibilité, il peut être judicieux de faire appel à une entreprise de restauration de l'accessibilité pour résoudre certains des problèmes les plus difficiles.