Les modes d'accès à Internet et les aides techniques

Présentation au sujet: "Les modes d'accès à Internet et les aides techniques"— Transcription de la présentation:

1 Les modes d'accès à Internet et les aides techniques

2 Les modes d'accès à l'Internet
Aveugles : perception auditive et/ou tactile Remarque / réorganisation du cortex visuel : Les techniques de neuro-imagerie ont montré que le cortex visuel des aveugles congénitaux est actif durant la lecture du Braille  cette région est réorientée vers le traitement de l'information lié avec le sens du toucher Région du cerveau activée également pour des tâches de mémorisation verbale Source : Dr Ehud ZOHARY du Département de Neurobiologie de l'Alexander Silberman Institut des Sciences de la Vie de l'Université Hébraïque de Jérusalem 21

3 Les modes d'accès à l'Internet
Mal-voyants : utilisation du reste de vision éventuellement complété par une perception auditive et/ou tactile diversité de pathologies avec des besoins spécifiques

4 Les outils d’aide technique d’accès au Web
Interfaces standards inadaptées (souris...) Outils d'accès complémentaires ou substitutifs : afficheur éphémère Braille et / ou lecteurs d ’écran (ou revues d'écran) en synthèse vocale (Jaws – Window Eyes…) logiciels d'agrandissement (/ pouces) logiciels de reconnaissance vocale (ViaVoice, Dragon NaturallySpeaking) navigateur standard ou spécifique (Internet explorer, Firefox, BrailleSurf, Lynx, Opera) 22

5 Les outils d’aide technique d’accès au Web
Aveugles : perception auditive et tactile Source :

6 Les outils d’aide technique d’accès au Web
Deux dispositifs d'interaction avec les pages Web : le clavier pour naviguer, la barrette Braille pour saisir des informations ou se positionner dans une autre zone de la page 23

7 Les outils d’aide technique d’accès au Web
Lecteurs d'écran ou revues d'écran Jaws, Window Eyes, Hal … : restituent vocalement le texte qui s'affiche à l'écran Exemple de Jaws (Job Access With Speech): permet l'accès aux logiciels (TdT, tableur …) ainsi qu'à l'Internet synthèse vocale intégrée + fournit un support pour les équipements braille Navigateur vocaux Exemple : Home Page Reader d'I.B.M. : conçu spécifiquement pour "lire" des pages Web

8 Les outils d’aide technique d’accès au Web
La barette braille (20, 40, 80 caractères) La barette Braille permet de : situer le curseur dans l'écran (contrairement au lecteur vocal qui ne dispose pas de curseur) percevoir l'orthographe des mots

9 Les outils d’aide technique d’accès au Web
L'imprimante braille Transfère le texte généré par l'ordinateur en informations en braille (technologie d'embossage)

10 Les outils d’aide technique d’accès au Web
Les logiciels d'agrandissement (magnifier) agrandissent l'information apparaissant à l'écran (exemple Zoomtext : de 2 à 16 fois) permettent d'ajuster le contraste, les couleurs, les polices de caractère et leur taille peuvent être couplés à une synthèse vocale (Jaws…) Exemples : LunarPlus, Magic, Zoomtext

11 Coût de l’équipement pour un aveugle
Equipement PC grand public (en 2006) : ou € Equipement pour un aveugle (2006) : PC (souvent 1 portable) : 750 € terminal Braille : entre 5000 et € (compter en moyenne €) logiciel Jaws : autour de 1000 € *  soit plus de 10 fois + coûteux qu'une configuration standard 24

12 Internet et déficients visuels : la problématique

13 Internet & déficients visuels : problématique
Apparition du problème de lecture des contenus numériques sur ordinateur années 80 : affichage purement textuel => accessibilité totale (monde DOS) années 90 : apparition des fenêtres – interfaces graphiques : on passe du 1D au 2D => plages tactiles insuffisantes 25

14 Internet & déficients visuels : problématique
Caractéristiques de la lecture vocale /aveugles : perception auditive et non visuelle séquentielle, linéaire : difficile de passer d'une partie de la page à l'autre (top to bottom) fugace : une fois le texte lu, il n'est plus perçu décontextualisée : référence aux objets graphiques impossibles (ils ne sont pas perçus) …/… 26

15 Internet & déficients visuels : problématique
Les lecteurs d'écran actuels (Jaws…) permettent un scan auditif remplaçant l'écrémage visuel le contenu n'est pas lu séquentiellement dans son intégrité (utilisateurs expérimentés) Comment ? : vitesse de lecture accélérée saut d'entête en entête saut de paragraphe en paragraphe lecture de chaque début de ligne, début de lien … saut de lien en lien ...

16 Internet & déficients visuels : problématique
Lecture vocale et lecture visuelle : 2 modes de perception très différents L'idéal : partir d'un contenu sémantique -> le décliner en fonction des différents modes de perception en se basant sur des modèles de dialogue. Mode lecture vocale : pas une simple transcription du contenu texte (lecture séquentielle) mais une forme de dialogue homme/machine Chaque modalité (vision, audition, toucher …) = un modèle de dialogue spécifique Dans l'idéal, il faudrait partir d'un contenu sémantique et le décliner en fonction des différents modes de perception (ce que permettent en partie les feuilles de style) en se basant sur des modèles de dialogue. Mode lecture vocale : ne serait pas une simple transcription du contenu texte (en lecture séquentielle) mais pourrait être envisagée sous forme d'un dialogue homme/machine Chaque modalité (vision, audition, toucher …) pourrait ainsi être vue comme un modèle de dialogue spécifique Il reste à développer un système permettant de créer les sites Web en 2 phases : 1) création d'un contenu Web interactif (sémantique) indépendamment de la modalité perceptive 2) transformation de l'application selon la modalité reposant sur des modèles de dialogues spécifiques /..

17 Internet & déficients visuels : problématique
Développer un système  créer les sites Web en 2 phases : 1) création contenu Web interactif (sémantique) indépendamment de la modalité perceptive 2) transformation selon la modalité en fonction de modèles de dialogues spécifiques

18 Internet & déficients visuels : problématique
Démarche actuelle : Contenu visuel de la page Web  le rendre accessible Démarche préconisée : Contenu de base unique de la page Web  déclinaison selon différentes stratégies de lecture basées sur des modèles de dialogue interactif Biblio : “Usable Accessibility” to the Web for blind Users Nicoletta Di Blas1, Paolo Paolini1, Marco Speroni2

19 Internet & déficients visuels : problématique
Accès au Web : une charge mentale plus importante Personnes "voyantes" : l'énergie mentale est partagée entre 2 systèmes : le navigateur et le site web Personnes aveugles ou malvoyantes: l'énergie mentale est partagée entre 3 systèmes : le navigateur, le site Web et la technologie d'assistance (le lecteur d'écran ou l'agrandisseur) => nécessité d'un bon modèle mental de ces systèmes

20 Internet & déficients visuels : problématique
Maîtrise insuffisante de la technologie d'assistance (projet avec 16 aveugles *): La plupart utilisent régulièrement la liste des liens (Insert-F7) : saut de lien en lien Quelques uns vérifient le titre de la fenêtre (Insert-T) Quelques uns utilisent la liste des entêtes (Insert-F6) ou sautent d'entête en entête (H au clavier) …/… *Référence : Guidelines for Accessible and Usable Web Sites: Observing Users Who Work With Screen Readers Mary Frances Janice (Ginny) Redish, USA

21 Internet & déficients visuels : problématique
Aucun n'a utilisé la commande Jaws N pour sauter les liens Aucun n'a sauté directement au formulaire d'une page Un seul, un formateur, a utilisé le visualisateur virtuel (Insert-F1)  affiche la description d'une page Web, nombre d'entêtes, de tables de liens et d'autres éléments affichés …/…

22 Internet & déficients visuels : problématique
La moitié des utilisateurs seulement a compris la fonction du lien "sauter la navigation" = attention au jargon Web ou informatique pas toujours accessible ! (utiliser plutôt l'expression : "aller au contenu" + explicite) Stratégie alternative observée pour sauter la navigation : positionnement en fin de page et lecture en commençant par la fin

23 Internet & déficients visuels : problématique
Limites des lecteurs (ou revues) d'écran Enormes progrès /synthèses vocales mais certains mots encore mal prononcés - Exemple Jaws anglais : homepage prononcé hommapodge Problèmes de prononciation des abréviations, acronymes … Support très limité de certaines technologies : javascript, applets, … Fonction de recherche (ctrl F de Jaws) ne boucle pas : part de la position curseur jusqu'à fin du document Etc …

24 Internet & déficients visuels : problématique
Problèmes rencontrés sur le Web /aveugles: navigation difficile – problèmes de repérage - titre des pages non ou mal renseigné trop de liens, souvent mal labellisés pas d'information sur les liens qui font quitter le site éléments graphiques utilisés pour la navigation structuration des pages non cohérente sur l'ensemble du site ../.. 27

25 Internet & déficients visuels : problématique
- arborescence trop complexe (trop de niveaux en profondeur) densité d'information trop importante fenêtres popup qui désorientent l'utilisateur impossibilité de passer de paragraphe en paragraphe problème de répétition des liens de menu de page en page

26 Internet & déficients visuels : problématique
Problèmes rencontrés sur le Web /aveugles: accès à l'information difficile - perte d'information - la sémantique liée aux éléments graphiques et à la présentation de la page sont perdus s'ils ne sont pas complétés par du texte - tableaux de données non labellisés donc incompréhensibles - texte inclus dans une image perdu car non interprétable - technologies rendant invisible l'information : Flash (avant version MX), Javascript ... 28

27 Internet & déficients visuels : problématique
perception difficile de l'organisation des données - réassemblage des différents éléments d'une page Web difficile voir impossible  problème des éléments graphiques non perçus  séquence des éléments HTML non cohérente en vocal : perte du contexte graphique associé au contenu textuel

28 Internet & déficients visuels : problématique
Problèmes rencontrés sur le Web /aveugles : interactions difficiles voire impossibles cas d'absence d'alternative à l'utilisation de la souris zones de saisie non labellisées utilisation de liens dans les images (liens carte-image) charge mentale trop importante pages trop chargées => mémorisation difficile trop de liens certains éléments du code HTML lus mais sans utilité pour l'auditeur (exemple : descriptions d'éléments de décoration comme les puces) 29

29 Internet & déficients visuels : problématique
Problèmes rencontrés sur le Web /mal voyants : perturbations dans la perception visuelle animations, clignotements, défilements, Flash, images surgissantes (popups) information mal ou non perçue combinaisons de couleurs incorrecte et/ou contraste insuffisant entre fond d'écran et texte présence de motifs en arrière-plan 30

30 Internet & déficients visuels : problématique
Conséquences : Perte de temps Perte d'information Fonctionnalité ou service offert par le site inutilisable Fatigue visuelle (malvoyants) Fatigue mentale (aveugles) => abandon de la consultation du site ou même abandon de l'utilisation du Web

31 Introduction à l'accessibilité du Web

32 Accessibilité : définition générale
Objectif de l'accessibilité : Supprimer les barrières qui empêchent les personnes à capacités réduites de participer aux activités essentielles de la vie, incluant l'accès aux services, l'utilisation des produits et l'accès à l'information. 31

33 Accessibilité des interfaces
Objectifs de l'accessibilité appliquée aux interfaces : l'outil doit s'adapter aux caractéristiques de l'utilisateur (et non l'utilisateur qui s'adapte aux défauts de conception de l'outil). concevoir les interfaces pour qu'elles soient accessibles a priori, et non compter sur des moyens techniques pour donner aux déficients visuels la possibilité de contourner un mauvais niveau d'accessibilité.

34 Accessibilité : définition appliquée au Web
L'accessibilité du Web, c'est « 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 et inventeur du World Wide Web

35 Accessibilité : définition appliquée au Web
Accessibilité du Web * : Un site Web accessible est un site auquel il est possible d'accéder de façon équivalente, quels que soient l'interface, le navigateur ou la plate-forme d'accès utilisés. En particulier un site Web accessible est compatible avec les options de personnalisation du logiciel de navigation ou de lecture du document. *Source : Braillenet 32

36 Accessibilité : définition appliquée au Web
Accessibilité du Web * : Quiconque utilisant n'importe quelle technologie de navigation doit pouvoir visiter n'importe quel site et avoir une pleine et complète compréhension de l'information contenue ainsi qu'une pleine et complète capacité d'interagir avec le site. * Source : starling access service

37 Accessibilité du Web L ’accessibilité du Web inclut :
l’accès au site (page d ’accueil) la navigation (menus) l’accès à l ’ensemble des informations l’accès aux fonctions interactives (formulaires...) 33

38 Les acteurs de l'accessibilité dans le monde
Les recommandations et les outils du W3C/WAI * Aux USA : lois ADA section 508  les pages Web publiées par les agences fédérales (= service public), doivent être accessibles aux personnes handicapées. Jurisprudence du 08/09/2006 : les sites commerciaux en ligne doivent également être accessibles (conformité aux lois ADA) ** * Consortium - Web Accessibility Initiative - ** businesses-must-comply-with-ada-mindshare-interactive-campaigns-advises- accessibility-audits/ 34

39 Les acteurs de l'accessibilité dans le monde
En Europe : plans e-europe 2002, 2005, i-Europe 2010 (e-inclusion – "a European society for all") - système européen de labellisation des sites à l'étude * En France : gouvernement, INRIA, Braillenet ... *

40 En Europe : schéma d'harmonisation à fin 2006
Les sites publics doivent être accessibles. Les règles à appliquer sont celles du W3C/WAI (WCAG 1.0 niveau AA) La méthode d’évaluation à utiliser à terme est UWEM (UWEM 1.0 actuellement) La mise en place d’un mode de contrôle (certification suivant le CEN Workshop - COMITÉ EUROPÉEN DE NORMALISATION)  propose une Marque de Qualité pour l'accessibilité du Web Les législations nationales doivent intégrer cette obligation d’accessibilité

41 Le cadre légal en France
Loi n° du 11 février 2005 pour l'égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées : … les recommandations internationales pour l'accessibilité de l'internet doivent être appliquées pour les services de communication publique en ligne …

42 L’accessibilité : intérêt financier
Pour des raisons financières Un marché qui ne cesse de croître (handicap – vieillissement) : pouvoir d'achat globalement important Un site plus accessible est souvent plus utilisable pour tous les internautes et donc plus rentable Meilleur référencement des sites accessibles par les moteurs de recherche …/… 35

43 L’accessibilité : intérêt financier
Coûts de production réduits : gain en temps de développement (après initiation des développeurs) Mise à jour des sites beaucoup plus rapide Gain en bande passante et stockage (jusqu'à 50% pour une page) Gains (estimés) qu'on peut attendre d'un respect des standards : 20 à 25%. Source : Braillenet - IBM : "The benefit of deploying Accessibility Standards for a Corporate Intranet: the IBM experience" :

44 L’accessibilité : les seniors de plus en plus nombreux
50 ans et plus : de 23% en à 49% en 2050

45 L’accessibilité : raisons éthiques et légales
Pour des raisons éthiques l'exclusion d'un grand nombre de nos concitoyens du fait de leur handicap est inacceptable Pour des raisons légales la loi imposera de plus en plus le respect des règles en matière d'accessibilité 36

46 L’accessibilité : accompagner l'évolution technologique
Pour participer à l’évolution technologique développement de l'Internet mobile, multimodalité, interfaces adaptables et adaptatives  développement de technologies favorables à l'accessibilité 37

47 L’accessibilité : les idées fausses
Un site accessible est en mode texte, esthétiquement laid et dépassé technologiquement : faux ! l'aspect visuel n'est pas impacté par la mise en conformité avec les règles en matière d'accessibilité (sauf si contraire aux règles ergonomiques applicables à tous) Voir l'exemple ci-après d'un site en "Flash" accessible : 38

48 Site en Flash accessible
39

49 L’accessibilité : les idées fausses
Un site accessible est seulement utile aux handicapés : c'est faux ! Un site accessible est utile à tous car c'est un site : bien conçu, dont la navigation est simple et cohérente, dont l'accès à l'information est facile dont le codage est respectueux des standards HTML Une recherche menée en UK en coopération avec la Disability Rights Commission montre que les visiteurs (handicapés ou non) passent 35% moins de temps à naviguer sur des sites accessibles.

50 Résumé des avantages de l'accessibilité
Respect de tous les visiteurs Assurance d'un rendu conforme Facilité de maintenance Coûts de la maintenance réduits Possibilité de reprendre le code par n'importe qui Pérennité du site Non assujettissement à des technologies propriétaires Le site reste visible quelque soit l'outil de navigation utilisé L'aspect du site est simple et rapide à modifier Le visiteur s'approprie plus facilement le site Source :

51 Sites label d'or accessiweb *
* Centre de ressources et de recherche sur l'accessibilité du Web

52 Comment rendre les sites accessibles ? Recommandations

53 Que devons-nous faire ? Comment ?
Prise en compte de l’accessibilité à tous les stades de développement Des recommandations sont disponibles Des outils sont disponibles 41

54 Comment rendre les sites accessibles ?
En permettant une transformation élégante des pages : aucune perte d’information en cas de changement d’environnement (O.S., résolution écran...) toute information doit être disponible sous forme de texte (sous-titrage des vidéos…). les pages Web doivent pouvoir être interprétées par divers appareils (PDA …) 42

55 Recommandations générales
Respecter les standards du W3C pas de balises propriétaires (layers …) ne pas détourner les éléments HTML de leur utilisation initiale (ex: H1) Remarque : IE est trop permissif et accepte du HTML incorrect et des balises non standards => problèmes pour certains navigateurs textuels Utiliser XHTML pour les nouveaux sites (DTD de XML, balisage HTML) 43

56 Recommandations générales
Utiliser les feuilles de style (CSS pour HTML / XHTML ou XSL pour XHTML) Séparer le contenu et la présentation Si la transformation élégante n’est pas possible (et seulement dans ce cas), faire une version texte du site 44

57 Recommandations générales
Organisation : clarté - simplicité - cohérence Navigation : fournir des mécanismes Contenu : ne pas surcharger les pages (Voir cours sur l’ergonomie du Web) 45

58 Recommandations générales : critères du W3C
Perceptible : s'assurer que le contenu puisse être perçu par tout utilisateur (problème des images sans équivalent textuel ...) Utilisable : s'assurer que les éléments d'interface du contenu soient utilisables par tout utilisateur (utilisation de la souris impossible pour D.V., tableaux mal balisés ...)

59 Recommandations générales : critères du W3C
Compréhensible : rendre le contenu et les contrôles compréhensibles par autant d'utilisateurs que possible (indiquer les changements de langue pour les utilisateurs de synthèse vocale ...) Robuste : utiliser des technologies Web qui maximisent la capacité du contenu à fonctionner avec les technologies d'adaptation et les navigateurs actuels et futurs (respect des normes et standards).

60 Exemples de mécanismes d'accessibilité
Moteur de recherche interne Attribut alt sur le logo et lien retour à la page d'accueil Repères de navigation

61 Exemple d'attribut d'accessibilité : "alt" sur le logo
<img src="/images/SIT_BDEOLAS/logo_BD.gif" alt="Retour à l'accueil du site Business & Decision Interactive Eolas."> L'attribut "alt" est lu par le lecteur d'écran

62 TP recommandations Recherche de recommandations pour rendre le Web accessible aux déficients visuels : W3C / WAI : Accessiweb : ... Distinguer les recommandations aveugles et malvoyants Les justifier Les classer par ordre de priorité Les catégoriser par type de "barrière"ou faites une proposition pour les catégoriser (on fonction de critères ergonomiques … ?)

63 FIN partie 1