Formation : Développez des interfaces web accessibles

Objectifs pédagogiques

• Analyser l’impact direct des choix d’implémentation technique sur l’expérience utilisateur des personnes en situation de handicap.
• Architecturer des pages web et des interfaces complexes en garantissant la conformité RGAA.
• Développer des composants d’interface robustes en maîtrisant les patterns accessibles.
• Évaluer l’accessibilité d’un service numérique via une méthodologie de test mixant outils d’audit, inspection de l’arbre d’accessibilité et technologies d’assistance.
• Arbitrer et mettre en œuvre des solutions de remédiation technique face à des défauts d’accessibilité sur du code existant.

Ce que vous apprendrez

Accessibilité numérique

Appréhendez les fondamentaux de l’inclusion en reliant les types de handicaps aux technologies d’assistance et aux modes d’usages réels.

Vous découvrirez les cadres de référence WCAG et RGAA pour établir une méthodologie de test rigoureuse durant vos phases de développement.

Sémantique HTML

Redécouvrez la puissance du HTML natif et l’importance de la sémantique pour l’interopérabilité. Vous apprendrez à choisir la balise juste pour garantir une accessibilité robuste sans surcharge de code inutile.

Structuration de la page et de l’information

Apprenez à construire une architecture de page robuste et logique en utilisant les régions (landmarks) et une hiérarchie de titres cohérente.

Vous saurez structurer et organiser l’information (listes, tableaux, liens) pour guider et faciliter la consultation du contenu.

Images

Maîtrisez la gestion des alternatives textuelles selon le contexte (informatif, décoratif ou complexe). Vous comprendrez les mécanismes de restitution des lecteurs d’écran pour transmettre l’information visuelle de manière pertinente.

Présentation de l’information

Utilisez le CSS pour renforcer l’accessibilité sans créer de barrières visuelles ou cognitives. Gérez les contrastes, la typographie, les techniques de masquage accessible et l’adaptation aux préférences utilisateurs via les media queries.

Navigation

Facilitez l’accès à l’information en fournissant des moyens de navigation intuitifs et constants.

Garantissez une expérience totale au clavier en gérant l’ordre de tabulation, la visibilité du focus, les pièges au clavier et les mécaniques alternatives à la souris.

Formulaires

Concevez des formulaires compréhensibles et utilisables en utilisant les bonnes techniques. Guidez vos utilisateurs et permettez leur d’anticiper les erreurs ou de les corriger facilement.

ARIA

Plongez dans les coulisses du navigateur en manipulant l’arbre d’accessibilité via les rôles et attributs ARIA. Vous apprendrez à utiliser ARIA uniquement lorsque le HTML natif atteint ses limites, tout en respectant les standards du W3C.

Javascript

Rendez vos interfaces interactives accessibles en garantissant la compatibilité avec les technologies d’assistance. Vous maîtriserez le développement de patterns accessibles (modales, onglets, accordéons, …) et l’annonce des mises à jour via les régions dynamiques.

Méthode pédagogique

Notre approche privilégie une immersion technique où la pratique occupe deux tiers du temps de formation, notamment à travers un exercice “fil rouge” de réparation d’une application complexe.

Vous apprendrez à utiliser les outils d’évaluation adaptés pour réaliser des tests d’accessibilité en autonomie, allant de l’inspection de l’arbre d’accessibilité à l’usage des lecteurs d’écran.

Pour garantir la pérennité de vos acquis, nous mettons à votre disposition un corpus de fiches techniques et de ressources documentaires directement exploitables dans vos projets quotidiens.

Public concerné

• Développeurs Front-End
• Intégrateurs Web
• Testeurs / QA avec bases technique
• Architectes / Experts techniques
• Toute personne créant du code HTML / CSS / JS

Modalités

• Présentiel (locaux Frontguys Paris 9e).
• 8 stagiaires maximum.
• Repas du midi inclus sur place.

Prérequis

Il est recommandé d’avoir suivi une formation de sensibilisation aux enjeux de l’accessibilité numérique.

• Bonne connaissance de HTML / CSS / JS
• Savoir utiliser l’inspecteur de code
• Avoir un ordinateur portable (Mac ou PC)
• Avoir des droits suffisants pour installer des applications et des extensions navigateur sur sa machine
• Avoir un casque audio