La présentation donnée par Laetitia Giannettini lors de la causerie du jeudi 21 juin 2012

1. Ergonomie 21 juin 2012
& accessibilité web Laetitia Giannettini
giannettini@telono.com
> L’accès au contenu web
Telono SA
telono.com
22/06/2012 slide 1 v1.0

2. Ergonomie
Etude scientifique de la relation entre l'homme et ses
moyens, méthodes et milieux de travail
et l'application de ces connaissances à la conception
de systèmes qui puissent être utilisés avec le
maximum de confort, de sécurité et
d'efficacité par le plus grand nombre
22/06/2012 slide 2 v1.0

3. Evolution vers l’ergonomie du web
Historique
Existe depuis le début du XXe siècle
Ergonomie et physiologie
Ergonomie et psychologie
Ergonomie cognitive
Ergonomie informatique ou ergonomie de l’Interaction
Homme-Machine (IHM)
Ergonomie des sites et applications web
22/06/2012 slide 3 v1.0

4. Ergonomie web
Adapter l’interface utilisateur web aux
caractéristiques des personnes qui l’utilisent :
• rechercher l’adéquation entre les utilisateurs (logique,
besoin, modèle mental) et celle du système (contexte
d’utilisation)
• diminuer l’écart entre le prescrit (procédures,
fonctionnements officiels) et l’activité réelle (stratégies
réellement mise en œuvre par les gens pour réaliser la
tâche demandée)
22/06/2012 slide 4 v1.0

5. Accessibilité
L’accessibilité est un terme principalement relatif au
monde du handicap utilisé pour désigner l'accès aux
domaines :
Physique
Educatif
Civique
Culturel
Travail
Numérique : accès aux outils/services informatiques
Accessibilité du contenu web
22/06/2012 slide 5 v1.0

6. Accessibilité web
« 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 Berner-Lee (Fondateur du W3C)
22/06/2012 slide 6 v1.0

7. Accessibilité et ergonomie web
2 disciplines différentes qui font appel à des
connaissances et compétences distinctes mais qui
convergent et partagent une philosophie commune :
Faciliter l’accès à l’information et aux
services rendus par le web pour les
différents profils d’utilisateurs
potentiels
22/06/2012 slide 7 v1.0

8. Catastrophe ergonomique et/ou
d’accessibilité sur le web
Quelques illustrations de non adéquation entre les
caractéristiques des utilisateurs et celles du
système
22/06/2012 slide 8 v1.0

9. Acheter un billet de train
22/06/2012 slide 9 v1.0

10. Accéder aux informations contenues dans une vidéo
http://www.youtube.com/watch?v=EgSrZ-s3MTY
22/06/2012 slide 10 v1.0

11. Accéder aux informations contenues dans une vidéo
Exemple des conférence TED : philosophie d’accés à l’information et à la
connaissance par tous dans le monde entier
22/06/2012 slide 11 v1.0

12. Accéder aux informations contenues dans une vidéo
Exemple des conférence TED : philosophie de l’accés à l’information et à
la connaissance par tous dans le monde entier
22/06/2012 slide 12 v1.0

13. Surfer sans souris
La navigation au clavier peut s’avérer fastidieuse
L’ajout de liens type “accéder directement au contenu”, “Aller au menu principal” facilite la
navigation pour les personnes qui naviguent avec leur clavier :
22/06/2012 slide 13 v1.0

14. Surfer avec un lecteur d’écran ou synthèse vocale
L’indication dans le code html des différents niveaux de titres dans une
page web permet aux utilisateurs d’un lecteur d’écran de pouvoir eux
aussi “voir” la structure de la page
22/06/2012 slide 14 v1.0

15. Surfer avec un lecteur d’écran ou synthèse vocale
CAPTCHA : accès au débat interdit aux non-voyants
Exemple de
solutions
alternatives:
• ajout de Captcha
sonore
22/06/2012 slide 15 v1.0

16. Surfer avec un lecteur d’écran ou synthèse vocale
Pour rendre un formulaire “visible” :
lier dans la structure html le libellé du champ avec le champ de saisie
Donner le rôle de bouton au bouton !
Situation Situation
voyant Non voyant
22/06/2012 slide 16 v1.0

17. Qui bénéficie de l’accessibilité du contenu web ?
Tous les utilisateurs du web !
nous sommes tous à un moment ou un autre en
situation d’handicap
connexion lente ou consultation en situation de
mobilité dans environnement bruyant ou autre
défi de l’augmentation du nombre de personnes
âgées (problème grandissant de vision ou de
motricité)
Meilleure valorisation du contenu web
meilleure diffusion de ce contenu par d’autres,
sous d’autres formes
22/06/2012 slide 17 v1.0

18. Ergonomie et accessibilité web :
un éternel renouveau
Aujourd’hui meilleure prise de conscience et
compréhension des problèmes d’utilisation et d’accès
à l’information du web
Mais encore beaucoup à faire pour implémenter et
rendre durable l’accessibilité du contenu web à
grande échelle !
22/06/2012 slide 18 v1.0

19. Pour aller plus loin…
…dans l’indépendance et l’autonomie
se déplacer (voir à partir de la minute 7:38)
http://www.youtube.com/watch?v=NnQ3Kc3PIjM
communiquer
Application iPad assistiveWare :
http://www.youtube.com/watch?v=-xuUWxIY7SM
Projet EasySMS avec l’EPFL (Ecole Polytechnique Fédérale de Lausanne) :
http://design.epfl.ch/easysms/blog/texting4all/Our_vid
eos.html
22/06/2012 slide 19 v1.0

20. 21 juin 2012
Laetitia Giannettini
Merci de votre attention! giannettini@telono.com
Telono SA
telono.com
22/06/2012 slide 20 v1.0