Il vous est certainement déjà arrivé de vous rendre sur un site internet sur lequel ne trouvez pas les informations que vous cherchez facilement, jusqu’à en être agacé et finir par refermer la page. C’est pour éviter cela et dans un soucis d’améliorer les futurs sites internet que l’on s’interroge sur ce qui fonctionne et ne fonctionne pas dans la lecture d’une page web.
Comment optimiser la mise en page de votre site internet ?
Depuis peu utilisée en marketing, une méthode permet d’analyser le suivi du regard afin d’optimiser le contenu d’une page web : l’Eye-Tracking, aussi appelé oculométrie en français. Cette méthode permet de mieux comprendre pour le marketing ce qui motive ou rebute les utilisateurs. Issue de l’ophtalmologie et des sciences cognitives, cette méthode permet d’analyser l’activité oculaire d’une personne en réalisant un suivi de son regard. Cela permet de savoir avec précision où regarde l’utilisateur, ce qu’il voit et ce qu’il ne voit pas.

L’Eye-tracking a permis de révéler que les déplacements du regard sur une page internet sont fortement influencés par l’agencement et la mise en page des informations. De plus, – et contrairement à ce que l’on pourrait croire – notre regard éviterait toutes les zones qui s’apparentent à des bannières publicitaires : animées ou non, les zones publicitaires ne seraient généralement pas fixées par les internautes, qu’elles soient disposées sur les parties latérales ou en haut de page d’un site web. Ainsi la publicité tend à disparaitre sur les sites web : les utilisateurs ont des objectifs pour visiter un site et s’intéressent à son contenu, ils ne se laissent plus distraire par la publicité.
Des tests d’Eye-tracking sont réalisés sur des participants : généralement ils se déroulent dans un laboratoire d’études cognitives. L’Eye-tracker est un écran d’ordinateur sur lequel sont placées des diodes qui émettent de la lumière infrarouge (inoffensive pour l’œil). Des caméras intégrées dans l’écran filment à distance la réflexion de la lumière infrarouge sur les pupilles du participant afin d’identifier les zones qu’il observe. Afin d’analyser en détail le comportement des internautes, ces données sont alors calculées par « zones d’intérêts » : temps de regard, sens de lecture, nombre de regards, ordre de découverte, etc.
Il a aussi été remarqué que les utilisateurs on tendance lorsqu’ils « scannent » une page à effectuer tous les même mouvement de balayage en F comme on peut le voir avec l’illustration ci-contre. Cela se remarque particulièrement sur les pages de résultats de recherche où les informations sont présentées sous forme de blocs de texte superposés : les déplacements du regard ont tendance à composer deux bandes horizontales suivies d’une bande verticale. L’internaute commence par lire le haut du premier contenu (première barre horizontale du F), il descend ensuite dans la page, repère un point d’intérêt et lit un second passage, généralement plus court que le premier (la deuxième barre horizontale) puis il finit de scanner verticalement la page (barre verticale du F).

Le balayage visuel en F illustré avec la carte de chaleur (Expérience : « F-Shaped Pattern For Reading Web Content »)
Cette méthode permet de mettre en avant l’importance d’une mise en page bien pensée. Quelques règles ressortent de ces observations afin de concevoir un site web ergonomique :
- Positionnez votre logo en haut à gauche de votre page web
- Positionnez les contenus importants dans la partie gauche de la page.
- La barre de navigation doit être placée idéalement à l’horizontal, au dessus des contenus de votre site (textes, images, vidéos…)
- Lorsque vous rédigez des textes et insérez des images dans vos pages, pensez au parcours de l’oeil en F afin d’améliorer leur lisibilité.
- Il faut savoir que les deux premiers paragraphes sont les plus importants, il est inutile de charger votre page de textes qui auront peu de chance d’être lus.
- Mettez en évidence les informations pratiques de type numéro de téléphone, adresse et horaires d’ouverture si vous en avez.
- Ne mettez pas d’images trop « lourdes » afin que la page charge rapidement.
En conclusion, pour créer un site web attrayant, il vaut mieux simplifier la navigation en privilégiant une mise en page et un design sobre et épuré, tout en respectant le sens de lecture en F de gauche à droite. À vous de jouer !