Nous arrivons presque au terme de ce cours sur l’accessibilité. :) Nous allons à présent faire le bilan de ce que nous avons abordé, et profiter de ce chapitre pour aller un peu plus loin, et notamment :
côté libraires et validateurs de code ;
côté JavaScript et intégration de l’accessibilité dans certains frameworks JavaScript.
Réalisez le bilan de ce cours
Ce cours vous a permis d’acquérir les bases de l’accessibilité dans le développement web. Vous pouvez dès à présent mettre en pratique tous ces conseils dans vos projets de développement !
Comme vous avez pu le constater, intégrer l’accessibilité dans le cadre du développement d’un projet web est tout à fait faisable et ne demande pas beaucoup de travail en plus.
Cela dit, plus la démarche d’accessibilité est mise en place en amont, mieux elle sera intégrée. En effet, sur un projet existant, cela peut vous demander un peu plus de temps pour rendre votre site accessible.
Découvrez des outils dédiés à l’accessibilité
Dans cette section, je vous propose de découvrir deux types d’outils qui vous faciliteront la vie en tant que développeur pour l'accessibilité :
les outils assez classiques type validateurs (comme ceux que vous avez peut-être déjà utilisés pour le HTML ou le CSS), ainsi qu’une checklist ;
les outils plus modernes, à savoir des librairies que vous allez pouvoir faire tourner sur votre machine ainsi que sur une CI (pour Continous Integration).
Découvrez les validateurs et les checklists
Lorsqu’on travaille sur un site statique, autrement dit sans base de données, gestion de comptes utilisateurs ou interactions poussées, nous n’avons pas forcément besoin d’avoir une architecture de travail complexe.
Dans ce type de cas, le validateur AChecker ci-dessous sera un bon outil.
Le validateur “AChecker”
Très proche des validateurs CSS et HTML que vous pouvez utiliser lorsque vous commencez à développer, AChecker vous permet de vérifier que votre code HTML respecte les conventions et n’a pas d’erreurs.
Si par exemple je teste le code de mon carrousel codé au chapitre P2C3, le validateur me dit que tout va bien !
La checklist
Comme vous l’avez peut-être vu dans le cours “Concevez un contenu web accessible”, vous pouvez aussi utiliser une checklist pour vérifier que votre site est conforme.
Outre la liste du cours précédent, voici un autre exemple de checklist, celle du projet A11YProject. Suivre cette checklist est un bon moyen de vérifier que vous n'avez rien oublié dans l'accessibilité du site.
Utilisez des librairies et l’intégration continue
Lorsque que votre projet grandit ou qu’il est plus complexe, l’idéal va être de passer par des librairies qui feront le travail à votre place.
L’organisation Pa11y met à votre disposition de nombreux outils que vous allez pouvoir utiliser tant sur votre machine que dans le cadre d’une intégration continue.
Cette méthode permet, entre autres, de tester votre code de façon automatisée sur des serveurs, et de faciliter les déploiements.
Utilisez le JavaScript de manière accessible
Pendant longtemps, le JavaScript nous a servi avant tout à animer des pages web (ce que le CSS ne nous permettait pas de faire). Il ne nous servait pas, par exemple, à récupérer des données depuis un serveur (les fameuses requêtes AJAX). C’est à cette époque que sont arrivés les concepts de JavaScript non obstrusif, de dégradation gracieuse et d’amélioration progressive.
Le JavaScript non obstrusif
Ce concept de programmation est une approche visant à limiter le rôle du JavaScript dans les pages. Autrement dit, un utilisateur ayant désactivé le JavaScript de son navigateur ne devrait pas avoir une utilisation dégradée du service.
Cela dit, ce concept est de moins en moins applicable. En effet, l’utilisation du JavaScript a largement augmenté depuis 2005 et aujourd’hui, tous les sites web ou presque ont besoin du JavaScript pour fonctionner.
De plus, la compatibilité du JavaScript a été grandement améliorée et uniformisée sur les navigateurs. Cela rend désormais l’utilisation de ce langage de programmation moins problématique côté front.
La dégradation gracieuse et l’amélioration progressive
Ces deux concepts vont souvent de pair. Les deux décrivant des stratégies et méthodes pour rendre un site utilisable par le plus grand nombre.
Il m’est impossible de terminer ce cours sans vous parler d’un livre dédié à l’amélioration progressive : Adaptive Web Design de Aaron Gustafson.
Cet ouvrage commence à dater un peu, on n’y parle pas de frameworks comme React ou Angular, mais il constitue un bon complément à ce cours.
En résumé
Pensez à valider votre site avec des validateurs ainsi que des outils intégrés à l’infrastructure de votre projet.
Vous pouvez aussi réaliser une checklist avec votre chef de projet/designer, pour cadrer l’accessibilité de votre site.
Les concepts d’amélioration progressive et de dégradation gracieuse sont des philosophies de développement front-end.
Et voilà, c'est la fin de ce cours. J'espère qu'il vous sera utile pour rendre le code de vos sites accessible, et vous accompagner dans vos développements. Je me suis efforcé d'y mettre toutes les recommandations et outils que j'ai pu. Je vous souhaite bon courage dans vos projet, et à bientôt ! :)
