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

Apprendre / Guides / Le guide des heatmaps

Retour aux guides

Comment utiliser les maps de mouvement du suivi de la souris pour améliorer l'interface utilisateur et les conversions ?

Le suivi des mouvements et des appuis du curseur de la souris permet de se faire une image de ce qui attire l'attention (ou non) sur une page de site web ou une interface de produit. Chez Hotjar, nous appelons cette visualisation une map de mouvement.

Ce guide vous explique ce que sont les maps de mouvement, pourquoi elles sont utiles et comment analyser les données de mouvement de la souris pour effectuer des optimisations centrées sur le client qui améliorent l'expérience de l'utilisateur (UX) et les conversions.

Nous abordons les points suivants :

  1. Qu'est-ce qu'une map de mouvement ?

  2. 4 façons d'utiliser les maps de mouvement pour améliorer l'expérience utilisateur et les conversions sur le site web

  3. Quelles sont les pages sur lesquelles vous devriez utiliser le suivi de la souris ?

  4. Maps de mouvement vs. heatmaps de clics vs. maps de défilement

  5. Comment configurer une map de mouvement sur votre site web ?

Trouvez les points d'attention de votre site web

Utilisez les heatmaps Hotjar pour visualiser les mouvements de la souris, repérer les améliorations de l'expérience utilisateur et augmenter les conversions.

Qu'est-ce qu'une map de mouvement ?

Une map de mouvement, également appelée heatmap de mouvement de la souris, heatmap du suivi de la souris ou map de l'attention, permet de suivre le mouvement général et le positionnement du curseur de la souris d'un utilisateur.

Les heatmaps des mouvements de la souris utilisent la couleur pour montrer l'attention que les utilisateurs portent à différents éléments de la page : plus le curseur de la souris reste longtemps à un certain endroit, plus il devient rouge.

#A move map showing popular mouse positions on an example pricing page
A move map showing popular mouse positions on an example pricing page

📝 À noter : certaines maps de mouvement recueillent également l'activité des doigts sur les appareils mobiles, mais cela est généralement moins utile car la plupart des utilisateurs mobiles ne touchent l'écran que pour cliquer ou faire défiler la page.

Pourquoi utiliser une map de mouvement pour suivre les mouvements de la souris ?

Lesmaps de mouvement vous indiquent les zones d'une page qui attirent le plus l'attention. Étant donné qu'elles superposent le comportement de la souris de plusieurs utilisateurs à la fois, les maps de mouvement sont des représentations quantitatives des éléments de la page qui sont activement lus ou vus.

Une map de mouvement Hotjar sur UI-Patterns.com montre que la barre latérale est ignorée.

La recherche montre une corrélation entre le mouvement de la souris et celui des yeux. Cela signifie que les maps de mouvement sont également un bon moyen de comprendre où les utilisateurs regardent en naviguant sur votre site.

Par rapport au suivi des yeux en laboratoire, les heatmaps de mouvement de la souris sont moins chères et plus faciles à générer, elles capturent plus d'utilisateurs à l'échelle et mesurent le comportement dans le monde réel.

4 façons d'utiliser les maps de mouvement pour améliorer l'expérience utilisateur du site web et les conversions

Utilisez les exemples ci-dessous pour trouver des idées sur la façon de tirer le meilleur parti des maps de mouvement sur votre prochain projet de conception sur l'expérience utilisateur ou projet d'optimisation des taux de conversion :

1. Déterminez où vous captez l'attention des utilisateurs

Les maps de mouvement vous indiquent les éléments qui attirent le plus l'attention sur une page - il suffit de repérer les points chauds en rouge.

Une fois que vous savez ce qui est vu par les visiteurs de la page, vous pouvez faire des recommandations d'optimisation et trouver des idées sur ce qu'il convient d'étudier ensuite.

Une map de mouvement Hotjar sur le site d'une bibliothèque de l'université de Baltimore montre que la boîte de recherche attire toute l'attention.

Par exemple, l'Université de Baltimore a utilisé les heatmaps de Hotjar Heatmaps pour ajouter une map de mouvement à la page d'accueil d'une bibliothèque. La heatmap a montré que la plupart des visiteurs de la page d'accueil se concentraient sur la boîte de recherche à onglets, sans presque aucune interaction avec d'autres éléments de la page, comme le bouton "Demandez à un bibliothécaire".

S'il s'agissait de votre site,, vous pourriez prendre l'une des mesures suivantes :

  • Obtenez plus de données avec des enregistrements de session pour voir exactement comment les visiteurs individuels utilisent la boîte de recherche.

  • Regardez où les utilisateurs font des clics de rage et sont confus

  • Envisagez des tests A / B de nouvelles mises en page (comme trois boîtes de recherche séparées au lieu d'une boîte à onglets), puis placez des maps de mouvement sur vos variantes de test A / B pour voir pourquoi les variantes les plus performantes l'emportent

  • Envisagez d'ajouter une enquête sur site pour demander aux utilisateurs s'il manque quelque chose sur la page.

2. Mesurez si les éléments non cliquables sont vus

La plupart des textes et des images ne nécessitent pas de clics de la part des visiteurs. Les maps de mouvement sont donc le seul moyen de savoir, à l'échelle, s'ils sont lus et vus.

#Part of a move map on a previous iteration of our guide to heatmaps
Part of a move map on a previous iteration of our guide to heatmaps

Par exemple, nous avons généré la map de mouvement ci-dessus sur une version antérieure de notre guide des heatmaps. Elle a montré que de nombreux visiteurs s'arrêtaient pour regarder une image qui comparait les maps de défilement avec les heatmaps de clics. Cette constatation nous a incités à conserver l'image lors de la mise à jour de la page. Si vous voyez des images similaires dans cet article de blog, vous savez maintenant pourquoi !

3. Regardez les éléments ignorés

Étant donné que les maps de mouvement mesurent le placement continu de la souris, qui peut être corrélé avec le mouvement des yeux, elles sont plus efficaces que d'autres outils d'analyse pour montrer quels éléments sont ignorés par les utilisateurs.

Une map de mouvement Hotjar sur le détaillant de mode ukrainien Intertop montre que les visiteurs ignorent les listes de produits.

Par exemple, l'agence UX/UI Turum-Burum a utilisé Hotjar pour créer une map de mouvement sur les pages de catégories de produits du magasin de mode Intertop. Les filtres de recherche ont attiré toute l'attention au lieu des listes de produits, ce qui suggère que les utilisateurs ne parviennent pas à trouver les résultats dont ils ont besoin. L'équipe a apporté quelques modifications et ajouté davantage de filtres de produits, ce qui a contribué à une augmentation des clics sur les produits et à une hausse de 13,3 % du revenu moyen par utilisateur.

4. Segmentez vos maps de mouvement pour générer des informations ciblées

Les différents segments d'utilisateurs se comportent différemment sur votre site web, et certains sont plus importants que d'autres pour votre entreprise. La segmentation de vos maps de mouvement vous permet de vous concentrer sur les cohortes les plus précieuses.

Si vous utilisez Hotjar, vous pouvez filtrer les heatmaps rétroactivement : cliquez sur "Ajouter un filtre" pour afficher les options.

#Hotjar’s heatmap filters
Hotjar’s heatmap filters

Voici quelques exemples d'utilisation de cette fonctionnalité

  • Filtrez par page de sortie pour voir ce à quoi les utilisateurs ont prêté attention avant de quitter le site.

  • Filtrez par événement, comme le fait de cliquer sur un bouton "S'inscrire", pour voir ce à quoi les utilisateurs ont prêté attention avant de se convertir.

  • Filtrez par référent ou identifiant (comme les paramètres UTM) pour isoler et étudier le comportement du trafic payant, en particulier

Une map de mouvement Hotjar sur la page d'accueil de l'IDX

Par exemple, l'agence CRO The Good a utilisé les heatmaps Hotjar sur le site web du service de protection de la vie privée IDX pour améliorer le retour sur investissement du trafic publicitaire.

Sur quelles pages devez-vous utiliser le suivi de la souris ?

Vous pouvez suivre les mouvements de la souris sur n'importe quelle page de site web ou de produit qui reçoit du trafic, mais les maps de mouvement sont plus utiles sur les pages critiques pour l'entreprise, et partout où vous souhaitez vérifier l'interaction avec des éléments non cliquables. 🐭 Par exemple :

  • Pages de produits e-commerce : utilisez les maps de mouvement pour mesurer si les clients passent du temps à lire les descriptions de produits et à regarder les images de produits.

  • Articles de blog : utilisez les maps de mouvement pour voir quels paragraphes et quelles images attirent le plus l'attention.

  • Pages avec des taux d'abandon élevés : utilisez l'analyse de funnels et des outils tels que Google Analytics pour identifier les fuites de conversion, puis des maps de mouvement pour voir quelles zones attirent l'attention des utilisateurs.

  • CTA critiques pour l'activité : si les appels à l'action (CTA) ne sont pas cliqués, utilisez une map de mouvement pour résoudre le problème.

Maps de mouvement vs. heatmaps de clics vs. maps de défilement

Les maps de mouvement ne sont pas le seul type de heatmap que vous pouvez utiliser : les heatmaps de clics permettent de savoir où les utilisateurs cliquent ou appuient, et les maps de défilement permettent de savoir jusqu'où les utilisateurs font défiler une page. Contrairement à ces alternatives, les maps de mouvement mesurent le comportement des utilisateurs en continu, même entre les actions de la page.

De cette manière, les maps de mouvement révèlent des informations qui échappent aux autres heatmaps. Par exemple, une map de défilement peut montrer un pourcentage élevé d'utilisateurs défilant jusqu'au bas de la page, mais une carte de mouvement peut révéler qu'ils ignorent complètement la barre latérale. De même, une heatmap des clics peut montrer qu'aucun clic n'a été effectué sur une description de produit, alors qu'une map de mouvement peut révéler que les utilisateurs qui l'ont vue ont ensuite converti.

Map de mouvement Hotjar (à gauche) et heatmap des clics (à droite) sur Data36.com

Aucun type de heatmap n'est mieux ou moins bien - utilisez-les ensemble pour obtenir des informations plus claires :

  • Utilisez les heatmaps de clics pour voir si les internautes cliquent sur les boutons CTA, les liens rompus ou les éléments non liés.

  • Utilisez les maps de défilement pour visualiser la ligne de flottaison moyenne et voir où la plupart des utilisateurs font défiler la page.

  • Utilisez les maps de mouvement pour déterminer les zones d'une page qui attirent l'attention.

💡 Conseil de pro : si vous utilisez Hotjar, les heatmaps sont capturées en continu sur toutes les pages, ce qui vous permet de basculer entre les heatmaps de clics, de mouvement et de défilement sans avoir à modifier les paramètres.

Deux façons de basculer entre les heatmaps de clics, de mouvement et de défilement dans les heatmaps Hotjar

📝Remarque : vous pouvez remarquer un quatrième type de heatmap dans l'image ci-dessus, les zones d'engagement. Cette heatmap combine les données relatives aux clics, au mouvement et au défilement sous forme de grille, afin que vous puissiez voir quelles sont les zones de vos pages qui suscitent le plus d'engagement. À vous d'essayer !

Maps de mouvement vs. enregistrements de session

Un enregistrement de session recrée la session de navigation d'un utilisateur individuel sur plusieurs pages : vous verrez les mouvements de la souris, mais seulement pour un seul utilisateur à la fois.

Les maps de mouvement, quant à elles, regroupent les mouvements de souris de plusieurs utilisateurs sur une même page. Vous pouvez les utiliser pour rechercher des tendances générales et vous faire une idée globale de la manière dont différents éléments attirent l'attention.

💡 Conseil de pro : combinez les données qualitatives et quantitatives pour tirer des conclusions plus solides. Utilisez des maps de mouvement pour repérer la tendance principale, comme un élément ignoré, puis regardez les enregistrements de session pour une compréhension qualitative de ce que font les utilisateurs individuels à la place.

Mouvement de la souris de l'utilisateur suivi à l'aide d'enregistrements Hotjar

Comment configurer une carte de mouvement sur votre site web ?

Pour commencer, créez un compte Hotjar gratuit et ajoutez notre code de suivi à votre site web. Activez la capture de session. Activez la capture de session, et Hotjar collectera automatiquement des maps de mouvement sur votre site.

#How to view a move map in Hotjar Heatmaps
How to view a move map in Hotjar Heatmaps

Une fois que vous avez reçu du trafic sur votre site, cliquez sur l'icône de la heatmap sur la gauche, entrez une URL et cliquez sur "Voir la heatmap".

#Click to toggle between move maps and other heatmap types in Hotjar
Click to toggle between move maps and other heatmap types in Hotjar

Sélectionnez une période, par exemple les 30 derniers jours, et cliquez sur l'icône de la map de mouvement pour générer votre map de mouvement. C'est aussi simple que cela !

Créez gratuitement votre map de mouvement et augmentez vos conversions dès aujourd'hui

Les maps de mouvement vous donnent un aperçu de ce à quoi les internautes prêtent attention (et de ce qu'ils ignorent) sur votre site web et vos pages produits.

En elles-mêmes, elles constituent d'excellents atouts visuels pour expliquer le comportement des utilisateurs à votre équipe et aux parties prenantes. Mais elles deviennent beaucoup plus précieuses une fois combinées à d'autres informations issues de votre système d'analyse : les funnels pour vous indiquer où vous perdez des conversions, les enregistrements de session pour vous montrer comment les internautes naviguent sur l'ensemble de votre site, et les enquêtes pour obtenir un feedback client avec leurs propres mots.

Et devinez quoi ? Vous pouvez faire tout cela avec Hotjar. 😉

Trouvez les points d'attention de votre site web

Utilisez les heatmaps Hotjar pour visualiser les mouvements de la souris, repérer les améliorations de l'expérience utilisateur et augmenter les conversions.

3 FAQ sur les cartes de mouvement