Qu’est-ce que l’accessibilité web ? 

L’accessibilité web consiste à optimiser une interface et à éliminer les obstacles de compréhension et de lisibilité qui peuvent gêner les personnes handicapés. Une interface dite “accessible” est donc une interface développée et optimisée pour qu’un maximum de personnes ait accès aux informations et aux contenus disponibles, de manière équitable.

Accessibilité

En quoi l’accessibilité est-elle importante pour l’UX et les conversions ? 

Dans un premier temps, sachez qu’en Amérique par exemple, environ 19% de la population avait un handicap, au sens large du terme. De plus, de nombreuses personnes ont des problèmes de vues, cognitifs et d’audition. 

De pas optimiser son interface pour ces gens-là reviendrait à perdre des conversions et donc de l’argent sur le long terme. 

Les raisons principales de travailler l’accessibilité web de son produit : 

  • Une image valorisée : vous êtes une bonne marque qui pense à tous ces utilisateurs, aux handicapées. Vous vous assurez que tout le monde puisse accéder à ce que vous proposer, sans exception.
  • Pas de conversions gâchées : l’expérience utilisateur de votre interface est adaptée aux personnes ayant des déficiences, vous ne rejetez donc personne dans votre tunnel de conversion.

Néanmoins, l'accessibilité ne concerne pas exclusivement les personnes handicapées. Le fait de développer une interface accessible représente aussi la compréhension de l’utilisateur dans sa globalité. D’autres choses peuvent être prises en compte, par exemple la connexion de l’utilisateur qui peut être lente, son écran qui peut être plus petit, etc.  

Les différentes déficiences à considérer

Le terme “handicap” est un terme large pouvant prendre en compte plusieurs déficiences, maladies et symptômes.

Handicape

Les 3 déficiences principales sont :

  • Visuel : le daltonisme, la cécité, etc. ce genre de problème visuel a un impact sur la manière dont une interface va être conçue. Les couleurs, les contrastes, les filtres devront être utilisés avec grand soin pour permettre à tous d’avoir accès comme il se doit à l’information donnée. 
  • Auditive : Les personnes malentendantes et qui souffrent de surdité doivent avoir accès au texte. Il est important ici donc de mentionner toutes les légendes, sous-titres, transcriptions pour les contenus audio. 
  • Cognitives : Les troubles d’apprentissage, les déficits au niveau de la mémoire, le niveau de compréhension sont également des choses à prendre en compte.

Critère d’accessibilité WCAG

Afin de rendre les sites web globalement plus accessibles aux personnes handicapées, la WCAG (Web Content Accessibility Guidelines) s’assure de donner des recommandations et des règles à respecter. 

On retrouve l’ensemble de ces règles ici : https://www.w3.org/WAI/WCAG21/quickref/?versions=2.0

Les 9 directives principales des WCAG sont : 

  • Directive 1.1 : Tout le contenu non textuel présenté à l'utilisateur a une alternative textuelle qui sert le but équivalent.
  • Directive 1.2 : Fournir des alternatives pour les médias temporels.
  • Directive 1.3 : Créer du contenu qui peut être présenté de différentes manières (par exemple une mise en page plus simple) sans perdre d'informations ou de structure.
  • Directive 1.4 : Faciliter la lecture et l'écoute du contenu pour les utilisateurs, notamment en séparant le premier plan de l'arrière-plan.
  • Directive 2.1 : Rendre toutes les fonctionnalités disponibles à partir d'un clavier.
  • Directive 2.2 : Accorder aux utilisateurs suffisamment de temps pour lire et utiliser le contenu.
  • Directive 2.3 : Ne pas concevoir le contenu d'une manière connue pour provoquer des crises.
  • Directive 2.4 : Fournir des moyens d'aider les utilisateurs à naviguer, à trouver du contenu et à déterminer où ils se trouvent.
  • Directive 3.1 : Rendre le contenu du texte lisible et compréhensible.

Pour chaque directive, vous trouverez des techniques, des recommandations et des moyens pour parvenir à optimiser l’accessibilité globale de votre interface. 

UX Writing et accessibilité

La rédaction, le copywriting et l’UX writing sont des éléments directement liés à l’accessibilité.

Gardez à l’esprit ces directives du W3C : 

  • Fournir des titres de page informatifs et clairs
  • Rendre le texte du lien significatif
  • Fournir des instructions claires et précises
  • Ecrire des alternatives textuelles aux images
  • Créer des légendes pour les contenus multimédias

Sur certains sites par exemple, les articles sont disponibles via un fichier audio. Ainsi, le contenu textes peut être écouté via un podcast par exemple.

Vocal Amazon Twaino
Vocal Linkedin

C’est donc idéal pour les personnes ayant des problèmes visuels et même pour les utilisateurs qui préfèrent écouter du contenu plutôt que de le lire.

Les questions à se poser pour tester l’accessibilité d’un produit web 

De nombreuses directives sont données par le W3C pour que vous puissiez avoir une accessibilité optimale sur votre produit web.

Voici les questions à vous poser pour respecter ces directives :

En-têtes et titres : 

  • Le titre décrit-il de manière précise et concise le contenu de la page ?
  • Le titre distingue-t-il la page des autres pages du site ?
  • Chaque image a-t-elle un texte alternatif approprié ?
  • Chaque page a-t-elle au moins un titre ?
  • L'en-tête est-elle marquée comme un titre ?
  • Le texte marqué comme en-tête est-il vraiment le début d'une section ?
  • La hiérarchie des titres et la hiérarchie des messages sont-elles significatives ?

Contrôle du clavier : 

  • Tous les boutons et formulaires sont-ils très visibles et utilisables ?
  • Le défilement horizontal est-il nécessaire pour lire des phrases ?
  • Pouvez-vous accéder à tous les éléments ?
  • Pouvez-vous vous éloigner de tous les éléments ?
  • Pouvez-vous dire quel élément est actuellement sélectionné lors de l'utilisation de l'onglet ?
  • Pouvez-vous utiliser le site sans l'aide d'une souris ? Toutes les fonctionnalités doivent être disponibles via le clavier.
  • Pouvez-vous accéder à une liste déroulante et utiliser les touches fléchées pour faire défiler la liste ?
  • Les liens d'image sont-ils évidents et peuvent-ils être activés avec «Entrée» ?

Formulaires et champs :

  • Tous les contrôles de formulaire sont-ils accessibles via le clavier ?
  • Les étiquettes de formulaire sont-elles correctement positionnées pour les lecteurs de gauche à droite ?
  • Les champs obligatoires sont-ils clairement indiqués sans se fier uniquement à la couleur ?
  • Les indicateurs d'exigence sont-ils inclus dans l'étiquette ou la légende du champ balisé ?
  • Les instructions relatives au formulaire figurent-elles en haut du formulaire ?
  • Les formats de date et de numéro de téléphone requis figurent-ils dans l'étiquette du champ balisé ?
  • Les erreurs de formulaire sont-elles faciles à remarquer ? Des conseils clairs et spécifiques sont-ils proposés ?
  • Les champs de formulaire sans erreur sont-ils toujours remplis correctement ?

Médias :

  • Les lecteurs multimédias peuvent-ils être contrôlés avec un clavier ?
  • La lecture automatique est-elle activée ? Si tel est le cas, il doit s'arrêter après 3 secondes, inclure des commandes pour mettre en pause ou s'arrêter, ou inclure des commandes pour baisser le volume.
  • Les sous-titres sont-ils synchronisés avec le contenu audio ?
  • Est-il clair qui parle à un moment donné ? Ont-ils été identifiés?
  • Les sons et le contexte importants sont-ils inclus dans les légendes (par exemple, un claquement de porte, un son de notification par e-mail) ?
  • Y a-t-il une transcription ?
  • La transcription est-elle facile à trouver ?
  • La transcription fournit-elle également des informations visuelles ?
  • L'audio décrit est-il disponible ?

Si vous respectez la majorité de ces règles, vous pouvez être sûr que votre taux de conversion sera nettement plus élevé, notamment concernant les personnes handicapées.