Figma & accessibilité numérique : concevoir des interfaces conformes au RGAA

– Accessibilité numérique : définition, enjeux et bénéfices pour l’ensemble des utilisateurs
– Situations de handicap : panorama des différents types de handicaps et de leurs besoins
– Technologies d’assistance : lecteurs d’écran et outils utilisés par les personnes en situation de handicap
– Principes du WCAG : les 4 fondements du référentiel international d’accessibilité du W3C
– Cadre réglementaire français : obligations légales et périmètre du RGAA
– Accessibilité et expérience utilisateur : dépasser la contrainte légale pour améliorer l’UX

– Principe de perceptibilité : rendre l’information disponible quels que soient les sens mobilisés
– Images accessibles : distinction porteuse d’information / décorative, nom, description et alternative textuelle
– Annotations d’accessibilité : documenter les intentions d’accessibilité directement dans Figma
– Perception des couleurs : prise en compte du daltonisme dans les choix graphiques
– Transmission de l’information : ne pas reposer uniquement sur la couleur, la forme, la taille ou la position
– Contrastes de couleurs : lisibilité des textes, des éléments graphiques porteurs d’information et des liens
– Vérification des contrastes dans Figma : outil intégré et plugins dédiés
– Modes de variables : construire un thème accessible et déclinable
– Tableaux accessibles : structurer des tableaux exploitables avec Figma

– Principe d’opérabilité : garantir que tous les éléments d’interface sont manipulables
– Navigation au clavier : gestion du focus et de l’ordre de tabulation
– Variant Focused : matérialiser le focus sur les composants interactifs dans Figma
– Ordre de tabulation : définition et vérification avec le plugin Stark
– Cibles interactives : surface et dimensions minimales des éléments cliquables
– Responsive design : indépendance vis-à-vis de l’orientation de l’écran
– Animations : bonnes pratiques pour préserver le confort et la sécurité des utilisateurs
– Formulaires accessibles : étiquettes de champ, aide à la saisie, nom accessible, étiquette et champ accolés, regroupement de champs
– Contrôles de saisie : champs obligatoires et gestion des erreurs

– Principe de prévisibilité et de compréhensibilité : rendre l’interface prévisible et lisible
– Pièges d’accessibilité : identifier des UI peu compatibles avec les lecteurs d’écran
– Architecture des contenus : hiérarchie visuelle et styles de texte
– Boutons et liens : liens explicites, liens texte et image, liens d’accès rapide / d’évitement, nom accessible et nom visible
– Annotation des contenus textuels : changement de langue, liens internes, listes, citations
– Éléments multimédia : transcription textuelle des vidéos, sous-titres et lecteurs vidéo accessibles
– Systèmes de navigation : menu, plan du site et moteur de recherche
– Structure d’une page HTML5 dans Figma : header, footer et contenu principal
– Navigation dans la page : menu principal, fil d’Ariane et onglets