Bonjour ! Hotjar est maintenant disponible en français 🇫🇷 Commencez gratuitement.

Apprendre / Guides / Le guide des heatmaps

Retour aux guides

Comment créer une heatmap (gratuitement)

Une heatmap est une visualisation de données codée par couleur, généralement avec une échelle de couleurs allant du bleu (froid) au rouge (chaud). Vous pouvez créer une heatmap de données avec des tableurs comme Excel, ou générer une heatmap de site web à l’aide d’un outil gratuit comme Hotjar.

Dans ce tutoriel, nous vous montrons comment utiliser Hotjar pour créer des heatmaps qui vous aident à comprendre comment les visiteurs utilisent votre site web (ce sur quoi ils cliquent ce qu’ils ignorent, et ce qui les frustre) afin que vous puissiez optimiser les conversions, l’expérience utilisateur (UX) et les métriques qui comptent pour votre entreprise.

Dernière mise à jour

23 oct. 2023

Temps de lecture

7 min

Partager

Illustration visualizing user behavior on a website using Hotjar Heatmaps

Inscrivez-vous gratuitement à Hotjar, ajoutez le code de suivi et commencez à utiliser les heatmaps pour améliorer votre site ou votre produit.

Comment créer gratuitement une heatmap de site web à l'aide de Hotjar

Pour obtenir une heatmap d’un site web ou d’une page produit, vous devrez utiliser un outil sophistiqué de heatmap comme Hotjar. La collecte et le rendu des données de heatmap vous aident à comprendre comment les visiteurs utilisent votre site, ce sur quoi ils cliquent, ce qui les frustre et où leur attention faiblit sur la page.

🔥 Vous utilisez déjà Hotjar ?

Si vous avez besoin d’aide pour configurer votre première heatmap Hotjar, rendez-vous sur notre centre d’aide et consultez notre rubrique comment configurer les heatmaps.

Si vous êtes nouveau sur Hotjar, pas de problème. Il existe un plan gratuit à vie ou un essai gratuit sur les plans Plus et Business pour vous aider à démarrer :

  1. Rendez-vous sur notre page Outil Heatmap Web et ouvrez un compte gratuit (ou consultez la page de tarification si vous souhaitez opter pour le plan Plus ou Business)

  2. Suivez les instructions pour installer le code de suivi Hotjar sur votre site web

Une fois votre code de suivi installé et vérifié, suivez ces cinq étapes simples pour générer votre première heatmap :

1. Vérifiez que la "capture de session" est activée

Pour générer une heatmap Hotjar, la capture de session doit être activée.

Si vous devez l’activer manuellement, vous verrez une liste déroulante “Capture de session : DÉSACTIVÉE” en haut à droite.

Cliquez sur le lien Paramètres de site et activez la capture de session.

Vous verrez alors un nouveau message en haut à droite sur la capture du trafic. Cliquez dessus pour voir combien de sessions vous pouvez capturer chaque jour avec votre plan actuel.

💡Conseil de pro : les conclusions que vous tirerez de vos heatmaps seront plus solides si vous collectez des données non échantillonnées. En suivant toutes les interactions, vous pouvez être sûr que chaque décision que vous prenez est basée sur une capture complète et non sur des fragments de données.

2. Créez une nouvelle heatmap

Cliquez sur l’icône de la heatmap dans le menu de gauche, puis sur le bouton “+ Nouvelle heatmap”.

3. Saisissez l'URL de votre page de heatmap

Utilisez le filtre URL pour afficher une heatmap pour n’importe quelle page de votre site web. Vous pouvez visualiser :

  • Une heatmap d'une seule page, par exemple mystore.com/product-category/item1

  • Une heatmap combinée de plusieurs pages, par exemple mystore.com/product-category 

Si vous ne savez pas par où commencer, cliquez sur la case et vous obtiendrez une liste de suggestions d’URL basées sur les pages les plus populaires de votre site.

4. Cliquez sur "Afficher la heatmap”

Et le tour est joué ! Votre heatmap devrait apparaître en moins de 90 secondes. 

Il suffit qu’une personne visite la page pour que les heatmaps Hotjar commencent à fonctionner. Mais vous devrez peut-être attendre quelques visiteurs supplémentaires pour commencer à voir des tendances sur votre heatmap.

Cliquez sur les icônes pour basculer entre les sessions sur ordinateur, mobile et tablette, et pour afficher les maps de clics (ou d’appui sur mobile), de mouvement et de défilement.

Voici à quoi ressemblent les trois différents types de heatmap :

5. Filtrez les données de la heatmap

Vous pouvez tirer beaucoup plus de valeur de votre heatmap, si vous filtrez les données de session pour n’afficher qu’une période pertinente ou un groupe d’utilisateurs spécifique.

Pour filtrer votre heatmap par date, cliquez sur la liste déroulante de l’icône du calendrier et sélectionnez une période prédéfinie (de 24 heures à 12 mois) ou saisissez une plage de dates personnalisée.

Cliquez sur le bouton '+ Ajouter un filtre' et choisissez un ou plusieurs filtres. Quelques idées pour vous aider à démarrer :

  • Filtrez par Rage click pour voir où les visiteurs cliquent dans la frustration

  • Filtrez par nouveaux utilisateurs pour voir le comportement des nouveaux visiteurs

  • Filtrez par navigateur ou système d’exploitation pour résoudre les problèmes spécifiques à la technologie

Vous pouvez garder des fonctionnalités simples ou aussi avancées que vous le souhaitez. Il est même possible de configurer des caractéristiques de l’utilisateur pour filtrer les heatmaps par métriques personnalisées comme les “utilisateurs qui se sont inscrits au cours des 30 derniers jours” ou les “clients ayant dépensé plus de 200 $”.

Si vous avez des questions techniques ou des doutes sur les heatmaps, consultez notre documentation d’aide complète sur les heatmaps.

💡Conseil de pro : cliquez sur “Zone d’engagement” dans le panneau de droite pour afficher une superposition de grille en haut de la page.

Il s’agit d’une représentation visuelle des points de données agrégés des heatmaps des clics, de mouvement et de défilement, le tout dans une seule vue. Les différentes nuances (ou opacités) mettent en évidence les éléments de la page avec lesquels les utilisateurs interagissent le plus (couleur plus foncée) ou qu’ils négligent (pas de cellule ou couleur plus claire).

Les zones d’engagement permettent de repérer en un coup d’œil les zones de votre page qui ne reçoivent pas l’attention qu’elles méritent, afin que vous puissiez les améliorer.

Set up your heatmap today

Sign up for a free Hotjar account, add the tracking code to your site, and start using heatmaps today.

Les meilleures pages pour collecter des données de heatmap

Les heatmaps vous permettent de creuser en profondeur l’une des pages de votre site web, mais il est logique de commencer par celles qui sont les plus importantes pour vous en termes de trafic, d’utilisabilité et d’objectifs commerciaux.

1. La page d'accueil et les pages de destination

Votre page d’accueil et vos principales pages de destination sont les principaux points d’entrée de votre site web. Elles sont souvent à l’origine des premières impressions des visiteurs et de leur décision de continuer à naviguer ou d’abandonner le site. 

Une heatmap sur ces pages vous aidera à déterminer la quantité d’informations que vos utilisateurs voient ou avec lesquelles ils interagissent, ainsi que les éléments sur lesquels ils cliquent ou qu’ils ignorent.

2. Les pages les plus visitées

Vos pages les plus performantes (la page produit la plus consultée, l’article de blog avec le plus grand nombre de commentaires, etc.) font manifestement bien les choses. Une heatmap peut vous aider à comprendre ce qui fonctionne bien afin pour reproduire le succès ailleurs.

3. Les pages peu performantes

Vos pages les moins performantes sont aussi importantes que les précédentes, mais pour la raison inverse. Il y a sûrement quelque chose qui ne va pas, et y placer une heatmap peut vous aider à comprendre ce que vos visiteurs voient (ou ne voient pas) et où ils interagissent afin que vous puissiez réagir.

Nous avons placé Hotjar sur toutes nos pages. Si notre taux de conversion chute après un changement, nos heatmaps nous aident à identifier et à régler le problème. Hotjar nous a aidé à définir notre stratégie de site web et à améliorer l’expérience de nos clients.

Anna Grunanger
Head of Acquisition, Vimcr

4. Les nouvelles pages

Vos pages web les plus récentes ne contiennent pas beaucoup de données. Si vous avez récemment ajouté une page produit à votre site web, une heatmap peut être un bon moyen d’obtenir des informations initiales, de mesurer les performances de la page et de l’optimiser au fur et à mesure que les informations des utilisateurs affluent.

💡Conseil de pro : si vous exécutez des tests A / B pour améliorer le taux de conversion ou d’autres métriques importantes pour votre entreprise, Hotjar Heatmaps vous permet de visualiser les heatmaps de vos variations de tests A / B, afin que vous puissiez comparer les anciennes et les nouvelles versions et voir pourquoi une version fonctionne mieux pour obtenir des idées pour de futurs tests.

Voici quelques ressources pour vous aider à tirer le meilleur parti des heatmaps :

Création d'une heatmap dans Excel vs. Hotjar

Vous pouvez créer une heatmap à partir de n'importe quel ensemble de données numériques à l'aide d'outils de tableur courants comme Microsoft Excel, Google Sheets ou LibreOffice. La méthode la plus rapide consiste à sélectionner les valeurs de cellules appropriées et à appliquer une mise en forme conditionnelle pour formater les cellules.

Dans Google Sheets, accédez à Format > Mise en forme conditionnelle, puis sélectionnez Échelle de couleurs et choisissez votre palette de couleurs préférée. L’exemple ci-dessous utilise “Vert à jaune-rouge” comme style de format. Vous pouvez aussi personnaliser le point minimal (pour la valeur minimale), le point central et le point maximal (pour la valeur la plus élevée) si nécessaire.

#Les même points de données de clics du site web visualisés dans Google Sheets (à gauche) et Hotjar (à droite)
Les même points de données de clics du site web visualisés dans Google Sheets (à gauche) et Hotjar (à droite)

Les heatmaps Excel peuvent être utiles lorsque vous essayez de repérer des modèles et des tendances dans les données numériques, tandis qu’un outil heatmap de site web comme Hotjar va plus loin en superposant l’activité d’un utilisateur réel sur une capture d’écran de la page concernée. Il est donc beaucoup plus facile de voir où les vrais visiteurs cliquent et font défiler la page. Pas besoin de tableau croisé dynamique ou de boîte de dialogue !

Prochaines étapes

Les heatmaps sont un moyen rapide et visuel de comprendre ce qui se passe sur votre site web.

Bonne nouvelle : vous savez maintenant exactement comment créer une heatmap de site web gratuite à l’aide de Hotjar.

La meilleure nouvelle : lorsque vous configurez la capture de session, vous obtenez également Hotjar Recordings afin que vous puissiez regarder les utilisateurs individuels naviguer sur plusieurs pages de votre site web. De plus, lorsque vous êtes prêt à faire passer vos efforts d’optimisation au niveau supérieur, vous êtes prêt à demander le feedback des utilisateurs, à mener des enquêtes et des entretiens de l’utilisateur, le tout à partir du même compte Hotjar.

Inscrivez-vous gratuitement à Hotjar, ajoutez le code de suivi et commencez à utiliser les heatmaps pour améliorer votre site ou votre produit.

FAQ sur la configuration de vos heatmaps