Vous avez déjà entendu parler d’accessibilité numérique ou de sites web accessibles… Mais concrètement,
Qu’est-ce que l’accessibilité web, et comment l’intégrer ?
Tout le monde s’accorde facilement sur le fait qu’il serait une bonne chose que le web soit accessible pour les handicapés. Mais lorsqu’il s’agit de concrétiser cette idée pour son propre site ou pour le site de son entreprise, on se heurte généralement à de nombreux préjugés bloquants : C’est trop cher, trop compliqué, le besoin est marginal, non prioritaire, ce n’est pas encore le moment, cela ne m’intéresse pas, nous ne sommes pas concernés par le RGAA, et ainsi de suite… Les arguments sont hélas nombreux.
Il est très probable que ces freins soient liés à des incompréhensions; et aussi à un certain flou sur ce que sont concrètement les techniques qui permettent de rendre un site web accessible.
De plus, il me semble que les enjeux sur la mise en place de l’accessibilité web ne sont pas toujours bien compris. Je reviendrai également sur ce point.
Je vous propose donc à travers une suite d’articles à paraître sur ce blog, une mise au point afin de démystifier ce sujet crucial qu’est l’accessibilité des sites web. Je vous proposerai également quelques idées à mettre en place pour accompagner les équipes sur ce chantier.
Voici déjà un premier article au cours duquel nous allons déconstruire quelques idées reçues…
Idées reçues sur l’accessibilité des sites web
L’intégration d’une page web accessible se fait uniquement avec du code html
Faux ! Ce n’est pas juste du code html « statique ». Il y a également une partie des problèmes qui doit être gérée avec du code css d’une part (pour les styles de couleurs et contrastes, taille du texte, etc.) et aussi une partie “dynamique”, avec du javascript (pour le changement dynamique d’états des attributs et classes de certains éléments).
Un code html bien structuré (avec une structure sémantique adaptée au contenu et des titres hx bien ordonnés) est une base essentielle pour mettre en place l’accessibilité web, mais cela ne suffit pas toujours.
On peut en conclure que certains éléments sont très simples à rendre accessibles et d’autres moins (comme les formulaires par exemple).
L’accessibilité web est une surcouche qui doit être traitée après le webdesign et l’intégration html / css
Faux ! La mise en place doit se faire dès la conception. On parle déjà de « mobile-first » (qui signifie que l’on pense en premier l’affichage sur petit écran avant l’affichage sur écrans plus grands, tablette ou écran de bureau) on pourrait également ajouter « accessi-first » : Ainsi on pense les applications avec un souci primordial d’accessibilité depuis la conception visuelle (lisibilité, contrastes, logique du processus pour le vocal, etc…) jusqu’à l’intégration et le développement (partir d’une bonne base de code avant de commencer).
Si on envisage l’accessibilité web comme une « surcouche » à mettre en place à posteriori, on risque vite d’être confronté à un problème de budget. En effet, les retours de correction risquent d’être très nombreux. Il faut bien comprendre que “rendre un site web accessible” signifie en gros “refondre en grande partie son site internet”.
L’accessibilité web sert uniquement aux aveugles
Faux ! Rendre son site accessible permet non seulement aux non-voyants d’écouter le contenu grâce à des logiciels de vocalisation, mais aussi aux malvoyants (qui ont du mal à lire, à divers degrés, ou encore aux daltoniens et dyslexiques) de pouvoir lire et interpréter plus facilement les informations. À cela s’ajoute également la possibilité pour les personnes qui ont du mal à utiliser la souris de pouvoir naviguer au clavier (gestion du “focus” visible, logique des parcours, etc), ou encore, pour les personnes qui ont du mal à comprendre (difficulté avec la langue, handicap mental) la facilitation de certaines actions.
Rappelons que le handicap peut toucher tout le monde; nous pouvons également nous trouver momentanément handicapé si par exemple, nous avons un bras dans le plâtre…
Quelle chance alors de vivre dans ce monde où tout est fait pour que nous puissions continuer normalement nos activités !
Ceci étant dit… Non, nous ne faisons pas cela pour M. Martin qui a un bras dans le plâtre, ni pour Simone qui trouve que c’est bien pratique de naviguer au clavier. Ce n’est pas que nous n’aimons pas M. Martin ou Simone, mais nous le faisons pour les personnes qui ont de “vraies” difficultés, et pour qui l’accessibilité est essentielle pour pouvoir être simplement autonome dans la vie de tous les jours.
L’accessibilité se traite point par point sur chaque élément
Pas toujours ! L’accessibilité ne concerne pas systématiquement un problème sur tel ou tel élément précis. C’est aussi un problème de fonctionnement au niveau de « l’organisme » d’une page.
Là encore, il faut rappeler qu’une bonne structure html est la base de l’accessibilité : Il faut que les pages soient structurées avec des titres h1, h2, h3, etc, dans l’ordre et sans rupture de continuité. Il faut également vous renseigner sur les éléments html5 à utiliser à bon escient (header, footer, main, aside, nav, etc…). Une bonne structure sémantique html de page permet de bien appréhender le contenu pour les lecteurs vocaux.
Il faut également vérifier en permanence la bonne gestion du focus (l’endroit où doit se trouver le pointeur, par exemple, a la suite d’une action, ou au rafraîchissement d’une partie de la page, lors d’une requête Ajax). Si vous ne vous préoccupez pas du focus, celui-ci va généralement se retrouver n’importe où dans la page, selon l’humeur de votre navigateur ! Le gestion du focus est un bel exemple de l’usage de Javascript pour l’accessibilité. C’est en effet avec javascript et sa fonction “element.focus()” que nous pourrons placer le pointeur de l’utilisateur au bon endroit.
Il faudra aussi gérer l’affichage des messages d’erreurs sur les champs d’un formulaire, et le bon positionnement du focus. Il y a beaucoup à dire sur les formulaires; je n’irai pas plus loin ici; mais n’hésitez pas à rechercher des informations au sujet des formulaires web accessibles.
L’accessibilité web est très chère à mettre en place
Plus ou moins faux. Plus exactement, c’est la courbe d’apprentissage des intervenants qui coûte cher. L’accessibilité doit être vue comme une autre façon de coder (ou de penser une application). Une fois que les réflexes sont acquis par les techniciens et les concepteurs, le coût ne devrait pas être beaucoup plus élevé qu’auparavant.
L’agence Polux, spécialisée dans l’UX et l’UI design, participe au programme de mise en place de l’accessibilité sur les applications web du groupe Arkéa.
Ne manquez pas notre prochain article à venir : “Comment mettre en place l’accessibilité de votre site web ?”