Comment utiliser les Heatmaps pour améliorer votre UX et votre stratégie SEO

Les heatmaps sont des outils essentiels pour comprendre comment les utilisateurs interagissent avec votre site, voici comment améliorer votre SEO et votre UX grâce à ces données.

Les heatmaps ou « cartes de chaleur » permettent de voir ce qu’on ne peut normalement pas voir sur un site internet : le comportement des visiteurs. Comment les utilisateurs interagissent avec mon site ou mon application ? Quelle partie les intéresse particulièrement ? Quelles difficultés rencontrent-ils ?

Les données issues de ces outils sont très importantes en marketing digital, pour améliorer l’expérience utilisateur (UX) évidemment, mais aussi votre stratégie de référencement naturel (SEO).

Qu’est-ce qu’une Heatmap ?

Une heatmap est un outil de représentation visuelle des zones de chaleur d’un site, qui est possible grâce à l’installation de trackers permettant à l’outil d’analyser et d’interpréter les comportements des visiteurs sur une page.

Généralement, les trackers suivent le curseur de la souris sur ordinateur, les touchers d’écran tactile sur mobile, et parfois aussi les yeux (grâce à des systèmes plus évolués avec des caméras).

Elle se décompose souvent en trois parties :

  • Click maps (ou carte de clics) : donne les zones les plus cliquées sur un site, que ce soit un bouton, un lien, la barre de navigation, un logo, une image… Ou parfois juste une zone vide.
  • Hover maps (ou carte de survol) : donne les zones où les utilisateurs déplacent leur curseur sur la page, les zones les plus « chaudes » étant celles où les visiteurs s’arrêtent le plus souvent.
  • Scroll maps (ou carte de défilement) : montre jusqu’où les visiteurs font défiler le contenu avant de quitter la page.

Pour chacune de ces cartes, l’outil d’heatmap va afficher des zones de couleur allant le plus souvent du bleu (zone froide, peu utilisée) au rouge (zone chaude).

 

Maintenant que nous savons en quoi consiste une heat map, comment l’utiliser pour son SEO ?

1- Mieux comprendre l’intention utilisateur

L’heatmap peut vous permettre de mieux comprendre quelles parties de votre page sont les plus consultées. Quel type de contenu intéresse vos visiteurs, quelle partie du site est scrollée sans trop d’attention, à quel niveau de la page vos utilisateurs quittent le site ?

Vous pouvez aussi analyser les clics dans le menu, les filtres utilisés en e-commerce…

Toutes ces données vous permettront de connaître les sujets qui intéressent le plus votre audience, pour créer de nouvelles pages dédiées, une landing page ou un article de blog.

Vous pouvez aussi découvrir de nouvelles opportunités de mots clés pour vos campagnes PPC.

2- Optimiser votre mise en page

La structure d’une page est souvent définie avec les bonnes pratiques de web design actuelles et avec son meilleur jugement.

Il y a bien évidemment des éléments essentiels comme les titres (H2, H3…), les séparateurs, les espaces blancs. Mais il y a des centaines de facteurs qui contribuent à une excellente expérience utilisateur.

Web Design : Les Tendances pour 2020

Le web design évolue constamment, pour s'adapter aux utilisateurs et aux tendances digitales. Préparez votre site pour l'année prochaine avec les 4...

La heatmap permet de comprendre comment les utilisateurs interagissent avec vos éléments on-page comme les boutons CTA, et les éléments qui apportent des frictions (gênes dans le parcours utilisateur).

Par exemple cette image montre à gauche que la bannière publicitaire (secondary CTA) apporte une distraction et limite les validations du panier (main CTA). Sur celle de droite, on voit que l’échange entre les deux amènent plus de clics sur le bouton principal et ainsi plus de conversions.

heatmap de comparaison entre deux structure de page de validation de commande

Heatmap de comparaison des clics entre deux structure de page de validation de commande – Source : SEJ

Autre exemple, cette fois avec du eye-tracking, sur la bonne utilisation d’une image pour améliorer les conversions.

Une étude a comparé les heatmaps de deux landing pages qui partagent le même contenu, à part l’image d’illustration.

Dans la première version, le bébé regarde directement l’utilisateur, faisant de son visage l’élément le plus regardé de la page, au détriment du contenu principal.

heatmap d'une landing page avec image d'un bébé regardant le visiteur

Dans la seconde version, le bébé regarde le contenu textuel, ce qui amène les utilisateurs à faire plus attention au message de l’offre de la landing page.

heatmap d'une landing page avec image d'un bébé regardant le contenu

Les clics dans des zones non cliquables peuvent aussi indiquer qu’il y a un problème avec ces éléments, pareil pour les « hover » trop long sur des zones sans action.

3- Déterminer la longueur optimale de vos pages

Google a répété récemment qu’une page avec de nombreux mots ne voulait pas forcément dire qu’elle serait mieux positionné dans les résultats de recherche. Encore une fois tout dépend de l’intention de recherche.

Vous devez donner la réponse qu’attendent vos visiteurs, pas simplement prendre le plus d’espace possible. Pour savoir si vos pages correspondent aux demandes de vos visiteurs, analysez les scroll heatmaps.

scroll heatmap

Exemple de scroll map – Source : Mouseflow

Vous pourrez voir si vous avez répondu aux besoins de l’utilisateur dès le haut de page et si le reste du contenu est nécessaire (ou non). Si c’est le cas vous verrez une zone très chaude au-dessus de la ligne de flottaison, puis rapidement une zone froide jusqu’au pied de page.

Ou si vos visiteurs consultent le contenu jusqu’en bas de page, puis quittant la page sans avoir trouvé ce qu’ils cherchent.

La heat map seule ne répondra pas à toutes ces questions, mais elle vous permettra de savoir où les visiteurs quittent en général votre page. Reste alors à savoir ce qu’ils font après : Quittent-ils votre site ? Ont-ils trouvé ce qu’ils veulent sur la page et s’apprêtent-ils à continuer le processus de conversion ?

Pour voir plus loin, il est intéressant de savoir ce que font les concurrents sur une page similaire et de réfléchir à ce qui pourrait améliorer la page.

4- Utiliser Google Analytics en parallèle pour mieux comprendre le « pourquoi » de ces comportements

Google Analytics permet de voir la finalité des comportements sur un site web : le temps passé sur une page, les rebonds, les conversions, les paniers abandonnés… Mais il ne permet souvent pas de comprendre pourquoi les utilisateurs ont ces comportements.

En combinant vos données analytiques et vos heatmaps, vous pouvez en apprendre beaucoup sur l’utilisation de votre site. Par exemple vous pouvez analyser les pages de destination dans vos heatmaps.

Pour cela, rendez-vous sur Google Analytics dans Comportement > Contenu du site > Pages de destination. Analysez ensuite ces pages de destination dans votre outil de heatmap pour comprendre les interactions sur ces pages, et changer ce qui pourrait faire défaut pour ces pages importantes.

Par exemple si vous découvrez que vos landing pages convertissent peu sur Analytics et que la plupart des clics sont en bas de page sur la heat map, c’est que les boutons d’action ou les parties importantes devraient être remontées pour être plus accessibles.

5- Améliorer votre maillage interne

Le maillage interne consiste, vous le savez, à créer des liens entre les différentes pages et donner une structure à votre site. C’est très important en SEO mais aussi en UX, puisque c’est ce qui permet de naviguer de façon pertinente sur votre site.

OK, mais que vient faire la heat map là dedans ?

Tout simplement car en analysant les cartes de clics, vous pourrez voir où les utilisateurs cliquent le plus, et ainsi optimiser le placement de vos liens importants, pour que la hiérarchie des liens soit respectée.

De manière générale, sans analyse, Google privilégie les liens en haut du contenu principal d’une page (menus, barre latérale et footer exclus), il est donc plus logique que les liens internes les plus cruciaux soient au-dessus de ceux qui sont moins essentiels.

Au-delà du SEO pur, vous devez voir ce qu’apporte le lien à l’utilisateur. Il quitte une page à priori pour avancer dans le processus de conversion, ou au minimum accéder à un contenu connexe.

Pensez donc à vérifier la pertinence de vos liens internes, afin qu’ils fassent évoluer l’utilisateur dans le funnel, qui ne le fassent pas sauter des étapes ou passer à une page sans aucun rapport.

Pour déterminer la pertinence, posez-vous ces questions :

  • Combien de temps passe le visiteur sur la nouvelle page ?
  • Jusqu’où scrolle-t-il ?
  • Explore-t-il d’autres contenus ?
  • Est-ce que la session finit avec une action réalisée ?

6- Combiner les heatmaps avec des enquêtes sur votre page

Même si les heatmaps vous permettent de voir pas mal de choses dans le comportement de vos visiteurs, le meilleur moyen de les comprendre reste de directement leur demander.

Pour cela utilisez des enquêtes onpage sur les pages où vos visiteurs rencontrent des problèmes, que vous avez découvertes grâce à un outil de heatmap.

onpage survey hotjar

Exemple d’enquête onpage – Source : Hotjar

Demandez-leur alors par exemple :

  • Comment jugez-vous votre expérience sur cette page ?
  • Avez-vous rencontré un problème en remplissant ce formulaire ?
  • Que changeriez-vous ou rajouteriez-vous sur cette page ?
  • La description de cet élément vous paraît-elle claire ?

Pensez autant que possible à orienter votre question vers un problème que vous avez relevé, pour faciliter les réponses, votre traitement des données correspondantes et la mise en place des recommandations de vos utilisateurs.

Des outils de heatmap comme Hotjar permettent de rajouter ce type de formulaire sur votre site, mais il existe de nombreuses solutions.

Source : Searchenginejournal.com – John Lincoln

Inscrivez-vous pour recevoir nos actualités en avant première.