Handicap et accessibilité numérique : Flipbook, catalogue interactif, Erreurs à éviter, comment choisir ? « Mettre le Web et ses services à la disposition.

Présentation au sujet: "Handicap et accessibilité numérique : Flipbook, catalogue interactif, Erreurs à éviter, comment choisir ? « Mettre le Web et ses services à la disposition."— Transcription de la présentation:

1 Handicap et accessibilité numérique : Flipbook, catalogue interactif, Erreurs à éviter, comment choisir ? « Mettre le Web et ses services à la disposition de tous les individus, quel que soit leur matériel ou logiciel, leur infrastructure réseau, leur langue maternelle, leur culture, leur localisation géographique, ou leurs aptitudes physiques ou mentales. » Tim Berners-Lee, directeur du W3C N.B. : Un Catalogue interactif peut aussi s’appeler e-Catalogue, e-Brochure, Flipbook … e-accessibility Le label responsable

2 Les évolutions depuis 2005 Progrès et accessibilité Catalogue interactif accessible : quelques définitions … Catalogue interactif = solution de virtualisation des documents Catalogue interactif = interface (contenant) + document (contenu) Interface accessible = navigation full clavier + compatibilité avec les technologies d’assistance (lecteur d’écran type Jaws utilisé par les non-voyants) Document accessible = tous les contenus rendus accessibles (document PDF, player & vidéo, animations, etc.) Accessibilité = Conformément aux normes WCAG 2.0 + ARIA du W3C Qu’en est-il de l’accessibilité des solutions du marché ? Beaucoup de solutions se disent accessibles en proposant juste le document (contenu) en version HMTL = interface non utilisable par les pers. handicapées Encore faut-il que la version HTML soit conforme aux normes d’accessibilité ? (Niveaux de titres, changements de langue, liens, tableaux, etc.) Pour s’en assurer : exigez des tests par des non-voyants via Jaws ! e-accessibility Le label responsable

3 Comment éviter les solutions non-conformes ? Bluff de l’esthétisme : Une belle interface accompagnée de textes en Html sans balises de navigation n’est pas interprétable, donc solution non accessible Bluff de la synthèse vocale : L’utilisation d’une synthèse vocale (de type ReadSpeaker) pour lire un texte Html n’est pas une preuve d’accessibilité, surtout sans les balises de navigation = non accessible Pas d’alternatives textuelles = Pas d’interprétation d’images, de boutons d’écrans, de mots simplifiés (ex: 33M = 33 Millions) = non accessible PDF accessible, Catalogue accessible Les erreurs à éviter e-accessibility Le label responsable Comment un non-voyant navigue avec JAWS ? Jaws = lecteur d’écran utilisé par une personne non-voyante permettant d’interpréter un texte (donc Prise en compte des balises de navigation) au format HMTL ou PDF accessible. Cette lecture est accompagnée d’une synthèse vocale. Les raccourcis natifs de Jaws permettent à l’utilisateur de naviguer plus facilement, le cas contraire, la navigation sera extrêmement difficile.

4 Étude de Cas A (1/3) Interface HTML (Sans Balises de navigation) Ce texte est-il cohérent ? Sans Balises de navigation, une personne non-voyante ne peut ni accéder au contenu, ni s’orienter, ni interpréter le contenu de ce texte 2 409 11 592 230 … ? (1) (voir diapo 3/3) 46 M =« 46 M » = « 46 Millions » = ? Est-ce évident ? 12 5 621 ? (2) (voir diapo 3/3) N.B. : Pour le respect de la société concernée, son nom ne sera pas divulgué. e-accessibility Le label responsable

5 Holding est le mot recherché Ce texte est-il compréhensible par une personne valide ? Et pour personne handicapée ? Étude de Cas A (2/3) Interface graphique – Mode Recherche (Sans Balises de navigation) e-accessibility Le label responsable

6 12 5 621 ? (2) (voir diapo 1/3) Avec une interface graphique, il est possible de comprendre ces chiffres en utilisant le camembert. 46 M correspond à 46 Millions 2 409 11 592 230 … ? (1) (voir diapo 1/3) Chaîne de chiffres déchiffrée … Étude de Cas A (3/3) Interface graphique du catalogue interactif (Sans Balises de navigation) e-accessibility Le label responsable

7 Que se passe t’il lorsqu’on tente d’afficher l’image de cette page ? Réponse à la page suivante Étude de Cas B (1/2) Interface HTML (Sans Balises de navigation) N.B. : Pour le respect de la société concernée, son nom ne sera pas divulgué. e-accessibility Le label responsable

8 En affichant l’image, à notre grande surprise, nous découvrons un papier peint. Les images doivent être séparées des unes des autres afin de pouvoir être interprétées. Impossibilité d’inclure des alternatives textuelles. Avec ce papier peint, impossibilité de navigation (accès au contenu, orientation, interprétation) Texte incrusté à l’image sans aucune alternative textuelle Étude de Cas B (2/2) Interface HTML en papier peint (Sans Balises de navigation) e-accessibility Le label responsable

9 Les critères d’accessibilité : Lisibilité (Readability) : Texte lisible par tous et sur tout format (Html, PDF …) Utilisabilité (Usability) : Ergonomie (Navigation clavier, image avec alternative textuelle, Zoom, Confort de lecture, adaptation des couleurs …) Conformité (Suitability) : Les normes WCAG 2.0 & ARIA et Les niveaux de conformité Simple A, Double A, Triple A Accessibilité = Lisibilité + Utilisabilité + Conformité A quoi sert une balise de navigation ? Une solution accessible est une solution dont la navigation permet l’accès à un contenu (Tableau, Niveaux de titre, Camembert etc.) ainsi qu’à son interprétation Les balises de navigation et les alternatives textuelles servent aussi d’orientation et d’interprétation pour la personne non-voyante Un texte lisible non navigable n’est pas accessible pour une pers. non-voyante La navigation doit être possible par la souris et par le clavier (tabulation) e-accessibility Le label responsable Ergonomie, Balises de navigation Comment choisir ?

10 Récapitulatif Un expert est toujours en collaboration avec une personne handicapée dans tous ses projets. Dans le cas contraire, soyez vigilant ! Les balises de navigation (tables, niveaux de titres …) sont obligatoires afin de permettre l’accès au contenu, l’orientation et l’interprétation par une personne non-voyante en utilisant un lecteur d’écran tel que Jaws Les tests de conformité sont obligatoires Les critères d’accessibilité obligatoires (lisibilité, utilisabilité, conformité) vous serviront à avoir une vision globale de l’accessibilité numérique et vous permettront d’éviter le bluff … Prestation sérieuse = Tests de conformité obligatoires Une solution accessible est obligatoirement soumise à des tests de conformité (appelés aussi Tests utilisateur) par des utilisateurs non-voyants Par défaut, il est prioritaire que les tests de conformité se déroulent lors des rendez-vous de démonstration e-accessibility Le label responsable Le handicap, une expertise Les bons réflexes

11 Questions et Sensibilisation Conseil d’expert en accessibilité Soyez vigilant ! Aidez-vous de ce guide pour mieux choisir Un catalogue accessible commence par l’accessibilité de vos fichiers PDF ainsi que de la page HMTL : Faites les tester ! Renseignez-vous sur les différentes balises de navigation afin de mieux comprendre l’ergonomie de l’application (info-bulle, niveaux de titre, etc.) Ne gaspillez pas votre budget dans des applications inappropriées ! Demandez conseil ! Des questions sur l’accessibilité numérique ? Pour mieux vous informer, veuillez contacter l’association « e-accessibility » : http://www.e-accessibility.info ou bien contact@e-accessibility.info http://www.e-accessibility.infocontact@e-accessibility.info Le label PDF pour les publications Le label Web pour les sites e-accessibility Le label responsable