Ergonomie – Notes de cours
IMR2 – 2012-2013
Référence : Ergonomie web, pour des sites web efficaces
Amélie Boucher, Éditions Eyrolles
ERGONOMIE
NOTES DE COURS
LES 12 RÈGLES DE L’ERGONOMIE WEB
1. ARCHITECTURE : LE SITE EST BIEN RANGÉ
Les regroupements sont logiques
La structuration met en avant les contenus clés
Les menus aident l’internaute à naviguer dans les contenus
Contourner un site mal rangé
2. ORGANISATION VISUELLE : LA PAGE EST
BIEN RANGÉE
Eviter le trop-plein d’information
 Réduire la quantité de mots sur les pages
navigantes
 N’afficher que les principaux éléments de
navigation et d’interaction
 Différencier les quantités d’informations réelles et
perçues
 Démultiplier la valeur du pixel carré
 La question de la publicité
Optimiser l’organisation et la hiérarchisation visuelle
3. COHÉRENCE : LE SITE CAPITALISE SUR
L’APPRENTISSAGE INTERNE
Les localisations sont cohérentes
Les appellations sont cohérentes
Les formats de présentation sont cohérents
Les interactions sur cohérentes
4. CONVENTIONS : LE SITE CAPITALISE SUR
L’APPRENTISSAGE EXTERNE
Qu’est-ce qu’une convention ?
Respecter les conventions de localisation
Respecter les conventions de vocabulaire
Respecter les conventions d’interaction et de présentation
5. INFORMATION : LE SITE INFORME
L’INTERNAUTE ET LUI RÉPOND
L’ordinateur informe et prévient l’internaute
 Ne soyez pas avare d’informations
 Informez, mais au bon moment
 Informez pour augmenter votre force persuasive
L’ordinateur répond aux actions de l’internaute
 Donner du feedback aux actions de l’internaute
 Visibilité du feedback
6. COMPRÉHENSION : LES MOTS ET SYMBOLES
SONT CHOISIS MINUTIEUSEMENT
La bonne utilisation des mots sur le web
 Utilisez le vocabulaire !
 Le vocabulaire doit être compréhensible
 Le vocabulaire doit être concis
Les symboles et codes doivent être compréhensibles
7. ASSISTANCE : LE SITE AIDE ET DIRIGE
L’INTERNAUTE
Dirigez grâce à l’organisation et à la visibilité
Dirigez grâce aux affordances
 Les affordances permettent de repérer ce qui est
cliquable
 Les affordances permettent de repérer ce qui est
utilisable
Hiérarchisez vos call-to-action
Attention à ne pas diriger de façon erronée
Eviter d’avoir à diriger grâce à un modèle d’interaction
adapté
Assistez votre internaute en tenant compte de ses besoins
en termes de tâches
Assistez votre internaute en le suivant de très près
Fournissez de l’aide explicite en cas de besoin
Ergonomie – Notes de cours
IMR2 – 2012-2013
Référence : Ergonomie web, pour des sites web efficaces
Amélie Boucher, Éditions Eyrolles
8. GESTION DES ERREURS : LE SITE PRÉVOIT
QUE L’INTERNAUTE SE TROMPE
L’internaute ne doit pas faire d’erreur
 La présentation du formulaire peut protéger
contre l’erreur
 Le fonctionnement du formulaire peut protéger
contre l’erreur
L’internaute doit facilement repérer et comprendre ses
erreurs
 Faciliter le repérage de l’erreur
 Fournir une explication précise de l’erreur
 Faire preuve de courtoisie dans les messages
d’erreur
L’internaute doit facilement pouvoir corriger ses erreurs
 Faciliter la correction grâce à l’explication de
l’erreur
 Faciliter la correction grâce aux mécanismes de
gestion des erreurs
9. RAPIDITÉ : L’INTERNAUTE NE PERD PAS
SON TEMPS
Faciliter les interactions
 Faciliter l’action de visée des éléments cliquables
 Prendre en compte les besoins de votre internaute
sur le plan fonctionnel
Eviter les actions inutiles
Proposer pour simplifier la tâche
Des modes d’interaction orientés efficience
10. LIBERTÉ : C’EST L’INTERNAUTE QUI
COMMANDE
Respectez les contrôles utilisateurs conventionnels
Fuyez les actions au rollover
Flexibilité des actions utilisateur
Donnez la possibilité à l’internaute de contourner le
système et d’agir dessus
N’induisez pas de comportement passif
Le système n’est pas intrusif
 Le système n’est pas lourd et insistant dans ses
propositions
 Le système ne force pas l’utilisateur à voir
quelque-chose
 Le site n’agit pas à la place de l’internaute
 Au secours, le site prend le contrôle de
l’ordinateur
11. ACCESSIBILITÉ
Accessibilité physique
Accessibilité technologique
 La plateforme de consultation est de l’ordre du
bonus : adaptez le contenu
 La plateforme de consultation est stratégique :
informez et guidez
12. SATISFACTION DE VOTRE INTERNAUTE
Satisfaire grâce au critère d’utilité
Satisfaire grâce à l’esthétique et à l’expérience utilisateur
globale
Satisfaire grâce à la qualité de service
Satisfaire grâce à la puissance et à la fiabilité technique

Ergonomie des IHM web - Notes de cours (2/3)

  • 1.
    Ergonomie – Notesde cours IMR2 – 2012-2013 Référence : Ergonomie web, pour des sites web efficaces Amélie Boucher, Éditions Eyrolles ERGONOMIE NOTES DE COURS LES 12 RÈGLES DE L’ERGONOMIE WEB 1. ARCHITECTURE : LE SITE EST BIEN RANGÉ Les regroupements sont logiques La structuration met en avant les contenus clés Les menus aident l’internaute à naviguer dans les contenus Contourner un site mal rangé 2. ORGANISATION VISUELLE : LA PAGE EST BIEN RANGÉE Eviter le trop-plein d’information  Réduire la quantité de mots sur les pages navigantes  N’afficher que les principaux éléments de navigation et d’interaction  Différencier les quantités d’informations réelles et perçues  Démultiplier la valeur du pixel carré  La question de la publicité Optimiser l’organisation et la hiérarchisation visuelle 3. COHÉRENCE : LE SITE CAPITALISE SUR L’APPRENTISSAGE INTERNE Les localisations sont cohérentes Les appellations sont cohérentes Les formats de présentation sont cohérents Les interactions sur cohérentes 4. CONVENTIONS : LE SITE CAPITALISE SUR L’APPRENTISSAGE EXTERNE Qu’est-ce qu’une convention ? Respecter les conventions de localisation Respecter les conventions de vocabulaire Respecter les conventions d’interaction et de présentation 5. INFORMATION : LE SITE INFORME L’INTERNAUTE ET LUI RÉPOND L’ordinateur informe et prévient l’internaute  Ne soyez pas avare d’informations  Informez, mais au bon moment  Informez pour augmenter votre force persuasive L’ordinateur répond aux actions de l’internaute  Donner du feedback aux actions de l’internaute  Visibilité du feedback 6. COMPRÉHENSION : LES MOTS ET SYMBOLES SONT CHOISIS MINUTIEUSEMENT La bonne utilisation des mots sur le web  Utilisez le vocabulaire !  Le vocabulaire doit être compréhensible  Le vocabulaire doit être concis Les symboles et codes doivent être compréhensibles 7. ASSISTANCE : LE SITE AIDE ET DIRIGE L’INTERNAUTE Dirigez grâce à l’organisation et à la visibilité Dirigez grâce aux affordances  Les affordances permettent de repérer ce qui est cliquable  Les affordances permettent de repérer ce qui est utilisable Hiérarchisez vos call-to-action Attention à ne pas diriger de façon erronée Eviter d’avoir à diriger grâce à un modèle d’interaction adapté Assistez votre internaute en tenant compte de ses besoins en termes de tâches Assistez votre internaute en le suivant de très près Fournissez de l’aide explicite en cas de besoin
  • 2.
    Ergonomie – Notesde cours IMR2 – 2012-2013 Référence : Ergonomie web, pour des sites web efficaces Amélie Boucher, Éditions Eyrolles 8. GESTION DES ERREURS : LE SITE PRÉVOIT QUE L’INTERNAUTE SE TROMPE L’internaute ne doit pas faire d’erreur  La présentation du formulaire peut protéger contre l’erreur  Le fonctionnement du formulaire peut protéger contre l’erreur L’internaute doit facilement repérer et comprendre ses erreurs  Faciliter le repérage de l’erreur  Fournir une explication précise de l’erreur  Faire preuve de courtoisie dans les messages d’erreur L’internaute doit facilement pouvoir corriger ses erreurs  Faciliter la correction grâce à l’explication de l’erreur  Faciliter la correction grâce aux mécanismes de gestion des erreurs 9. RAPIDITÉ : L’INTERNAUTE NE PERD PAS SON TEMPS Faciliter les interactions  Faciliter l’action de visée des éléments cliquables  Prendre en compte les besoins de votre internaute sur le plan fonctionnel Eviter les actions inutiles Proposer pour simplifier la tâche Des modes d’interaction orientés efficience 10. LIBERTÉ : C’EST L’INTERNAUTE QUI COMMANDE Respectez les contrôles utilisateurs conventionnels Fuyez les actions au rollover Flexibilité des actions utilisateur Donnez la possibilité à l’internaute de contourner le système et d’agir dessus N’induisez pas de comportement passif Le système n’est pas intrusif  Le système n’est pas lourd et insistant dans ses propositions  Le système ne force pas l’utilisateur à voir quelque-chose  Le site n’agit pas à la place de l’internaute  Au secours, le site prend le contrôle de l’ordinateur 11. ACCESSIBILITÉ Accessibilité physique Accessibilité technologique  La plateforme de consultation est de l’ordre du bonus : adaptez le contenu  La plateforme de consultation est stratégique : informez et guidez 12. SATISFACTION DE VOTRE INTERNAUTE Satisfaire grâce au critère d’utilité Satisfaire grâce à l’esthétique et à l’expérience utilisateur globale Satisfaire grâce à la qualité de service Satisfaire grâce à la puissance et à la fiabilité technique