Analysez l’accessibilité de votre site web

Le 20 février 2011 par Maxime dans Conception web.

La plupart des concepteurs web sont sensibles à l’accessibilité des sites web qu’ils construisent. Avant même de rendre son site facile d’utilisation, c’est quand même pas con de voir si on peut accéder au contenu facilement. Voyons donc quelques outils en ligne pour améliorer tout cela. Ça serait bête d’avoir créé un si merveilleux contenu mais qu’il ne soit pas accessible du plus grand nombre n’est-ce pas ?

Hein, accessibilité ? M’en fous moi !
Web Accessibility Initiative
Les outils disponibles pour nous aider

Hein, accessibilité ? M’en fous moi !

Le mot à la mode, c’est l’usabilité. Ouais cool, on va faire une ergonomie, avec un design approprié, et optimiser l’usabilité. Beaucoup de mots, mais la plupart du temps pas beaucoup de sens pour monsieur le client. En fait dans le web, on entend par l’usabilité la facilité que l’on a à utiliser le site ou l’application. Il est évident qu’il faut s’en préoccuper grandement, l’internaute fuira s’il ne comprend pas facilement et rapidement.

contenu inaccessible Mais ce qu’on oublie souvent, c’est qu’il faut déjà que l’utilisateur arrive au contenu. S’il est handicapé ou mal voyant par exemple, avec un navigateur qui n’affichera pas certaines choses (css, images) ou désactivera les objets dynamiques (flash, javascript). Comment va rendre notre site une fois toutes ses couches supprimées ?

Et ces derniers temps, il faut évidemment penser au mobile : le site dispose-t-il d’une version optimisée pour les smartphones ? pour le wap ?
Y a-t-il une application dédiée ? Le risque d’un contenu inaccessible : laisser votre utilisateur sur le quai.

Enfin, bien souvent l’accessibilité des contenus sont bénéfiques pour le référencement. Pour l’indexation d’une part, si on fait attention à ce que chaque contenu soit accessible sans flash ou javascript, il sera également accessible aux moteurs de recherches. Pour l’optimisation des mots-clés d’autre part, en remplissant les balises alt des images par exemple, ou en spécifiant des ancres de liens informatives même quand une image est mise derrière en css.

Web Accessibility Initiative

Accessibilité, OK, mais de quoi parlons-nous exactement ? Avant de voir comment améliorer l’accès à notre contenu, il faut déjà voir comment on a organisé, dans le monde du web, les bonnes pratiques d’accessibilité. C’est même maintenant devenu des standards, propulsé par la WAI.

L’initiative sur l’accessibilité du web a été lancé par le W3C pour promouvoir les solutions techniques destinées à améliorer l’accès au web pour les personnes handicapées et via les navigateurs diminuées (mobile, sans images, sans javascript, etc).

Le WAI a donc rédigé des conseils pratiques qui peuvent aider les concepteurs web à rendre les sites internet plus accessibles, et ce qui nous intéresse en particulier, c’est le WCAG, les règles pour accessibilité des contenus web. Avant de se jeter sur les outils d’accessibilité que l’on peut trouver sur le web, il est intéressant de lire ou relire le WCAG 2.0 sur le site du W3C, pour bien comprendre les techniques et mécanismes qui rendront votre contenu accessible au plus grand nombre.

Les outils disponibles pour nous aider

Convaincu de prendre soin de l’accessibilité de son site ? Ok, cool. Ah oui mais je n’ai pas fini mon boulot, car vous vous demandez maintenant comment. Voici donc un début de réponse avec quelques points à prendre en compte et les outils pour les évaluer pour l’améliorer. Vous devriez ensuite continuer votre quête en inspectant les caractéristiques propres à votre site web, comme votre menu de navigation, la présentation de l’information dans vos pages. Par exemple sur ce blog, nous nous sommes posés la question de l’accès au contenu dans un article trop long. C’est pourquoi vous trouverez au début de la plupart de nos articles un petit sommaire avec des liens vers les sections principales

Le handicap visuel : on a pas tous la chance d’avoir un daltonien (et fier de l’être) au sein de notre équipe de développement. Le meilleur moyen de voir si notre site est bien accessible, c’est de simuler la vision d’un daltonien et d’inspecter si certains liens ne paraissent pas invisibles par exemple, et s’ils sont tout de même accessibles, est-ce qu’on ne pourrait tout de même pas appliquer un contraste plus efficace ? Loïc en a justement parlé dans son article, en fournissant une liste d’outils pour simuler une vision de daltonien.
Analysez l’accessibilité de vos images avec Juicy Studios Image Analyzer.
Avec cet outil, vous pouvez examiner les images de votre site web et vérifier si vous avez scrupuleusement (ou non) rempli les balises alternatives alt et longdesc (cette dernière peut cela dit être oubliée), ainsi que width et height. L’accessibilité de votre page dépend beaucoup de la facilité qu’ont vos utilisateurs d’interagir avec les images, il est important de s’en préoccuper ; Juicy Studio Image Analyzer est un bon outil pour vous aider là-dessus.
Evaluez l’accessibilité de la page en cours avec l’extension pour Firefox Accessibility Evaluation Toolbar.
Cette extension vous permet d’inspecter tous les éléments de design sur votre site. Vous pouvez rapidement lister les images et éléments et checker le respect avec les standards d’accessibilité. Il y a aussi des outils intégrés comme la validation html du w3c directement dans la toolbar.
Testez et améliorez la lisibilité de vos textes, autre critère important d’accessibilité, à l’aide d’outils d’analyse sémantique tel que celui d’online-utility.org : Readability, test and improve.
Cet outil va scruter vos textes, la longueur des mots, le nombre de syllabes, la fréquence de ponctuation, etc. L’outil générera alors des résultats sous formes de statistiques, mais aussi de « notes » en fonction du niveau d’éducation requis pour lire le texte soumis. Évidemment, il s’agit de résultats d’algorithmes, qui ont en plus été développés pour des textes en anglais, mais cet outil peut tout de même vous fournir un aperçu de la qualité de votre contenu. Pour plus de concret, l’outil affiche les phrases qui lui semble les plus difficiles. A vous de voir ensuite s’il est judicieux de reformuler, aérer ou scinder les extraits retournés.
Décortiquez votre code html avec Wave, un outil interactif pour afficher par dessus votre page web des indications sur vos éléments et balises html, et repérer les quelques oublis ou erreurs à résoudre. Vous serez notifié avec un petit encart à côté de chacun de vos éléments, pour vous indiquer si oui ou non vous respectez les standards d’usabilité, avec un commentaire pour résoudre le problème si problème il y a. Soyons clair, ça pète votre design et c’est parfois dur de s’y retrouver, mais cela s’avère dans l’ensemble assez agréable à utiliser.

N’hésitez pas à partager d’autres ressources utiles en commentaires !

Flux RSS de design, referencement, actus internet - Bewype

Recevez les articles tout chauds sortis du four !
Inscrivez-vous à notre flux RSS

Jeter un oeil sur les autres articles : design graphique, actu web et marketing seo

Jeter un oeil sur les autres articles : accessibilité, daltonisme, usabilité

Usabilité : une autre vision sur vos designs

12 conseils d’usabilité pour les pages d’accueil de sites web

Vos commentaires sur Analysez l’accessibilité de votre site web

(4)

Sébastien Delorme

20 février 2011 à 22 h 39 min

Puisqu’il ne faut pas hésiter à partager, j’avais commencé une liste d’outils que j’utilise très souvent par ici :
http://www.tentatives-accessibles.eu/161-outils-evaluation-amelioration-accessibilite-site-web

La Web Developer Toolbar pour Firefox et Firebug, même s’il ne s’agit pas d’outils dédiés à l’accessibilité sont également incontournables

truffo, développeur web

22 février 2011 à 9 h 50 min

J’utilise pas mal Headings Map https://addons.mozilla.org/en-us/firefox/addon/headingsmap/

Utilisateur inconditionnel de Google Chrome, la console et le js est souvent le meilleur moyen pour extraire des infos du DOM mais cela requiert un profil plus techniques.

Johanna, Agence naming

21 mars 2011 à 20 h 16 min

Merci pour ces outils, il est important de rendre le web accessible à tous !

Victor Brito

11 avril 2011 à 11 h 15 min

Un outil en ligne permettant, entre autres, d’analyser l’accessibilité d’un site Web, voire d’un parc de sites Web : Opquast Reporting (http://reporting.opquast.com).

Désolé, les commentaires sont fermés pour le moment.