Analytics

Heatmap

Une heatmap, ou carte de chaleur, est une représentation visuelle qui superpose à une page web les interactions de ses visiteurs. Les zones les plus sollicitées apparaissent en rouge et en orange, les moins touchées en bleu, comme une caméra thermique appliquée à votre site. Là où les chiffres d'analyse disent combien de personnes ont agi, la heatmap montre où elles ont agi sur la page, ce qui en fait un outil précieux pour comprendre un comportement et nourrir vos décisions d'optimisation.
Carte de chaleur colorée superposée à une interface web montrant les zones les plus consultées

Le principe d'une carte de chaleur

Une heatmap agrège les comportements de nombreux visiteurs en une seule image. Chaque clic, chaque arrêt de scroll, chaque survol est enregistré par un script discret, puis l'outil additionne tout cela pour colorer la page selon l'intensité des interactions. Le résultat ne décrit jamais un internaute en particulier mais une tendance collective, ce qui en fait un outil d'observation et non de mesure individuelle.

Cette approche comble un angle mort des outils d'analyse classiques. Google Analytics vous dit qu'une page convertit mal, mais pas pourquoi. La heatmap, elle, montre que le bouton d'achat est ignoré parce qu'il tombe sous la ligne de flottaison, ou qu'un visuel décoratif attire des clics frustrés parce qu'il ressemble à un lien. Elle transforme une statistique abstraite en observation concrète.

À retenir

  • La heatmap montre où les visiteurs interagissent, pas combien sont passés ni s'ils ont converti
  • Elle est un point de départ d'enquête, à croiser avec les chiffres d'analyse et les enregistrements de session
  • Mobile et ordinateur s'analysent toujours séparément, jamais sur une carte commune

Clics, scroll, mouvements : trois cartes complémentaires

La heatmap de clics est la plus parlante. Elle révèle les éléments qui attirent l'action, mais aussi les clics morts sur des images ou des titres que les visiteurs prennent à tort pour des liens. Ces faux clics sont une mine d'enseignements sur les attentes mal satisfaites.

La heatmap de scroll indique jusqu'où l'on descend dans la page. Elle fait apparaître la ligne au-delà de laquelle la moitié des visiteurs ont décroché, ce qui est capital pour décider quoi placer en haut et quoi reléguer plus bas.

La heatmap de mouvement suit le déplacement du curseur. Sur ordinateur, le pointeur accompagne souvent le regard, ce qui en fait un indice d'attention, mais imparfait : certains lisent sans bouger la souris. C'est la moins fiable des trois, à manier avec prudence.

Comment se lit le dégradé chaud / froid

L'échelle de couleur suit l'intuition thermique : du rouge intense pour l'attention maximale jusqu'au bleu pour les zones délaissées, en passant par l'orange et le jaune. Une zone sans couleur est tout simplement invisible aux yeux des visiteurs. La lecture est toujours relative à la page : le rouge marque le point le plus chaud de cette page-là, pas une valeur transposable ailleurs.

Zones de chaleur sur une page type
Titre principal Bouton d'action (chaud) Bas de page (froid) Forte attention le bouton capte les clics Faible attention peu de visiteurs descendent chaud tiède froid
Sur cette page, l'attention se concentre sur le titre et le bouton, tandis que le bas de page reste quasi inexploré.

Une bonne lecture consiste à confronter ce que montre la carte à ce que vous vouliez obtenir. Si l'élément le plus chaud n'est pas votre appel à l'action mais une image décorative, vous tenez une piste d'optimisation. Si la zone de scroll s'arrête juste avant votre argument décisif, il faut le remonter.

Outils et conditions d'une bonne mesure

Hotjar reste la référence grand public, avec heatmaps, enregistrements de session et sondages intégrés. Microsoft Clarity propose un service comparable gratuitement et sans plafond de trafic, ce qui en fait un excellent point d'entrée. Pour des besoins avancés, Contentsquare ou Mouseflow offrent des analyses plus poussées.

Tous reposent sur le même principe : un script déposé sur le site collecte les interactions, puis les agrège. La qualité de la lecture dépend du volume : sous quelques centaines de sessions par page, la carte reflète surtout le bruit. Visez au moins un millier de vues, et séparez systématiquement les appareils, car un pouce sur smartphone et un curseur sur ordinateur ne se comportent pas du tout pareil.

Ce qu'une heatmap ne peut pas faire

Une heatmap décrit, elle n'explique pas. Elle vous dit qu'une zone est froide, mais pas si c'est par manque d'intérêt, par mauvais placement ou par lenteur de chargement. Elle se complète donc d'autres signaux : enregistrements de session pour le contexte, chiffres d'analyse pour l'ampleur, voire un test A/B pour valider une hypothèse née de la carte.

Méfiez-vous aussi des pages dynamiques. Sur un contenu qui change selon le visiteur ou qui se déploie au clic, l'agrégation peut superposer des éléments différents au même endroit et brouiller la lecture. Vérifiez toujours que l'image de fond de la heatmap correspond bien à ce que voient réellement vos utilisateurs.

Questions fréquentes

On distingue trois grandes familles. La heatmap de clics montre où les visiteurs cliquent, y compris sur des éléments non cliquables. La heatmap de scroll révèle jusqu'où les gens descendent dans la page, et donc à partir de quelle hauteur le contenu n'est presque plus vu. La heatmap de mouvement suit le déplacement du curseur, un indicateur imparfait mais souvent corrélé au regard sur ordinateur.
Hotjar et Microsoft Clarity sont les plus répandus, ce dernier étant gratuit et sans limite de trafic. Contentsquare et Mouseflow visent les usages plus avancés. La plupart fonctionnent en posant un petit script de suivi sur le site, puis en agrégeant les interactions de nombreux visiteurs en une seule image colorée superposée à la page.
Les zones rouges et oranges concentrent le plus d'interactions, les zones bleues en reçoivent peu, et l'absence de couleur signale qu'un élément est pratiquement ignoré. Une heatmap se lit toujours en relatif sur une page donnée : une couleur chaude indique une attention forte par rapport au reste de la page, pas une valeur absolue comparable d'un site à l'autre.
En dessous de quelques centaines de sessions sur une même page, une heatmap reflète surtout le hasard et risque de vous induire en erreur. Visez au minimum un millier de vues pour une lecture fiable, et séparez toujours mobile et ordinateur, car les comportements de clic et de scroll diffèrent trop pour être mélangés sur une même carte.

Termes liés