Aller au contenu
Enter

Accessibilité : les 7 réflexes à adopter pour votre site web

Par :
Marion
-
UX designer
-
Publié le :
4.8.21

Accessibilité : un constat décevant

Pour des raisons plus ou moins légitimes (négligence, mauvaise priorisation ou encore manque d’information), le constat est sans appel : l’accessibilité web est limitée. En effet, la majorité des contenus web ne sont pas accessibles pour tous.

Souvent mise de côté, l’accessibilité est pourtant primordiale et concerne une population non négligeable :

  • 1 personne sur 25 est aveugle ou malvoyante = 285 millions
  • 1 homme sur 12 est daltonien = 300 millions
  • 1 personne sur 10 est dyslexique = 700 millions

= 1, 285 milliard

C’est pas rien non ?!

Image qui montre une personne choquée

L'accessibilité oui mais à quel prix ?

Rendre un site accessible demande du temps et des ressources afin de répondre aux attentes des personnes en situation de handicap. De plus, offrir une expérience agréable de navigation n’est pas des plus facile, et ce, toutes cibles confondues.

Si vous avez un réel projet d’accessibilité, vous passerez par un audit et des personnes spécialisées pour avoir un site qui répond complètement aux exigences. C’est l’idéal mais les contraintes ne sont pas des moindres.  C’est-à-dire que vous devrez prévoir du temps, des ressources, et de l’argent.

En revanche, dans le cas où vous ne disposez que de peu de temps et de ressources, mais vous pensez qu’il est quand même important de prendre en compte ce sujet, cet article est pour vous. Vous y trouverez des solutions rapides à mettre en place afin de répondre à cet enjeu majeur. Au fur et à mesure, vous vous rendrez compte qu’au final, c’est un état d’esprit qu’il faut mettre en place. Cela vous permettra de créer des automatismes de réflexions sur les contenus futurs et d’inclure l’accessibilité au sein de chaque projet.

1. Ajouter du texte alternatif sur vos visuels

Les personnes malvoyantes/non voyantes utilisent des lecteurs d’écrans, combinés à une navigation par clavier (et non pad ou souris). Ce sont des outils qui retranscrivent le contenu d’une page web à l’oral.

C’est pour cela qu’il faut prévoir du texte pour tous les visuels que vous aurez sur votre site. Ils sont une partie importante d’un site, il faut donc que les personnes en situation de handicap puissent elles aussi se projeter dans votre univers. Même si elles ne peuvent visualiser les images, il faut les immerger dans votre monde.

Pour ce qui est des vidéos, il faut penser à mettre à disposition, a minima les sous-titres.

2. Ajuster les couleurs et les contrastes

Il y a différents types de handicaps pour lesquels les couleurs et les contrastes vont être importants (daltoniens, malvoyants, personne ayant une cataracte etc…).

Pour cela, différents outils sont disponibles afin de vérifier vos contrastes et savoir s’ils ont un bon équilibre.

Vous pouvez utiliser par exemple, dès vos maquettes, des plugins comme A11Y Color contrast Checker ou encore Stark, disponibles sur Figma.

Pour une analyse plus générique, il existe également Contrast Ratio, Check my colours, et même un builder pour créer des palettes de couleurs accessibles.

Sachant que le ratio contraste accessible est généralement de 4.5:1.

3. Utiliser une bonne structuration du texte avec les balises

Une bonne partie de cette population va naviguer dans le site uniquement avec son clavier. Afin d’avoir la lecture la plus juste de vos messages, il est donc indispensable d’avoir une hiérarchie des contenus cohérente. Ce qui signifie des zones de texte bien structurées et des balises justes, permettant aux utilisateurs de pouvoir détecter rapidement les titres des sous-titres et des paragraphes.

4. Prévoir la possibilité de naviguer au clavier

La navigation clavier est clé pour les personnes en situation de handicap. Elles utilisent beaucoup de raccourcis et c’est souvent leur unique outil de navigation. Il est donc indispensable de rendre les fonctionnalités accessibles à la navigation au clavier afin qu’elles puissent utiliser sereinement le site, sans se retrouver bloquées dans leur navigation.

5. Évitez l'ouverture de nouvelles fenêtres ou popup

Comme vous le savez, aujourd’hui il y a de nombreux sites où apparaissent des pop-ups ultra intrusifs. Déjà pour une personne qui n’est pas en situation de handicap, cela peut être énervant, alors imaginez pour les autres !

C’est perturbant pour la navigation, parfois le système de fermeture de la fenêtre n’est pas au point, ou les réponses attendues sur le pop-up pas bien définies, ce qui fait qu’à peine arrivés sur le site, on se retrouve déjà bloqués.

Idem pour l’ouverture d’une nouvelle fenêtre, si vous n’avez pas fait ce qu’il faut pour le signaler clairement, l’utilisateur ne va pas comprendre ce qu’il se passe.

À éviter au maximum.

Image qui montre des popups intrusives

6. Faire des tests avec la cible principale

On n’y pense pas au premier abord mais pourtant, il est plutôt facile de faire des tests avec une personne en situation de handicap.

Soit, vous avez dans votre environnement de travail des personnes dans cette situation que vous pouvez solliciter pour tester et ajuster l’accessibilité. Mais vous pouvez également vous tourner vers les associations les regroupant, elles seront ravies de participer et de vous aider.

Bonus : 7. Rendre les contenus adaptables

La cerise sur le gâteau c’est bien que l’utilisateur puisse choisir la lecture qu’il souhaite faire sur le site !

Cela veut dire, mettre à disposition une version audio du contenu, donner la possibilité de modifier la taille de la police etc…

Pour cela, différents outils sont disponibles comme NVDA , JAWS ou Voice Over. Pour la taille de la police, c’est possible via le navigateur ou le zoom écran. Pensez en revanche, lors de la réalisation, à utiliser des tailles relatives qui permettent un agrandissement du texte seul de 200%.

Ce qu'il faut retenir pour avoir un site plus accessible

En résumé, les personnes en situation de handicap utilisant internet représentent une part non négligeable de la population. Il paraît indispensable aujourd’hui de les prendre en compte comme une population à part entière.

Des solutions simples et efficaces peuvent être mises en place au fur et à mesure, il suffit d’y penser et cela deviendra un automatisme.

Vous pourrez constater des retombées positives concernant votre ratio effort/impact, mais surtout, cela vous permettra d’avoir un site plus inclusif et juste envers vos utilisateurs.

Si vous souhaitez aller plus loin dans l’accessibilité de votre site, vous pouvez consulter les WCAG (Web Content Accessibility Guidelines) qui sont une référence sur le sujet.

À lire aussi

Veille digitale, regard d’experts et retours d’expérience