Les québécois utilisent le mot « butineur » pour désigner le logiciel qui permet aux internautes de parcourir les pages du web. À juste titre d’ailleurs : le comportement des internautes illustre parfaitement ce terme. Avec un nombre quasi-illimité de sites web disponibles, pourquoi l’internaute se forcerait-il à lire un site web qu’il ne trouve pas à son goût alors que mille autres sources d’informations le satisferont peut être plus ?
De nombreuses recherches ont permis de montrer comment les gens se comportent face aux sites web. En voici quelques exemples.
1 seconde pour convaincre
Il y a ce que l’internaute voit et ce qu’il perçoit. Et en moins de 2 dixièmes, l’internaute lambda se forge déjà une première impression. Un peu plus de deux secondes plus tard, l’internaute a « vu » le site dans sa globalité et commence à le parcourir à la recherche de points d’accroche spécifiques.
L’internaute est volage et le bouton précédent facile d’accès : pas vraiment le droit à l’erreur ici. La première impression se doit d’être bonne.
La zone qui obtient le plus d’attention c’est en haut à gauche
Lorsqu’un internaute arrive sur un site, ses yeux se posent d’abord au sommet gauche de la page puis circulent sur la page à partir de ce point. Le contenu le plus important doit donc être placé à cet endroit.
L’oeil parcourt la page web en Z inversé
Nommé diagramme de Gutenberg, le Z inversé est en fait une habitude de lecteur occidental (on lit de gauche à droite) qui s’applique surtout aux textes. L’oeil parcourt donc la page du haut gauche vers le haut droit puis file en diagonale à gauche un peu plus bas pour continuer de nouveau vers la droite et ainsi de suite.
La zone ou l’oeil reste le plus longtemps est la fin du Z en bas à droite. Voir source. C’est ici qu’il convient de placer les appels à l’action.
Les internautes lisent en blocs F ou en triangle d’or
Lorsque l’internaute arrive sur une page web, il ne la lit pas. Il la scanne à la manière d’un F ou d’un triangle. Le contenu est parcouru de gauche à droite puis de gauche jusqu’au milieu puis uniquement à gauche. Et si un bloc de contenu lui semble intéressant, il stoppe et prend le temps de lire le contenu. Voir l’étude de Nielsen.
Au passage, seulement 28% du texte est lu et un tout petit 10% des internautes lisent jusqu’au bout. C’est pour cela que les menus de navigation sont plus efficaces en haut à l’horizontale ou à gauche avec les items empilés verticalement.
Les éléments importants ne doivent donc pas être présentés dans une barre latérale à droite.
Les internautes utilisent la molette de leur souris
Pour qu’un contenu soit lu, il vaut mieux que les internautes défilent la page (cela demande moins d’effort que de cliquer). Confirmé par des tests utilisateurs. Mais cela n’empêche pas d’afficher le contenu le plus intéressant en haut de page et de montrer aux internautes qu’il y a du contenu sous la ligne de flottaison.
Par contre, les contenus courts scindés en plusieurs sous-pages (diaporamas par exemple) ne sont pas bon pour l’utilisabilité (mais ça augmente artificiellement le nombre de pages vues).
Les introductions en gras sont lues. Pas les autres
Dommage pour moi ;-). Si le premier paragraphe est écrit avec une police de caractère plus grosse ou avec une graisse plus importante, alors il sera lu en intégralité. Si le paragraphe est présenté de la même façon que le reste du texte, il risque d’être survolé.
Pour présenter du contenu mobile, point de salut hors d’Apple
Pour montrer le rendu sur un appareil mobile, une photo en situation est souvent utilisée. Et un cliché présentant une tablette ou un appareil photo de marque Apple attire plus l’attention qu’un appareil électronique d’une autre marque. Lien vers la source.
Des photos de qualité avec de vrais gens dedans
- Des personnes « normales » sont meilleures que des photos de stock.
- Des visuels de qualité sont meilleurs que des photo au professionnalisme aléatoire.
- De grandes images percutent plus que de petites miniatures.
La liste ne s’arrête pas à ces 8 points. Les autres feront partie d’articles à venir. Et pour aller plus loin, je conseille l’excellent livre How to Build Websites that Sell: The Scientific Approach to Websites
Très bon article. J’ai appris quelques points importants et fait partie de la moyenne de 10% qui arrive jusqu’en bas de l’article 😉
Très intéressant le conseil qui consiste à mettre le chapeau en gras. C’est en général après le titre la zone qui va faire en sorte que le visiteur continue ou non sa visite.
J’aurais bien voulu voir une étude sur les « sidebar défilante ». Si une sidebar à droite défile tout le long de la lecture, la zone devient forcément plus visible qu’une sidebar fixe qui passe au-dessus de la ligne de flotaison en quelques dizaines de secondes.
L’agence Skeelbox a un test sur les boutons qui suivent le scroll. C’est par ici.
Merci Christophe.
Je vais y jetter un oeil et participer à la discution.
Ah oui en effet très bon article. J’en prend note pour la suite de la rédaction de mes articles. Je suis quand même dans l’ensemble soulagé par ce que je faisais jusqu’à maintenant.
Je suis tout à fait d’accord avec tous ces points mais parfois c’est vraiment impossible à faire ou alors ce n’est pas esthétique. C’est un risque à prendre mais si le site est de qualité et que son objectif, quel qu’il soit est atteint, alors ça peut marcher aussi sans mettre en pratique ces conseils 🙂
Bonjour. Il est également important de ne pas faire de fautes d’orthographe et de grammaire car ça stoppe la lecture même en Z…
Bonjour,
D’accord sur le fond (c’est un préalable nécessaire de bien écrire).