Convaincus de rendre votre site web accessible ? Ça s’en est une de bonne nouvelle !
Champagne !!! Maintenant que vous avez tout compris sur l’accessibilité web et ses principes de base, nous allons davantage vous aider à suivre le bon filon en vous donnant une panoplie de conseils pour l’appliquer facilement.
Mais qu’est-ce qu’il y a Pascal ? Pourquoi tu t’agaces ? Quoi tu ne sais pas de quoi on parle ? Tu ne sais pas ce qu’est l’accessibilité ? Et bien, qu’à cela ne tienne Pascal, il fallait être présent pour la première leçon, tant pis tu t’en vas.
Roh prend pas la mouche, on rigole ça va ! Pour tous les Pascal parmi nos lectrices et lecteurs, une piqûre de rappel s'impose.
Pour faire simple, un site web accessible est une plateforme conçue pour être utilisable et compréhensible par tous, y compris les personnes ayant des limitations d’accès ou étant en situation de handicap. L'objectif est de garantir une expérience en ligne inclusive pour tout le monde en prenant en compte des facteurs tels que la vision, l'audition, la mobilité et l'utilisation d'assistants technologiques.
Afin que votre site soit reconnu comme accessible, il doit répondre à 4 principes déterminés par le référentiel WCAG (Web Content Accessibility Guidelines).
Ce référentiel a été rédigé par le World Wide Web Consortium, une organisation œuvrant pour le développement de normes dans le web.
Votre site doit être perceptible indépendamment de la capacité à voir de vos utilisateurs.
Il doit être utilisable facilement et intuitivement.
Il faut que les instructions demandées sur votre site soient claires et logiques.
Le site doit pouvoir être accessible quels que soient l’outil ou la technologie utilisés.
C’est bien beau tout ça mais quand est-il de la pratique. Comment va t’on s’y prendre pour pouvoir respecter ces principes ? Les WCAG nous donnent les bonnes pratiques et on va décrypter ça ensemble.
L’idéal est de penser à l’accessibilité de son site avant même sa conception, il est plus simple de le créer en connaissance de cause que d’apporter des corrections après sa réalisation. Dans ce cas, il existe des systèmes de gestion de contenus (CMS) développés pour une gestion simple de l'accessibilité. WordPress ou encore Craft CMS sont des outils qui font très bien le boulot.
Les images de votre site peuvent ne pas être visibles par vos utilisateurs et sur certains supports. Pour pallier ce manque d'accessibilité, il est nécessaire d'intégrer un texte alternatif et descriptif au sein du code HTML afin que les lecteurs d’écran puissent le consulter.
C’est également le cas pour les vidéos ou les supports audio, vous pouvez les rendre lisibles grâce à des sous-titrages, des retranscriptions ou audiodescriptions. En prime, sachez que des alternatives textuelles contribuent à un meilleur référencement naturel et toc!
Pensez aussi à tout élément qui suscite l’action de vos utilisateurs comme les formulaires, les liens, les boutons, etc, ils ne sont d’aucune utilité si on ne peut pas les lire. Vos pages sont comme un parcours semé d’embûches, et les descriptions alternatives vont permettre à tout utilisateur de s’emparer de ces différents éléments.
Les couleurs de votre site influent sur sa lisibilité. Privilégier alors des couleurs contrastantes entre les textes et l’arrière-plan va de soi pour assurer une lecture confortable à vos utilisateurs. Avoir un site hyper design c’est cool mais il deviendra totalement obsolète si on ne peut pas exploiter son contenu. Le classico c’est texte foncé sur fond clair, on ne vous apprend rien mais ce n’est pas anodin si on le retrouve partout.
Pour le choix de la typographie ça tombe sous le sens. Optez pour des polices conventionnelles et familières des utilisateurs. Entre les polices sérif (avec empattements) plus traditionnelles et les sans sérif plus modernes, le choix est large pour trouver son bonheur. A noter que les typos sans empattement sont les plus optimales pour la lisibilité.
De manière générale, il n’est pas bon de créer un design qui empiète sur l’expérience de vos utilisateurs. La structure des pages, la disposition et la taille des éléments doivent être pensées afin de créer une interface confortable à parcourir.
Les différents niveaux de titres sur vos pages permettent de structurer vos contenus et offrent donc une meilleure compréhension tout en facilitant la navigation. Il est plus agréable de parcourir une page correctement hiérarchisée avec un plan clairement identifiable. Toute personne disposant d’un lecteur d’écran peut facilement passer de titre en titre pour identifier les différentes sections et de manière générale cela est plus agréable pour qui que se soit. Hiérarchiser ses titres c’est friendly pour son SEO (référencement naturel) et aussi pour ses utilisateurs.
Voici les petits conseils de base à appliquer pour vos titres :
La bonne vieille souris ou trackpad, dans sa version plus moderne, sont des outils qui peuvent être difficiles d’utilisation pour les personnes malvoyantes ou atteintes de troubles à la motricité par exemple. Pouvoir naviguer sur votre site avec les touches d’un clavier est une alternative non négligeable. Couplée avec une bonne hiérarchisation des titres et c’est banco ! Vos pages pourront être parcourues tout en fluidité.
Ces conseils sont une liste non exhaustive de ce qu'il est possible de faire pour améliorer l’accessibilité de votre site. La meilleure démarche reste encore de se former aux enjeux d’inclusion sur le web. Des outils et des formations sont disponibles afin de se sensibiliser et éviter les faux pas pendant la conception de son site web. Oui, Pascal toi aussi tu peux devenir incollable en matière d’accessibilité et ça c’est quand même stylé !
Il existe également des outils permettant d’évaluer l'accessibilité des sites déjà mis en ligne en fournissant des axes d’améliorations. Vous n’êtes pas obligés de partir d’une page blanche. Chaque effort isolé permet, mis l’un à la suite de l'autre, de construire de nouvelles normes.