En ergonomie web, l’utilisateur est au centre du graphisme. L’infographiste doit s’adapter au public cible en produisant des interfaces utilisables, confortables.
L’utilisateur humain (je ne suis pas sûr que les animaux aient les mêmes habitudes) sait exactement, avant même d’avoir la page affichée, comment naviguer sur ses sites préférés. Il s’est créé une habitude de navigation.
La conception d’une page web
Une page web « classique » est constituée de plusieurs éléments :
- Une entête de page (header) constituée :
- d’un logo
- d’un menu de site
- d’une barre de recherche
- d’une zone utilisateur (connexion, infos…)
- Un contenu central
- Une zone de menu vertical
- Un pied de page (footer) composé :
- d’un plan de site
- d’informations légales
- d’un bouton de contact
- d’une FAQ
Pour concevoir une page web, l’infographiste doit placer ces éléments de façon logique.
En effet, si le logo était placé dans le pied de page, il serait difficile d’identifier le site !
Les habitudes utilisateur
Navigation en « F »
Initiéepar les moteurs de recherche (surtout par Google) : ici une technique d’examen de page web (google.fr), l’eye-tracking (des capteurs sont placés devant les yeux et analysent les mouvement rétiniens oculaires)
La vue est d’abord dirigée vers le texte recherché, puis sur le premier résultat, et continue sur la suite de la page, en perdant un peu d’importance.
Les habitudes
Chaque utilisateur, quel que soit son âge, son expérience, s’est créé des habitudes de navigation (je pourrais citer l’exemple de la grand mère qui sait utiliser sa messagerie web, mais seulement sa messagerie).
Pour réaliser une maquette, il est nécessaire de respecter des principes de bases, sans quoi ça pourrait être dangereux pour la planète utilisateur !
Lorsque j’aborde ce sujet dans mes ateliers, j’ai souvent des réponses assez précises :
- Où placez vous le logo?
- En haut à gauche ! (avec un regard d’étonnement)
- Où placez vous le pied de page ? (question bête, oui)
- Euh… en bas de page ! (avec un regard de « ouais c’est bon, on est pas débiles »)
- La recherche, en haut, en bas ?
- En haut bien évidemment ! (avec un regard de « tu en fais une de plus et on te casse les genoux »)
Ces placements vous paraissent logiques ? Vous êtes un utilisateur normal (ouf).
Imaginez maintenant que le logo soit en bas de page, la barre de recherche dans le pied de page, et le contenu dans le coin supérieur gauche… Dur ?
Il n’y a pas de secret, pour produire une expérience utilisateur parfaite, il faut respecter un minimum ces principes… Sinon vos utilisateurs seront perdus !
Très mauvais exemple du site de support HP (ancienne génération) :
Je précise avant tout que je n’ai rien contre HP, juste contre l’auteur de cette page…
- Le logo est mal placé
- Le bandeau supérieur (pour accepter les cookies) est illisible et beaucoup trop riche en contenu
- Les liens de menu gauche sont très serrés, et difficilement cliquables
- La partie abonnement est mal identifiée
- Et j’en passe
En bref : le défi pour réaliser vos maquettes est d’allier innovation graphique et habitudes des utilisateurs. C’est un réel challenge que je relève au quotidien ! Je vous donnerais bien quelques astuces, mais je dévoilerais mes talents inégalés… (les chevilles qui gonflent)
Un site web respectant les habitudes de navigation ne bouleversera pas l’utilisateur. Il aura la sensation de maîtriser l’outil, et en profitera plus souvent. Vous êtes gagnant aussi vous voyez
Pour finir avec humour : tous les utilisateurs ne sont pas des grands mères folles de PPT musicaux, mais il ne faut pas non plus prendre vos visiteurs pour des devins ! Aidez les à naviguer sur votre page web !