AcceDe Web
Notices pratiques et libres
de prise en compte de l’accessibilité
David Monnehay
E-Accessibility consultant
Référentiels disponibles
RGAA
SGQRI 008-02
Ils ne sont pas adaptés à la gestion de projets
et de nombreux autres…
Il sont complexes à appréhender pour une partie
des membres d’une équipe de production (chef de
projet, ergonome, graphiste, contributeurs)
L’absence de ressources clairs et synthétiques
freine le déploiement de l’accessibilité
Et le soutien de :
Agence Entreprises & Handicap, Anysurfer, Association des Paralysés de France (APF),
CIGREF, Design For All Foundation, ESSEC, Handirect, Hanploi,
Sciences Po, Télécom ParisTech
Notices adaptées aux étapes d’un projet web,
compréhensibles par les acteurs des projets
Recommandations simples
Synthétiques et opérationnelles
Une base de connaissances libre
pour les professionnels du web
Adaptées aux projets
Adaptées à chaque phase d’un projet
Prévoir l’apparence des liens d’évitement
[Notice d’accessibilité pour la conception fonctionnelle et graphique]
L’apparence d’un lien d’évitement « Aller au contenu » doit être prévu au sommet
d’au moins une des maquettes graphiques.
Astuce
Si souhaité, celui-ci peut être masqué par défaut. Dans ce cas-là, c’est en phase de
développement qu’il sera rendu visible dans certaines situations (navigation au clavier,
version mobile, etc.).
Cas d’utilisation
Intégration HTML :
Garantir la visibilité de la prise de focus au clavier
Maquettes graphiques :
Prévoir l’apparence des liens au survol à la souris et à la prise de focus clavier
Cas d’utilisation
Maquettes graphiques :
Prévoir un moyen de stopper les animations
Composants Interface riche :
Carrousels
Socle HTML, Comportement clavier, Comportement javascript
Cas d’utilisation
Guidelines for rich interfaces and JavaScript :
Slideshows
Basic HTML Code, Javascript behavior, keyboard behavior
Cas d’utilisation
Guidelines for rich interfaces and JavaScript :
Slideshows
Basic HTML Code, Javascript behavior, keyboard behavior
Notice Graphique :
Assurer un contraste suffisant entre les textes et l’arrière-plan
ou proposer une alternative contrastée
Cas d’utilisation
Guidelines for rich interfaces and JavaScript :
Slideshows
Basic HTML Code, Javascript behavior, keyboard behavior
Échec 2.4:1 Ok 4.7:1 Échec 2.3:1 Échec 2.2:1
Cas d’utilisation
Notice Graphique :
Assurer un contraste suffisant entre les textes et l’arrière-plan
ou proposer une alternative contrastée
Cas d’utilisation
Une checklist pour chaque étape
Une façon simple d’impliquer chaque
intervenant à leur propre niveau
La bonne information au bon moment
Peuvent être modifiées pour être
adaptées à vos processus qualité
Merci :-)
David Monnehay
dmonnehay@atalan.fr
http://accede.info/
contact@atalan.fr

ACCEDE WEB, LES GUIDES D’ACCESSIBILITE POUR PROJETS WEB

  • 1.
    AcceDe Web Notices pratiqueset libres de prise en compte de l’accessibilité David Monnehay E-Accessibility consultant
  • 2.
    Référentiels disponibles RGAA SGQRI 008-02 Ilsne sont pas adaptés à la gestion de projets et de nombreux autres… Il sont complexes à appréhender pour une partie des membres d’une équipe de production (chef de projet, ergonome, graphiste, contributeurs) L’absence de ressources clairs et synthétiques freine le déploiement de l’accessibilité
  • 3.
    Et le soutiende : Agence Entreprises & Handicap, Anysurfer, Association des Paralysés de France (APF), CIGREF, Design For All Foundation, ESSEC, Handirect, Hanploi, Sciences Po, Télécom ParisTech Notices adaptées aux étapes d’un projet web, compréhensibles par les acteurs des projets
  • 4.
    Recommandations simples Synthétiques etopérationnelles Une base de connaissances libre pour les professionnels du web Adaptées aux projets Adaptées à chaque phase d’un projet Prévoir l’apparence des liens d’évitement [Notice d’accessibilité pour la conception fonctionnelle et graphique] L’apparence d’un lien d’évitement « Aller au contenu » doit être prévu au sommet d’au moins une des maquettes graphiques. Astuce Si souhaité, celui-ci peut être masqué par défaut. Dans ce cas-là, c’est en phase de développement qu’il sera rendu visible dans certaines situations (navigation au clavier, version mobile, etc.).
  • 5.
    Cas d’utilisation Intégration HTML: Garantir la visibilité de la prise de focus au clavier Maquettes graphiques : Prévoir l’apparence des liens au survol à la souris et à la prise de focus clavier
  • 6.
  • 7.
    Maquettes graphiques : Prévoirun moyen de stopper les animations Composants Interface riche : Carrousels Socle HTML, Comportement clavier, Comportement javascript Cas d’utilisation
  • 8.
    Guidelines for richinterfaces and JavaScript : Slideshows Basic HTML Code, Javascript behavior, keyboard behavior Cas d’utilisation
  • 9.
    Guidelines for richinterfaces and JavaScript : Slideshows Basic HTML Code, Javascript behavior, keyboard behavior Notice Graphique : Assurer un contraste suffisant entre les textes et l’arrière-plan ou proposer une alternative contrastée Cas d’utilisation
  • 10.
    Guidelines for richinterfaces and JavaScript : Slideshows Basic HTML Code, Javascript behavior, keyboard behavior Échec 2.4:1 Ok 4.7:1 Échec 2.3:1 Échec 2.2:1 Cas d’utilisation Notice Graphique : Assurer un contraste suffisant entre les textes et l’arrière-plan ou proposer une alternative contrastée
  • 11.
  • 13.
    Une checklist pourchaque étape Une façon simple d’impliquer chaque intervenant à leur propre niveau La bonne information au bon moment Peuvent être modifiées pour être adaptées à vos processus qualité
  • 14.