L’accessibilité web, un nouvel enjeu digital

Pour ce nouveau #SooyoosTalks, Mari, lead developer, nous présente la problématique de l’accessibilité web.

20170727_183432

J’ai rencontré les problématiques d’accessibilité pour la première fois en travaillant sur mon projet de fin d’études, une application à destination d’un public aux capacités motrices et cognitives très variées. Ici je vais humblement tenter de montrer comment et pourquoi essayer de l’incorporer aux processus de création d’un site web.

accessibilite_sooyoos_1      accessibilite_sooyoos_3       accessibilite_sooyoos_2     accessibilite_sooyoos_4

 

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

C’est tout simplement faire en sorte qu’un site internet puisse être utilisé par chacun, quelles que soient ses capacités motrices et cognitives et le contexte dans lequel il accède au site.
Voici pour la définition générale, en pratique cela signifie, que si un utilisateur consulte un site avec un liseur d’écran, s’il navigue au clavier, si sa connexion possède un débit réduit etc.,  il doit pouvoir accéder aux mêmes informations.

Pourquoi s’intéresser à l’accessibilité ?

Outre la pure problématique humaniste (après tout, délivrer de l’information à tous est une des fondations du World Wide Web), il existe une multitude de raisons de se soucier d’accessibilité lorsque l’on développe un site.

Picture1   Une problématique légale

En France, la loi du 11 février 2005 (article 47) stipule que « Les services de communication publique en ligne des services de l’Etat, des collectivités territoriales et des établissements publics qui en dépendent doivent être accessibles aux personnes handicapées. ». En clair, si le client final est un service de l’état, le site se devra d’être accessible. De plus La loi du 7 octobre 2016 pour une République Numérique a depuis renforcé ces résolutions.

Picture3   Une problématique sociale 

 La seconde est la problématique de l’évolution de l’utilisateur lambda d’internet et de ce fait du visiteur type des sites que nous développons. D’après l’INSEE, en 2016, 25.1 % de la population française avait 60 ans ou plus. La population vieillit et utiliser internet ne se fait plus de la même façon et parfois avec plus de difficultés, en effet une étude Aeticom datant de 2014 sur « Les usages du web des 60 ans et + » révèle que 28% des retraités trouvent internet trop compliqué à utiliser.

Picture2 Une problématique financière

 La même étude Aeticom a évalué à 35% le nombre de ventes non réalisées à cause de la complexité des interfaces pour l’utilisateur. Ne pas être accessible à tous, c’est donc se priver de sources de revenus potentiels. En 2016 le Ministère des Affaires Sociales et de la Santé estimait à 2.5 millions le nombre de personnes handicapées en âge de travailler. Donc autant d’utilisateurs potentiels des sites avec des capacités différentes de celles pour lesquelles nous sommes habitués à développer.

Par où commencer ?

Améliorer le markup HTML
Par le commencement : un markup HTML de qualité peut faire des miracles en termes de sémantique et de lisibilité (et ça ne fait pas de mal au SEO d’ailleurs). L’exemple le plus frappant, c’est l’attribut alt de la balise image, trop souvent oublié. Il est également important de bien structurer sa page en utilisant les bonnes balises (HTML5 nous a offert la sémantique, profitons-en).

Picture4 Pour vérifier la structure d’une page, il existe un plugin Google Chrome intéressant : HTML5 Outliner qui permet entre autres de vérifier que les sections ont des titres et qu’il n’y a pas d’incohérences dans les niveaux de titre.

Picture5 Ensuite toujours sur Google Chrome, les Accessibility Developer Tools permettent pendant le développement de faire un mini audit de l’accessibilité d’une page.

Picture6 Une autre composante essentielle qui sert entre autres à l’accessibilité ce sont les recommandations WAI-ARIA qui permettent grâce à du markup additionnel qui permet par exemple de définir le rôle d’une section, ou d’indiquer qu’elle est susceptible de voir son contenu mis à jour sans rechargement (les live-region). ARIA est particulièrement utile sur des sites utilisant JavaScript pour le développement front ou tout simplement pour enrichir l’UX.

Rendre les contenus plus accessibles
Enfin, si le code doit être accessible, les contenus aussi. Une bonne pratique est par exemple de systématiquement mettre des sous-titres sur les vidéos (ou à défaut de fournir des transcriptions texte de leurs contenus).

Evidemment l’accessibilité n’est pas qu’une affaire de développeurs, sur le design d’un site par exemple, nous pouvons imaginer qu’il y ait plusieurs moyen d’identifier certaines données (une légende uniquement basée sur la couleur ne sera pas accessible aux personnes souffrant de daltonisme). Il faut aussi faire attention à certains contrastes, qui peuvent rendre le texte illisible (le Groupe Paciello fournit un outil pour analyser les contrastes).

Voilà pour ce tour d’horizon très rapide, je vous laisse avec le père du World Wide Web, Tim Berners-Lee et la citation de lui que je préfère:
«The power of the Web is in its universality.
Access by everyone regardless of disability is an essential aspect.
 »

Qui pourrait donc se traduire par :
«Le pouvoir du web est dans son universalité.
L’accès par chacun quel que soit son niveau de capacité en est un aspect essentiel.
 »

Pour en savoir plus :

Il existe de nombreuses ressources sur l’accessibilité :
EN https://www.paciellogroup.com/
EN http://webaim.org/
FR https://developer.mozilla.org/fr/docs/Accessibilit%C3%A9

Et pour ce qui est des personnes à suivre si le sujet vous intéresse :
EN https://twitter.com/LeonieWatson
EN https://twitter.com/stevefaulkner
FR https://twitter.com/Nico3333fr
FR https://twitter.com/ElieSl
FR https://twitter.com/goetsu
FR https://twitter.com/access42net