← CROCRO

Heatmap et analyse comportementale pour le CRO

Comment utiliser les heatmaps, les enregistrements de sessions et les cartes de scroll pour identifier les blocages de conversion et prioriser les optimisations CRO.

Par Kenoby8 min de lecture

En bref — Les heatmaps visualisent l'activité des utilisateurs sur une page : où ils cliquent, jusqu'où ils scrollent, où leurs yeux se posent. Combinées aux enregistrements de sessions (replay vidéo des visites), elles révèlent les blocages de conversion invisibles dans Google Analytics. Ce sont les outils de diagnostic qualitatif indispensables du CRO.

Qu'est-ce qu'une heatmap ?

Une heatmap (carte thermique) est une visualisation graphique qui représente l'intensité d'une activité sur une page web. Les zones "chaudes" (rouge/orange) correspondent à une forte activité, les zones "froides" (bleu) à une activité faible.

Il existe plusieurs types de heatmaps, chacun révélant une dimension différente du comportement utilisateur.

Les 4 types de heatmaps

1. Heatmap de clics (Click Map)

Visualise où les utilisateurs cliquent sur la page — sur les éléments cliquables (boutons, liens) et sur les éléments non-cliquables.

Ce qu'elle révèle :

  • Rage clicks : clics répétés sur un élément non cliquable (frustration de l'utilisateur qui pense que ça devrait être cliquable)
  • Éléments ignorés : votre CTA principal ne reçoit quasiment pas de clics → problème de visibilité ou de message
  • Distractions : les utilisateurs cliquent sur des éléments qui les éloignent de la conversion (liens de navigation, images non pertinentes)

2. Heatmap de scroll (Scroll Map)

Indique jusqu'où les visiteurs scrollent sur la page. Affichée en pourcentage : "50 % des visiteurs voient ce point de la page".

Ce qu'elle révèle :

  • Le fold effectif : où la majorité des visiteurs arrêtent de scroller (souvent plus haut que prévu)
  • Contenu invisible : si votre formulaire ou CTA est placé en dessous du point où 70 % des visiteurs quittent, rares seront ceux qui le voient
  • Perte d'attention : un drop brutal de 80 % à 20 % entre deux sections signale un contenu qui n'accroche pas

Règle pratique : placez votre CTA principal dans la zone vue par au moins 80 % des visiteurs.

3. Heatmap de mouvement de souris (Move Map)

Trace les mouvements de la souris, utilisée comme approximation des mouvements des yeux (corrélation de 84-88 % selon les études).

Ce qu'elle révèle :

  • Les zones de lecture réelles (où l'attention se concentre)
  • Les patterns en F ou en Z (schémas de lecture typiques sur le web)
  • Les éléments qui attirent l'attention vs ceux qui sont ignorés

4. Eye-tracking (carte d'attention)

Disponible dans les outils premium, utilise l'IA pour prédire où les yeux des utilisateurs se posent. Moins précis que l'eye-tracking en laboratoire mais accessible.

Les enregistrements de sessions (Session Recordings)

Les enregistrements de sessions capturent des vidéos du parcours d'un visiteur sur votre site : mouvements de souris, clics, scrolls, remplissage de formulaire.

Ce qu'ils révèlent :

  • Confusion de navigation : l'utilisateur cherche un élément, ne le trouve pas, repart
  • Abandon de formulaire : sur quel champ exactement l'utilisateur abandonne
  • Bugs non détectés : éléments qui ne chargent pas, boutons qui ne fonctionnent pas sur mobile
  • Comportements inattendus : l'utilisateur fait quelque chose que vous n'aviez pas anticipé

Combien regarder ? 5 à 10 enregistrements suffisent souvent pour identifier les patterns récurrents. La valeur marginale de chaque enregistrement supplémentaire diminue rapidement.

Les outils de heatmaps et d'enregistrements

Microsoft Clarity (100 % gratuit)

Heatmaps, enregistrements de sessions, cartes de scroll, détection des rage clicks et des dead clicks. Pas de limite de trafic, RGPD-compatible avec le bon paramétrage.

C'est l'outil de démarrage recommandé. Installez-le via Google Tag Manager en 10 minutes.

Hotjar

Plan gratuit limité (35 sessions/jour, 3 heatmaps actives). Plans payants à partir de 32 $/mois.

Avantage sur Clarity : les sondages et widgets de feedback intégrés (demandez directement aux utilisateurs pourquoi ils partent).

FullStory

Solution enterprise avec analyse comportementale avancée (recherche par action, DX Data). Adapté aux grandes équipes produit.

Contentsquare

Analytics comportemental avancé pour les grands sites e-commerce et éditeurs. Calcule l'attractivité et la contribution à la conversion de chaque zone de page.

Comment analyser une heatmap efficacement

Le processus d'analyse

  1. Filtrez par segment : desktop vs mobile, new vs returning visitors, source de trafic. Les comportements diffèrent.

  2. Identifiez les anomalies :

    • CTA avec peu de clics malgré sa position
    • Rage clicks sur des éléments non-cliquables
    • Drop de scroll brutal avant les éléments clés
    • Navigation vers des pages qui éloignent de la conversion
  3. Formulez des hypothèses : chaque anomalie devient une hypothèse de test A/B.

  4. Croisez avec les données GA4 : confirmez que les pages analysées ont bien les problèmes de conversion que vous voyez (taux de rebond, taux de conversion segmenté).

Exemple d'analyse concret

Situation : landing page avec taux de conversion de 1,8 % (vs 3,5 % espéré).

Analyse Clarity :

  • Scroll map : 68 % des visiteurs ne voient pas le formulaire (placé en bas de page)
  • Click map : nombreux rage clicks sur l'image du produit (les utilisateurs pensent qu'elle est cliquable / zoomable)
  • Enregistrements : sur mobile, 40 % des utilisateurs trouvent le formulaire mais n'arrivent pas à cliquer sur le bouton submit (trop petit)

Hypothèses générées :

  1. Déplacer le formulaire above the fold → test A/B
  2. Rendre l'image cliquable (lightbox) ou la remplacer par une vidéo
  3. Agrandir le bouton submit sur mobile (min. 44px)

Combiner heatmaps et sondages

Les heatmaps disent quoi (l'utilisateur quitte au niveau du formulaire). Les sondages disent pourquoi ("Pourquoi n'avez-vous pas rempli le formulaire ?" → "Je ne savais pas à quoi m'attendre ensuite" / "Trop de champs requis").

Configuration recommandée :

Dans Hotjar : activez un exit intent survey sur les pages de conversion clés. Question simple : "Qu'est-ce qui vous a empêché de [action] ?" avec option libre.

Même 10 réponses qualitatives révèlent des insights que 10 000 lignes de données quantitatives ne permettent pas de voir.

FAQ heatmaps et analyse comportementale

Les heatmaps sont-elles conformes au RGPD ?

Oui, si configurées correctement. Microsoft Clarity et Hotjar permettent d'exclure les champs de formulaire de l'enregistrement (masquage automatique des données sensibles). L'installation doit respecter le consentement (chargement conditionnel via CMP). Ajoutez la mention dans votre politique de confidentialité.

Faut-il regarder toutes les enregistrements de sessions ?

Non. Filtrez par pages stratégiques (landing pages, tunnel de conversion), par comportement (utilisateurs qui ont abandonné le formulaire, utilisateurs ayant scrollé mais pas cliqué), et par appareil (mobile en priorité si conversion mobile faible).

Une heatmap peut-elle être trompeuse ?

Oui, si on ne segmente pas. Mixer desktop et mobile dans la même heatmap produit une image floue. Les comportements de scroll diffèrent radicalement entre les deux. Analysez toujours séparément.


Kenoby utilise les heatmaps et enregistrements de sessions comme socle de son processus CRO pour identifier les opportunités d'optimisation les plus impactantes.