Formation Développement Web et accessible - Niveau expert

Jour 1 - Matin

Rappels sur l'accessibilité numérique

• Définition, notion de "situation de handicap"
• Chiffres clés autour du handicap
• Les typologies de déficience :
• Visuelles
• Auditives
• Motrices
• Cognitives
• Technologies d'assistance

Exemple de travaux pratiques (à titre indicatif)

• Exemples d'utilisateurs confrontés à des sites non accessibles

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é)
• RAAM (Référentiel d'Accessibilité des Applications Mobiles)
• Limite des référentiels : différence entre conformité (technique) et accessibilité
• Rappel du cadre légal

L'audit RGAA

• Méthodologie
• Définition d'un échantillon d'audit
• Comprendre et utiliser la grille d'audit RGAA
• Priorisation
• Déclaration d'accessibilité

Les outils de tests

• Principe des tests d'accessibilité, limite des outils automatiques
• Les outils automatiques

Exemples de travaux pratiques (à titre indicatif)

• Présentation et utilisation de quelques outils automatiques (type Tanaguru Webext RGAA 4)

Jour 1 - Après-midi

Les outils de tests - Suite

• Les outils manuels
• Test au clavier
• Assistant RGAA : pour identifier les alternatives des images, pour redéfinir les propriétés d'espacement des textes
• ANDI : pour identifier les alternatives des images, les noms accessibles, les contrastes de couleurs, la visibilité du focus
• HeadingsMap : pour définir la structure du document (niveaux de titres)

Exemples de travaux pratiques (à titre indicatif)

• Apprendre à utiliser les outils manuels avec des cas pratiques sur des sites Web
• Cas pratique : tester la navigation au lecteur d'écran

Concept WAI-ARIA

• WAI-ARIA : rôle, statut et propriété
• Exemples d'utilisation

Les thématiques du RGAA 4

• Images
• Rappels rapides sur les différents types d'image
• Les techniques d'implémentation en fonction du type d'image
• Cadres en ligne : rappels rapides
• Couleurs : rappels rapides
• Multimédia : rappels rapides
• 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

Exemples de travaux pratiques (à titre indicatif)

• Identification des différents types d'image, et détermination des alternatives pertinentes
• Analyse de tableaux présents sur des pages Web; propositions de corrections
• Rendre un tableau accessible via le code

Jour 2 - Matin

Les thématiques du RGAA 4 - Suite

• Liens : rappels rapides sur le principe de liens explicites
• 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
• Elé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)

• Sur la base de la documentation fournie, corriger des composants complexes pour les rendre accessibles
• Analyse de scripts présents dans des pages Web, et détermination d'alternatives possibles
• Analyse de pages Web, et vérification de la pertinence du titre. Propositions de correction
• Analyse de différentes pages Web, et détermination des structure de document pertinentes

Jour 2 - Après-midi

Les thématiques du RGAA 4 - Suite

• 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 et cohérence
• Position des étiquettes
• Regroupement de champs
• Regroupement des options de listes
• Boutons de formulaire
• Contrôles de saisie, champs obligatoires, 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étermination des techniques de masquage appropriées pour différentes situations
• Analyse de différents formulaires Web, et vérification de la pertinence des attributs pour le remplissage automatique