Développer accessible avec le RGAA

Développeur ou intégrateur, vous êtes au cœur de la création d’un projet numérique et l’accessibilité numérique doit faire partie de votre quotidien ; de la prise en compte de la réglementation aux aspects techniques de mise en accessibilité de composants (structure de code, composant interactifs, etc.) en passant par la compréhension des différentes situations de handicap.

Les offres du centre de formation LUCIE

Vous souhaitez former une équipe en interne ?
Organisez une session de formation dédiée à votre organisation. Si vous souhaitez adapter cette formation avec un contenu sur-mesure, consultez-nous.


Vous souhaitez vous formez à la RSE à titre personnel ?


Vous êtes en reconversion professionnelle ou vous souhaitez simplement monter en compétence sur la RSE, bénéficiez d’une tarification avantageuse et n’hésitez pas à nous contacter pour plus de détails

Nous contacter

Centre de formation
100% RSE

Près de 2000 participants

12 ans
d’expérience

Plus de 50 programmes de formation

Qualiopi & éligible OPCO

A qui s’adresse cette formation ?

Publics concernés

  • Développeur
  • Intégrateur
  • webmaster

Prérequis

  • Maîtriser le HTML et le CSS, connaissances en JavaScript.
  • Ordinateur équipé des logiciels (gratuits) demandés lors de l’inscription

Objectifs Généraux

  • Connaître le contexte législatif et les utilisateurs concernés ;
  • Découvrir les technologies d’assistance et l’utilisation des lecteurs d’écran en particulier ;
  • Prendre en compte les exigences en matière d’accessibilité numérique dans l’intégration et le développement de sites Web, en s’appuyant sur le RGAA.

Les compétences clés visées

A la fin de la formation, les stagiaires seront en compétence de :

  • Défendre l’accessibilité numérique et comprendre les enjeux qui y sont associés
  • Citer les différentes normes et les référentiels existant dans le domaine de l’accessibilité du Web
  • Utiliser un lecteur d’écran sommairement et naviguer dans une page à l’aide de celui-ci
  • Utiliser facilement le référentiel RGAA et ses ressources
  • Créer ou corriger des pages pour qu’elles puissent être conforme au RGAA
  • Identifier les besoins en matière de motifs de conception ARIA et les appliquer

Le programme détaillé de la formation

Introduction

  • Sensibilisation à l’accessibilité numérique
  • Définition du contexte légal
  • Quels sont les outils utilisés par les utilisateurs en situation de handicap

ARIA

  • Définition
  • Changement de rôle
  • Changer un intitulé avec ARIA

Éléments obligatoires

  • Titre de la page
  • Doctype, validité du code source, indication de langue
  • Détournement de balises
  • Exercice : Vérifier et corriger si nécessaire : le doctype et la validité du code source ; l’indication de la langue et des changements de langue ; les détournements de balises

Structuration

  • Structure du document (HTML5 & titres dans la page)
  • Listes
  • Citations
  • Abréviations
  • Exercice : vérifier et corriger la structure du document, la présence de titres suffisante + hiérarchie, les listes, les citations

Navigation

  • Systèmes de navigation
  • Plan du site
  • Liens d’accès rapide
  • Fil d’ariane
  • Landmarks ARIA
  • Accès aux contenus additionnels apparaissant au survol
  • Exercice : Implémenter des liens d’accès rapide visibles uniquement à la prise de focus ; Vérifier et implémenter les landmarks ARIA nécessaires.

Cadres

  • Identifier les cadres

Couleurs

  • Information donnée par la couleur
  • Contrastes suffisants (textes + composants d’interface)

Images

  • alternatives
  • descriptions détaillées
  • captcha
  • images légendées
  • Exercice : vérifier et corriger parmis les images les alternatives et les légendes d’images

Multimédias

  • Définition : contenus multimédia temporel et non temporel
  • Compatibilité avec les technologies d’assistance

Tableaux

  • tableaux de mise en forme
  • structuration des tableaux simples et complexe (titre, résumé, entête)
  • Exercice : vérifier et corriger les tableaux (structuration, titre, résumé, cellules d’entête, liaisons entre entre cellule d’entête et de contenu)

Formulaire

  • Etiquette et regroupement de champs de formulaire
  • Intitulés de boutons
  • Indication du format obligatoire ou de message indiquant le format attendu
  • Indication des champs en erreur et aide à la saisie
  • Nature des champs de formulaire
  • Exercice : vérifier et corriger les étiquette & regroupement de champs, indication des champs obligatoires et des formats, les messages d’erreur/validation

Liens

  • Liens explicites & liens avec des polices d’icônes
  • Titres de liens
  • Exercice : vérifier et corriger les intitulés de liens et les titres de liens

Présentation

  • Utilisation exclusive de CSS
  • Agrandissement des caractères
  • Contenu compréhensible sans CSS
  • Visibilité des liens/prise de focus
  • Information par la forme, la taille ou la position
  • Reflow
  • Espacement des textes
  • Contrôle des contenus additionnels au clavier.
  • Exercice : vérifier et faire en sorte que le contenu soit compréhensible sans styles, la visibilité du focus

Consultation

  • Rafraîchissements, limites temporelles ;
  • Clignotement, contenus en mouvement, effet de flash et son déclenché automatiquement.
  • Orientation de l’écran & gestes complexes
  • Fichiers en téléchargement, nouvelles fenêtres

Scripts & ARIA

  • Compatibilité avec les technologies d’assistance
  • Scripts utilisables au clavier et à la souris
  • Ordre de tabulation & piège au clavier (thématique navigation)
  • Changement de contexte
  • Messages de statut
  • ARIA :
    • propriétés et états ARIA
    • Les « Live Regions » (zones mises à jour)
    • Motif de conception.
  • Exercice : Évaluer et corriger un motif de conception, tester la restitution des composants présents dans la page d’exercice, vérifier que les boutons aient des intitulés, le bon rôle, et indiquer l’état de l’élément qu’il contrôle.

Les méthodes pédagogiques

  • Présentations des concepts
  • Exercices et cas pratiques de mise en pratique
  • Le support de formation, une liste de ressources complémentaires, ainsi que l’exercice corrigé et commenté vous sera remis lors de cette formation.

La mise en oeuvre

  • Formation en visio-conférence ou présentiel selon le cas – sessions intra entreprise uniquement
  • Nombre de journées : 3 jours soit 21 heures
  • Nombre minimum de participants : 4
  • Nombre maximum de participants : 12
  • Adaptations possibles des conditions d’accueil et d’animation selon besoin(s) spécifique(s) du participant, merci de contacter notre référent handicap au moins 2 mois avant la session envisagée via cette adresse : formation@agence-lucie.com

Les formateurs

Simon Bonaventure

Simon Bonaventure

Responsable du pôle accessibilité numérique à Empreinte Digitale, Simon
accompagne des sociétés et organismes à la mise en œuvre de services numériques accessibles. Ses missions vont de l’audit d’accessibilité numérique, à l’accompagnement d’équipes de développement pour s’assurer de la conformité au RGAA, en passant par des formations dédiées à l’accessibilité numérique (auditeur, webdesigner, contributeurs, développeurs, etc.).
Il anime des formations autour de l’écoconception auprès de différents grands comptes et structures informatiques.

Axel Liszkowski

Axel Liszkowski

Expert en Accessibilité Numérique, Axel est développeur frontend de formation, son expertise technique lui permet de pouvoir dialoguer avec les développeurs frontend en charge d’impléter l’accessibilité numérique. Passionné par le sujet de l’accessibilité, il a passé le cap de l’expertise en se formant aux missions d’audit.

Validation des compétences

  • Evaluation formative : Au cours de de formation, les stagiaires ont l’opportunité de mettre en œuvre leurs compétences par le moyen de jeux de questions/réponses, ou d’exercices et de réflexion sur la transformation d’une interface non accessible en interface conforme au RGAA.
  • Validation des acquis : À la fin de la session, un quizz d’évaluation des acquis est effectué et corrigé.