Le nouveau programme de la formation accessibilité HTML/CSS, JavaScript et interfaces riches
Les temps évoluent, et pour répondre de manière efficace et pragmatique aux questions que vous vous posez sur vos projets, notre formation phare s’offre un petit lifting.
Destinée principalement aux intégrateurs et développeurs front-end, la formation accessibilité HTML/CSS, JavaScript et interfaces riches aborde désormais de manière avancée HTML5 et les interfaces riches (accordéons, carrousels, datepickers, autocomplétion de formulaires, etc.). Découvrez sans plus attendre ce nouveau programme.
Programme
Introduction à l’accessibilité et vision utilisateur
- Démonstrations d’aides techniques sur ordinateurs (lecteurs d’écran, synthèses vocales, contrastes élevés, etc.).
- Démonstrations d’aides techniques sur smartphones et tablettes (VoiceOver sur iOS, TalkBack sur Android).
Aperçu des différentes étapes de prise en compte
- Présentation des référentiels d’accessibilité (WCAG 2.0, RGAA 3, AccessiWeb HTML5).
- Présentation des actions à mener à chaque étape de conception d’un projet web.
Accessibilité de la conception graphique et ergonomique
Aperçu des principaux critères d’accessibilité applicables aux storyboards et maquettes graphiques.
Critères d’accessibilité HTML5 génériques
- Éléments obligatoires et grammaire HTML5.
- Structuration et sémantique HTML5 :
- Structures de titres
h1
àh6
, niveaux de titres en HTML5. - Sémantique du code HTML5.
- Balises sectionantes HTML5 (
header
,nav
,section
,article
,aside
…).
- Structures de titres
Accessibilité des images et des liens
- Images
- Insertion des images décoratives, informatives (gestion de l’alternative, gestion des balises
figure
etfigcaption
). - Insertion des pictogrammes (icons font, sprites, etc.).
- Règles techniques de gestion des CAPTCHA.
- Accessibilité de SVG et canvas.
- Insertion des images décoratives, informatives (gestion de l’alternative, gestion des balises
- Liens et boutons
Codage des liens et boutons, différence sémantique pour l’accessibilité
Accessibilité CSS
- Grammaire CSS.
- Définition des couleurs de fond et gestion des pertes d’informations (mode de contraste élevé).
- Gestion de l’agrandissement du texte, gestion des unités de police (
em
,rem
,%
,px
…).
Accessibilité des tableaux de données
Structurer les tableaux de données (caption
, summary
, th
, scope
, etc.).
Accessibilité des formulaires
- Intégration des champs de formulaires et étiquettes (balise
label
, attributtitle
, etc.). - Regroupements de champs et listes déroulantes (balises
fieldset
etlegend
). - Validation des formulaires à la volée, validation des formulaires côté client.
- Gestion des messages d’erreurs côté client.
- L’accessibilité des attributs et types de champs HTML5 pour les formulaires.
Critères d’accessibilité pour la consultation
- Gestion des rafraîchissements automatiques, rafraichissements AJAX.
- Gestion des contenus en mouvement, défilants et/ou clignotants.
- Codage des carrousels.
- Ouverture de pop-up, pop-in (lightbox, fenêtres modales).
Exercices de synthèse
Par binôme avec utilisation des outils d’aide à l’évaluation.
Accessibilité JavaScript et AJAX
- Règles génériques (navigation/utilisation au clavier).
- ARIA (présentation d’ARIA et démonstrations, rôles, régions dynamiques).
- Accessibilité des éléments d’interfaces riches comme :
- Accordéons
- Carrousels
- Datepickers
- Autocomplétions de formulaires
- Menus déroulants
- Éléments de formulaire enrichis en JavaScript (cases à cocher, listes déroulantes, etc)
- Onglets
- Etc.
Accessibilité du multimédia
- Aperçu des principaux critères d’accessibilité applicables aux sons et vidéos.
- Présentation de lecteurs vidéos HTML5 accessibles.
Présentation des outils d’évaluation
- Intérêts et limites des outils d’évaluation
- Présentation de plusieurs outils d’évaluation
(pendant la formation, plusieurs outils et extensions seront présentés pour aider aux tests et développements d’interfaces accessibles)
Inscrivez-vous
Consultez les prochaines sessions et inscrivez-vous en ligne, sur la page de la formation accessibilité HTML/CSS, JavaScript et interfaces riches .