Les principes de bases de l'ergonomie web : la notion de contexte

En ergonomie web, le principe de contexte pourrait se définir par limiter l’activité des utilisateurs à un contexte donné, soigneusement délimité, à moins d’avoir de très bonnes raisons de faire le contraire. Le principe de contexte renvoie donc à la manière dont le site interagit avec l’utilisateur.

La notion de contexte repose sur la règle essentielle selon laquelle l’utilisateur doit à tout moment savoir qui il est, où il se trouve, d’où il vient, et où il va. Cela passe par un grand nombre d’éléments visuels récurrents, aisément reconnaissables, et fonction des univers ou des thématiques visités.

L’utilisateur doit savoir à tout moment qui il est…

Votre utilisateur doit savoir à tout moment qu’il est authentifié, et sous quel nom. Amazon propose une identification visuelle très forte du contexte utilisateur. La possibilité de changer en cas d’erreur, Vous n’êtes pas Frédéric est beaucoup plus efficace qu’un simple bouton “logout”.

Zone d'identification d'un utiisateur authentifié chez Amazon

Au contraire, un utilisateur qui ne serait pas encore authentifié se voit invité à le faire, et à créer un compte le cas échéant.

alt="Zone

… savoir où il se trouve

Un utilisateur doit savoir à tout moment où il se trouve sur votre site. Cela passe à la fois par une indication précise de son emplacement, et par des indications plus générales liées au contexte.

Perdu sur Internet ?

Le fil d’Ariane

Le fil d’Ariane est également très important. Il renseigne en effet vos utilisateurs sur l’endroit où ils se trouvent, d’où ils viennent, et dans quel contexte ils se trouvent.

Ainsi, 3 exemples de fil d’Ariane, fonction du contexte de lecture d’une note, selon qu’on y accède directement,

Fil d'Ariane dans le contexte d'accès direct

dans le contexte de la catégorie Web 2.0,

Fil d'Ariane dans le contexte de catégorie

ou dans celui du tag twitter

Fil d'Ariane dans le contexte de tag

Cet exemple, au passage, est symptomatique de ce qu’il ne faut pas faire (sic). À moins de proposer, par exemple, des contenus liés ou des statistiques spécifiques, je n’ai pas vraiment de raisons valables de présenter un même article dans 3 contextes différents. C’est au contraire plus difficile à appréhender pour l’utilisateur, là où l’on se doit de chercher la simplicité.

L’identité visuelle par univers

En identifiant chaque univers thématique par une couleur dominante, vous aidez vos utilisateur à savoir où ils se trouvent. Le changement de couleur les alerte également, les avertissant qu’ils sortent d’un univers pour entrer dans un autre.

Le journal Le Monde a récemment donné une identité forte à sa rubrique sportive, organisée autour d’une frise chronologique des événements à venir, allant ainsi bien au delà d’une simple couleur dominante.

Univers sportif du Monde

La navigation

Navigation et sous navigation doivent également être mises à profit afin d’indiquer à un utilisateur où il se trouve. Cependant, ce signal visuel doit être accompagné d’un autre, par exemple le fil d’Ariane, afin de ne pas pénaliser les déficients visuels.

Le site de vente en ligne Darty met en avant l’univers visité dans la navigation. Malheureusement, cette information est complètement diluée par la présence d’éléments utilisant le même code couleur dans les zones immédiatement adjacentes : la recherche, et la promotion de la commande produit par téléphone.

Navigation chez Darty

… savoir d’où il vient et où il va

Le fil d’Ariane, que nous avons rapidement vu plus haut permet à un visiteur de savoir où il se trouve et d’où il vient. Il lui permet également de remonter dans la hiérarchie du site, en fonction du contexte.

Les sites d’e-commerce l’ont bien compris, dès qu’un processus nécessite plusieurs étapes, il faut indiquer à l’utilisateur à la fois combien il lui en reste, quelles sont les étapes en souffrance, et où en est exactement.

Le site de la Fnac indique de manière simple et précise quelles sont les étapes permettant de valider l’acte d’achat.

Chemin de validation de l'acte d'achat

Il propose également pour chaque écran la possibilité d’avancer dans le processus ou de revenir en arrière.

Retour en arrière dans le processus d'achat de la Fnac

Et voilà, c’est tout pour ce premier article consacré aux grandes notions fondamentales de l’ergonomie web. La prochaine fois, nous étudierons la notion d’accompagnement.

Publié le 10 novembre 2009 à 23h43 Publié sous Ergonomie web et logicielle

Mots clés utilisabilité, liste

Si cet article vous a plu, n'hésitez pas à me suivre sur Twitter.

7 commentaires sur Les principes de bases de l'ergonomie web : la notion de contexte »

Par AlSquire le 11 novembre 2009 à 00h45 :

Allez, j’ose : http://perdu.dans.ton-an.us/
Par Thomas le 11 novembre 2009 à 12h12 :

“Vous n’êtes pas Frédéric” est beaucoup plus efficace qu’un simple bouton “logout”. Je ne suis pas d accord, le choix des mots est pour moi important, .. si je suis Frédéric et que je veux simplement être déconnecter (arrêter d’être suivi, ficher, fliquer, reconnu .. ) le bouton “je ne suis pas Frédéric” est perturbant, même si il est compréhensible. A part si je me connect avec un autre ordinateur que le mien ou que je partage l’ordinateur avec d’autres, il y’a de forte chance que “je sois Frérdéric”, cette énoncé à des chance d’être faux dans la plupart des cas. Il est de mon point de vue pas adapter. Une traduction française “se déconnecter”, me semble plus clair. Cordialement,
Par brougjrzjej le 11 novembre 2009 à 12h28 :

Le dernier point me parait très important.

Donner le maximum d’informations est très important également. Combien de fois j’ai abandonné un site parce qu’il ne me permettait pas de savoir clairement le montant des frais de port par exemple. Obligé de s’inscrire pour le faire? La flemme –> au revoir.
Par Pierre le 11 novembre 2009 à 15h10 :

Le fait d’avoir une dominante par thématique apporte un vrai plus en terme de sécurité pour l’internaute. Il sait où il se trouve sur le site !

Merci pour cet article de qualité (comme toujours)

Pierre
Par Juste Le Zeste le 11 novembre 2009 à 22h24 :

Bjr, cela rejoint et prolonge l’article trouvé ici : http://tinyurl.com/ygnfshg. Le parcours client est le parent pauvre de la réflexion autour d’un projet web alors qu’il devrait être au centre…
Par AQC le 15 novembre 2009 à 18h25 :

Quelques bons conseils aussi sur mon blog http://aqc.com/ concernant l’érgonomie, dans les 3 ou 4 premiers articles ;)
Par Nicolas Hoizey le 26 novembre 2009 à 08h15 :

Pareil que Thomas, Amazon a fait à mon avis preuve d’une mauvaise bonne idée avec son « je ne suis pas untel », surtout sur l’intitulé, puisque les autres services aussi essaient de reconnaître leurs utilisateurs pour leur proposer tout de suite des produits/contenus pertinents…