La formation Développer des sites Web modernes et conformes au RGAA 4 vous permettra de comprendre les problèmes rencontrés par les utilisateurs, et de prendre en compte les critères du RGAA dans le développement de sites web.
Objectifs de formation
A l'issue de cette formation, vous serez capable de :
- Sensibiliser vos interlocuteurs à l'accessibilité numérique (contexte législatif, problématiques des utilisateurs en situation de handicap...)
- Concevoir et développer des sites et applications Web accessibles conformément au référentiel en vigueur (RGAA 4.1 ou WCAG 2.1)
- Auto-évaluer l'accessibilité de vos développements Web.
Prérequis
Maîtriser des technologies HTML5 et CSS3, avoir des notions de JavaScript.
Validez les prérequis
Afin de vérifier que vous disposez bien des prérequis nécessaires à cette formation, nous vous invitons à réaliser ce test.
Temps estimé : 4 minutes.
Passer le testPublic concerné
Développeurs (Back et Front), intégrateurs et experts techniques, responsables techniques...
Programme
Jour 1 - Matin
L'accessibilité numérique : définition et enjeux
Les besoins et impacts utilisateurs
- Déficiences :
- Visuelles
- Auditives
- Motrices
- Cognitives
Les référentiels d'accessibilité en vigueur
- Définitions, usages, et limites
- WCAG (Web Content Accessibility Guidelines)
- RGAA (Référentiel Général d'Amélioration de l'Accessibilité)
- Ressources supports du RGAA
Les outils de tests
- Les outils automatiques
- Les outils manuels
- Application à des cas pratiques :
- Détection d'éléments
- Vérification de propriétés
- Pertinence des choix techniques
Jour 1 - Après-midi
Fonctionnement des technologies d'assistance
- Interfaçage entre applications et lecteur d'écran
- Interactions avec les contenus en HTML
- Limitations du HTML
Standard ARIA
- Présentation
- Rôle
- Syntaxe générale
- Utilisation dans le HTML
- Outils d'inspection
Images
- Les différents types d'images et les bonnes pratiques associées
- Images décoratives
- Images informatives simples
- Images complexes
- Images de texte
- Images légendées
- Les techniques d'implémentation en fonction du type d'image
Cadres en ligne : présence et pertinence du titre
Multimédia : compatibilité avec les technologies d'assistance
Tableaux
- Tableaux de données
- Bonnes pratiques associées
- Techniques d'implémentation
- Tableaux de présentation
- Bonnes pratiques associées
- Techniques d'implémentation
Liens
- Les différents types de liens
- Notion de lien explicite
- Notion de contexte de lien
- Liens vides
Exemples de travaux pratiques (à titre indicatif)
- Vérifier et évaluer les rôles et noms accessibles d'éléments de pages Web
- Identifier différents types d'images, et déterminer des alternatives pertinentes
- Analyser les tableaux présents sur les pages Web
- Analyser les pages Web et vérifier le caractère explicite des liens qu'elles contiennent
- Détecter les liens vides des pages Web
Jour 2 - Matin
Scripts
- Compatibilité avec les technologies d'assistance
- Pistes de conception
- Nom
- Rôle
- Valeur
- Paramétrage et changements d'état
- Design patterns
- Les alternatives aux scripts
- La gestion des interactions clavier / souris / tactile
- Les changements de contexte
- Les messages d'alerte et de statut
Éléments obligatoires
- Validité du code
- Gestion des changements de langue et de direction de lecture
- Titres de page
- Utilisation des éléments de présentation
Structuration de l'information
- Titres de section
- Structures de document
- Les différents types de listes
- Citations
Exemples de travaux pratiques (à titre indicatif)
- Développer un système d'onglets accessible sur la base de la documentation fournie
- Analyser des scripts présents dans les pages Web et déterminer des alternatives possibles
- Analyser des pages Web et vérifier la pertinence du titre
- Déterminer des titres de section pertinents
- Déterminer des structures de document pertinentes
- Déterminer des types de listes pertinents
Jour 2 - Après-midi
Présentation de l'information
- Utilisation des styles
- Caractères agrandis
- Gestion des couleurs
- Contenu caché
- Réorganisation du contenu
- Propriétés d'espacement des textes
- Gestion des contenus additionnels
Formulaires
- Etiquettes de champs : présence, pertinence, cohérence
- Position des étiquettes
- Regroupement de champs
- Regroupement des options de listes
- Boutons de formulaire
- Contrôles de saisie, champs obligatoires et champs en erreur
- Reprise des données
- Attributs pour le remplissage automatique
Navigation
- Mécanismes de navigation interne
- Liens d'évitement
- Ordre de tabulation
- Piège au clavier
- Raccourcis clavier
- Gestion du clavier pour les contenus additionnels
Consultation
- Limites de temps
- Orientations
- Gestes complexes
- Annulation des interactions
- Interactions par le mouvement
Exemples de travaux pratiques (à titre indicatif)
- Déterminer des techniques de masquage appropriées pour différentes situations
- Vérifier la pertinence des étiquettes de champs
- Vérifier la pertinence des attributs pour le remplissage automatique
Le contenu de ce programme peut faire l'objet d'adaptation selon les niveaux, prérequis et besoins des apprenants.
Modalités, méthodes et moyens pédagogiques
Formation délivrée en présentiel ou distanciel* (blended-learning, e-learning, classe virtuelle, présentiel à distance).
Le formateur alterne entre méthode** démonstrative, interrogative et active (via des travaux pratiques et/ou des mises en situation).
Variables suivant les formations, les moyens pédagogiques mis en oeuvre sont :
- Ordinateurs Mac ou PC (sauf pour certains cours de l'offre Management), connexion internet fibre, tableau blanc ou paperboard, vidéoprojecteur ou écran tactile interactif (pour le distanciel)
- Environnements de formation installés sur les postes de travail ou en ligne
- Supports de cours et exercices
En cas de formation intra sur site externe à M2i, le client s'assure et s'engage également à avoir toutes les ressources matérielles pédagogiques nécessaires (équipements informatiques...) au bon déroulement de l'action de formation visée conformément aux prérequis indiqués dans le programme de formation communiqué.
* nous consulter pour la faisabilité en distanciel
** ratio variable selon le cours suivi
Modalités d’évaluation des acquis
- En cours de formation, par des études de cas ou des travaux pratiques
- Et, en fin de formation, par un questionnaire d'auto-évaluation
Accessibilité de la formation
Le groupe M2i s'engage pour faciliter l'accessibilité de ses formations. Les détails de l'accueil des personnes en situation de handicap sont consultables sur la page Accueil et Handicap.
Modalités et délais d’accès à la formation
Les formations M2i sont disponibles selon les modalités proposées sur la page programme. Les inscriptions sont possibles jusqu'à 48 heures ouvrées avant le début de la formation. Dans le cas d'une formation financée par le CPF, ce délai est porté à 11 jours ouvrés.