La répartition verticale de l'attention des utilisateurs sur une page Web est relativement simple : plus d'informations sont cachées dans la première moitié du champ de vision que dans la partie inférieure. Examinons maintenant la répartition de l'attention des utilisateurs dans le sens horizontal de la page Web. En utilisant la base de données que nous avons collectée précédemment, il est facile de constater que lorsque les utilisateurs parcourent des pages Web, le poids de la répartition de l'attention de gauche à droite est le suivant :
Dans ce graphique, l'abscisse de chaque article représente 100 pixels, et 100 % de l'ordonnée représente le temps entre le moment où l'utilisateur commence à naviguer depuis l'extrême gauche jusqu'à ce qu'il quitte la page.
Les gens passent plus de deux fois plus de temps du côté gauche que du côté droit, et ils font un choix évident :
La moitié gauche prenait 69 % du temps ; la moitié droite prenait 30 % du temps ;
Le 1% restant du temps de navigation est passé dans les 1024 premiers pixels pouvant être parcourus. Certaines informations ne sont visibles qu'après un défilement horizontal. Ces informations suggèrent que nous devrions corriger la barre horizontale pour éviter le défilement horizontal.
Les informations dont nous parlons ici dans la « colonne inférieure » sont en fait la partie située au-delà de l'écran, sur le côté droit de l'écran, et non littéralement « en dessous ». D'un autre côté, si vous comparez la navigation horizontale et verticale, les utilisateurs dans le sens vertical ignoreront environ 20 % des informations, tandis que dans le sens horizontal, ils n'ignoreront qu'environ 1 % des informations. (Je pense avoir dit jusqu'à vingt fois que la molette de défilement horizontale est terrible car elle ennuie vraiment les utilisateurs et attire moins l'attention.)
Notre étude a utilisé un moniteur 1 024 × 768. Avec un affichage plus grand, nous espérons voir plus de contenu à droite avec moins de défilement, et il en va de même en mode normal.
La section la plus à gauche comprend généralement une barre de navigation. Il n’est donc pas surprenant qu’elle attire davantage l’attention après 200 pixels, plus les 300 à 500 pixels où elle attire le plus l’attention. Les gens ont tendance à se concentrer dès le début sur la zone de contenu principale de la première ligne.
Sens de lecture de la langue de gauche à droite
Les recherches sur la convivialité que nous avons menées dans les zones où les habitudes de lecture sont de gauche à gauche ont révélé que les gens accordent plus d'attention au début d'une ligne. Évidemment, dans ces langues, le texte commence à droite. Même ainsi, nous ne trouverons pas nécessairement l’implémentation Eyetracking correspondante. Par exemple, l’arabe et l’hébreu ont également les graphiques ci-dessus. (Cela signifie en gros que lorsque l'habitude de lecture d'un pays ou d'une région va de droite à gauche, alors leur graphique de distribution du temps d'attention formera une image miroir du graphique ci-dessus, c'est-à-dire que l'abscisse est écrite de droite à gauche.)
La raison en est que les sites Web dans les langues de lecture de droite à gauche n'ont pas toujours une mise en page de gauche à droite. Voici les mises en page des sites Internet du journal de Dubaï Emarat Al Youm et du journal israélien Haaretz :
Emarat Al Youm est un véritable site Web aligné à droite. Contrairement à cela, Haaretz est un site dont le texte est aligné à droite mais qui possède toujours une barre de navigation à gauche. Par conséquent, cette recherche de suivi oculaire (Eyetracking, permettez-moi de le traduire de cette façon pour l'instant) peut être plus compliquée que notre site Web anglais ordinaire.
Privilégiez la mise en page régulière
Revenant aux langues dans lesquelles nous lisons habituellement de gauche à droite – disons le chinois, l’anglais, le russe ou même le japonais – que signifient nos découvertes ?
En termes simples, respectez une présentation de site Web traditionnelle, car elle correspond parfaitement à la façon dont les gens naviguent sur le Web.
Gardez la navigation cohérente sur la gauche, ce que les gens s'attendent à trouver dans une liste ;
Faites plus attention à la disposition du contenu principal de gauche à droite ;
Le contenu le plus important doit occuper un tiers, voire la moitié de la largeur totale de la page. C’est là que les utilisateurs se concentrent le plus ;
Gardez le contenu secondaire à droite. Cela n’attirera pas beaucoup d’attention, mais c’est suffisant : tous les éléments de contenu ne peuvent pas obtenir une première place et vous avez besoin d’une place pour le contenu moins important.
Il est intéressant de noter que la présentation du site Web présentée dans cette grande image est très similaire à celle des intranets grand public. Mais ce n'est qu'un site Web.
Les modèles de navigation dominants et les mises en page des pages Web ont clairement évolué vers une relation de subordination :
Les gens sont formés à prêter attention à certains endroits car les informations les plus importantes y sont généralement diffusées ;
Actuellement, lorsque les entreprises créent des mises en page de sites Web, leurs informations sont organisées en fonction de la manière dont les utilisateurs répartissent leur attention sur la page.
Si vous vous écartez de la présentation traditionnelle, certains utilisateurs modifieront leurs habitudes d’attention lorsqu’ils parcourront votre site Web. Si vous placez des éléments importants à droite, il se peut que les (moins) utilisateurs de cette zone passent plus de temps à découvrir ces informations que le domaine d'utilisateur typique.
Ce n'est pas comme si l'utilisateur avait décidé à l'avance : "Je vais passer seulement 2,5% de mon temps à regarder de gauche à droite, en regardant 1000 et 1100 pixels pour ce segment".
Quoi qu’il en soit, le prix à payer pour s’écarter du design traditionnel est le suivant : lorsque les utilisateurs parcourent votre page pour la première fois, ils passeront beaucoup de temps à chercher ce dont ils ont besoin.
Si la mise en page de votre page Web répond aux besoins de navigation de l'utilisateur, plutôt que d'être placée dans un emplacement non traditionnel, il peut trouver facilement des informations et accomplir ce qu'il veut sans s'en rendre compte.
Et lorsque votre site Web est quelque chose que les utilisateurs tiennent pour acquis, votre entreprise fonctionnera plus facilement.