Lorsque j'ai commencé à travailler sur mes sites WordPress, je devinais la plupart du temps ce que voulaient les visiteurs. Ce n'est qu'en commençant à utiliser des heatmaps que j'ai vraiment compris comment les gens interagissaient avec mon site — où ils cliquaient, jusqu'où ils faisaient défiler, et ce qui attirait réellement leur attention.
Si vous essayez d'améliorer votre site WordPress mais que vous ne savez pas ce qui fonctionne et ce qui ne fonctionne pas, les heatmaps peuvent vous apporter des réponses.
Après avoir testé plusieurs outils, j'ai réduit les options à deux méthodes simples pour configurer des cartes thermiques dans WordPress : Microsoft Clarity et UserFeedback.
Dans ce guide étape par étape, je vais vous expliquer comment configurer les deux méthodes, afin que vous disposiez des outils nécessaires pour apporter des améliorations basées sur les données à votre site. 🔥
Pourquoi avez-vous besoin de configurer des heatmaps WordPress ?
Les cartes thermiques vous montrent exactement comment les gens interagissent avec votre site Web, vous permettant ainsi d'améliorer votre contenu, votre mise en page et vos conversions en fonction du comportement réel des visiteurs. Elles utilisent un code couleur pour mettre en évidence les zones les plus et les moins actives sur une page :
- Les zones rouges, oranges et jaunes (« chaudes ») indiquent où les visiteurs cliquent, tapotent ou passent le plus de temps.
- Les zones bleues et vertes (« froides ») indiquent les endroits qui reçoivent peu ou pas d'attention.
En visualisant cette activité sur votre site Web WordPress, vous pouvez arrêter de deviner ce qui fonctionne et ce qui ne fonctionne pas. En d'autres termes, les cartes thermiques aident à éliminer les conjectures en vous donnant des informations claires sur le comportement des visiteurs.
Les cartes thermiques vous aident à répondre à des questions importantes, telles que :
- Les gens cliquent-ils sur vos boutons CTA ?
- Font-ils défiler suffisamment vers le bas pour voir votre contenu ?
- Est-ce qu'ils cliquent sur des éléments qui ne font rien ?
Avec ces informations, vous pouvez apporter des modifications intelligentes à votre site. Vous saurez quoi corriger, quoi déplacer et quoi améliorer.
Vous pouvez utiliser ces informations pour attirer plus de lecteurs, augmenter les ventes ou obtenir plus de demandes de renseignements de clients potentiels. Tout cela en apportant des changements simples basés sur la façon dont les gens utilisent réellement votre site.
Dans les sections suivantes, je vais vous montrer comment configurer des cartes thermiques dans WordPress en utilisant deux des meilleurs outils et plugins de cartes thermiques et d'enregistrement de sessions. L'un est un outil d'analyse entièrement gratuit, tandis que l'autre est une option premium avec des fonctionnalités supplémentaires.
N'hésitez pas à utiliser les liens de navigation ci-dessous pour accéder à la méthode de votre choix :
- Étape 0 : Préparer votre site WordPress pour les heatmaps
- Method 1: Set Up WordPress Heatmaps Using Microsoft Clarity (Free)
- Method 2: Set Up WordPress Heatmaps Using UserFeedback (Best for Heatmaps + User Surveys)
- Bonus Steps: Maximize Your Heatmap Insights 🔥
- Guides connexes sur l'optimisation des conversions WordPress
Étape 0 : Préparer votre site WordPress pour les heatmaps
Avant d'ajouter des heatmaps à votre site WordPress, il est important de bien préparer votre site. Prendre quelques mesures préventives vous aidera à éviter les problèmes et à garantir l'exactitude de vos données.
Si vous ajoutez des heatmaps à votre site en ligne pour la première fois, il est judicieux de tout tester d'abord sur un site de staging.
Un site de staging est un clone privé de votre site web en ligne où vous pouvez tester en toute sécurité de nouvelles fonctionnalités comme les heatmaps, sans risquer de perturber l'expérience utilisateur de vos visiteurs réels.
Une fois que vous êtes satisfait des modifications, vous pouvez les déployer sur votre site web réel.
Si vous utilisez Bluehost, vous pouvez créer un site de staging en un seul clic grâce à leur outil intégré.
Cela dit, si votre hébergeur ne prend pas en charge le staging, vous pouvez utiliser des plugins comme WP Stagecoach pour créer un site de staging.
Pour une explication complète, vous pouvez consulter notre guide sur comment créer un site de staging pour WordPress.
De plus, créez toujours une sauvegarde complète de votre site avant d'apporter des modifications majeures. Cela garantit qu'en cas de problème, vous pourrez restaurer votre site à son état précédent sans perdre de données.
Les heatmaps sont un outil puissant, mais pour obtenir une image complète du comportement des visiteurs, utilisez-les en parallèle avec d'autres outils d'analyse et les retours des utilisateurs.
Considérez-les comme un point de départ pour découvrir des problèmes ou des opportunités potentiels, et non comme la seule source d'information. La combinaison des informations des cartes de chaleur avec des données plus larges vous donne une image plus claire et plus précise de la manière dont les visiteurs interagissent avec votre site.
Méthode 1 : Configurer les cartes de chaleur WordPress avec Microsoft Clarity
Microsoft Clarity est un outil gratuit et facile à utiliser de cartes de chaleur et d'enregistrement de sessions qui s'intègre à WordPress. Il est idéal pour l'analyse globale du site et convient parfaitement aux débutants, aux blogueurs et aux petites entreprises qui souhaitent comprendre automatiquement comment les visiteurs interagissent avec leur site.
C'est pourquoi il est utilisé sur de nombreux sites Web partenaires pour suivre les cartes de chaleur et obtenir des informations sur les interactions des utilisateurs.
📌 Important : Clarity collecte des données d'utilisation anonymisées pour améliorer ses services, ce qui peut vous aider à vous conformer au RGPD et à d'autres lois sur la protection de la vie privée. Pour plus de détails, consultez notre guide sur WordPress et le RGPD.
Étape 1 : Créez un compte Microsoft Clarity gratuit
Pour configurer les cartes de chaleur WordPress avec Microsoft Clarity, vous aurez d'abord besoin d'un compte.
Rendez-vous sur le site web de Microsoft Clarity et cliquez sur « Get Started ».
Dans la fenêtre contextuelle qui apparaît, vous verrez que vous pouvez vous inscrire avec un compte Microsoft, Facebook ou Google. Cliquez simplement sur celui que vous préférez.
Pour ce tutoriel, je vais sélectionner « Sign in to Google ».
Après cela, vous pouvez suivre le processus d'inscription en choisissant le compte approprié.
Ensuite, cliquez sur « Continue » sur la page de confirmation.
Lors de l'inscription, il vous sera demandé de confirmer votre adresse e-mail.
N'oubliez pas de cocher les Conditions d'utilisation de Clarity et de cliquer sur la case à cocher avant de continuer.
Vous serez ensuite invité à créer un nouveau projet pour votre site WordPress.
Il vous suffit de donner un nom à votre projet, d'entrer l'URL de votre site web et de choisir votre secteur d'activité dans le menu déroulant.
Une fois cela fait, cliquez sur « Add new project » pour terminer la configuration.
Une fois cela fait, vous êtes prêt à installer le plugin Microsoft Clarity pour WordPress afin de configurer des cartes thermiques sur votre site web.
Étape 2 : Installer Microsoft Clarity sur votre site WordPress
Dans cette étape, vous installerez le plugin Microsoft Clarity et le connecterez au compte que vous venez de créer.
Depuis votre tableau de bord WordPress, allons dans Plugins » Ajouter un nouveau plugin.
Utilisez la barre de recherche pour trouver rapidement le plugin Microsoft Clarity.
Cliquez simplement sur « Installer maintenant » sur le résultat de recherche pertinent, et une fois de plus sur « Activer » lorsqu'il apparaît.
Pour des instructions étape par étape, consultez notre guide sur comment installer un plugin WordPress.
Lors de l'activation du plugin, la prochaine étape consiste à choisir un projet Clarity pour connecter les deux outils.
Vous pouvez accéder à Clarity depuis votre zone d'administration WordPress et choisir le projet que vous venez de créer dans le menu déroulant.
Dans les prochaines secondes, vous devriez voir une notification « Projet intégré avec succès ».
Pour plus de détails, vous pouvez consulter notre guide sur comment installer Microsoft Clarity Analytics dans WordPress.
💡 Note : Si vous utilisez un plugin de mise en cache WordPress, vous devez vider votre cache WordPress après avoir connecté Microsoft Clarity à votre site web. Ceci est important car, sinon, Microsoft ne pourra pas vérifier votre site pendant quelques heures.
Étape 3 : Configurer les cartes thermiques dans Microsoft Clarity
Une fois que vous connectez Microsoft Clarity, il commencera automatiquement à suivre vos visiteurs — pas besoin de coller de code manuellement ou de modifier les fichiers du thème.
Dans votre tableau de bord Clarity, vous trouverez des rapports utiles qui vous donneront un aperçu de la façon dont les gens interagissent avec votre blog ou site WordPress.
Certaines des métriques clés incluent :
- Sessions – Ceci montre combien de visites individuelles votre site a reçues.
- Pages par session – Indique combien de pages un visiteur a consultées pendant une session.
- Profondeur de défilement – Indique jusqu'où les utilisateurs font défiler chaque page.
- Temps actif – Suivi du temps pendant lequel les utilisateurs interagissent activement avec votre page (pas seulement en la laissant ouverte dans un onglet en arrière-plan).
Vous trouverez également des widgets prédéfinis comme « Aperçu des utilisateurs », qui met en évidence les types de visiteurs et les appareils.
De plus, il existe des informations comportementales telles que les clics de rage (lorsque les utilisateurs cliquent à plusieurs reprises par frustration) et le défilement excessif (lorsque les utilisateurs font défiler trop, cherchant peut-être quelque chose).
Pour voir vos cartes thermiques, passez à l'onglet « Cartes thermiques ».
Une fois à l'intérieur, vous verrez une liste de toutes les cartes thermiques de page que Clarity a enregistrées automatiquement.
Cliquez simplement sur une page que vous souhaitez analyser.
Une fois que vous ouvrez une carte thermique, vous verrez trois vues principales : Clics, Défilement et Attention.
Vous pouvez passer à « Clics » pour voir où les visiteurs cliquent le plus.
Pour connaître votre profondeur de défilement, passez simplement à l'onglet « Défilement ».
Ici, Clarity révélera jusqu'où les utilisateurs font défiler votre page. Cela aide à identifier s'ils manquent votre contenu clé.
Enfin, cliquez sur le bouton « Attention » pour voir le temps moyen que les visiteurs passent sur différentes parties de la page.
Les zones rouges indiquent une attention plus élevée, tandis que les zones bleues en reçoivent moins.
C'est tout – Vous avez configuré avec succès des cartes thermiques WordPress à l'aide de Microsoft Clarity !
Méthode 2 : Configurer des cartes thermiques WordPress à l'aide de UserFeedback
UserFeedback by MonsterInsights vous permet de créer des sondages qui incluent une question de carte thermique visuelle, permettant aux utilisateurs de cliquer sur une image pour donner leur avis.
C'est une excellente option pour les sites Web en croissance, les boutiques en ligne et les agences qui souhaitent des informations plus approfondies et plus de contrôle sur la collecte des commentaires des visiteurs.
Chez WPBeginner, nous avons utilisé UserFeedback pour mieux comprendre ce que nos clients en conception Web veulent et attendent de nous. Nous avons eu une excellente expérience avec, et vous pouvez consulter notre avis complet sur UserFeedback pour voir pourquoi nous le recommandons.
Étape 1 : Installer et activer UserFeedback
Tout d'abord, vous devrez créer un compte UserFeedback. Vous pouvez le faire en visitant le site Web UserFeedback et en vous inscrivant à un forfait.
💡 Remarque : Il existe une version gratuite de UserFeedback pour explorer ses fonctionnalités, mais vous aurez besoin du plan Elite pour débloquer la fonctionnalité Heatmaps.
Une fois que vous aurez créé un compte, vous serez redirigé vers le tableau de bord de votre compte UserFeedback, où vous trouverez le lien de téléchargement du fichier zip UserFeedback et votre clé de licence.
Il est maintenant temps d'installer le plugin.
Depuis votre tableau de bord WordPress, vous devez aller dans Extensions » Ajouter.
Sur l'écran suivant, recherchons UserFeedback.
Vous pouvez ensuite installer et activer le plugin comme n'importe quel autre plugin WordPress.
Vous débutez avec l'installation de plugins ? Voici un guide détaillé sur comment installer un plugin WordPress.
Une fois activé, vous pouvez saisir votre clé de licence pour débloquer toutes les fonctionnalités professionnelles incluses dans votre plan.
Pour ce faire, vous pouvez naviguer vers UserFeedback » Paramètres. Ensuite, copiez et collez simplement votre clé de licence depuis votre tableau de bord UserFeedback dans le champ « Clé de licence ».
Cliquez sur le bouton « Vérifier » pour lancer le processus de vérification.
En quelques secondes, vous devriez voir un message de succès de la vérification.
Étape 2 : Activer le module complémentaire Heatmaps
Maintenant, allons dans UserFeedback » Modules complémentaires pour installer le module complémentaire Heatmaps.
Vous pouvez simplement faire défiler la page pour trouver le module complémentaire Heatmaps et cliquer sur « Installer le module complémentaire » dans la boîte appropriée.
Une fois installé, assurez-vous qu'il est activé en cliquant sur le bouton « Activer ».
Étape 3 : Créer une nouvelle carte thermique
Avec le module complémentaire Heatmaps activé, vous pouvez maintenant créer la carte thermique de votre site.
Allons dans UserFeedback » Heatmaps dans votre tableau de bord WordPress, et cliquez sur le bouton « Nouvelle carte thermique ».
Dans la fenêtre contextuelle qui apparaît, développez le menu déroulant pour sélectionner la page spécifique que vous souhaitez suivre. Par exemple, vous pouvez créer une carte thermique pour votre page d'accueil, une page de destination ou un article de blog.
Cliquez sur le bouton « Créer » pour configurer la carte thermique.
Étape 4 : Afficher les résultats de votre carte thermique
Après avoir créé une carte thermique, UserFeedback commencera immédiatement à collecter les données des utilisateurs.
Allons dans UserFeedback » Heatmaps et cliquons sur une carte thermique pour voir des informations visuelles détaillées.
Sur l'écran suivant, vous pourrez consulter des informations détaillées sur vos visiteurs, notamment :
- Filtre par appareil – Comparez le comportement des utilisateurs sur ordinateur, tablette et mobile.
- Clics – Voyez exactement où les gens cliquent sur votre page.
- Mouvements de souris – Suivez la façon dont les utilisateurs déplacent leur souris sur l'écran.
Si vous faites la promotion de votre site sur plusieurs canaux, vous pouvez également filtrer les données par campagne UTM, source ou support. Cela vous aide à comprendre comment les visiteurs issus de différents efforts marketing interagissent avec votre site.
Et voilà – vous avez configuré avec succès des cartes de chaleur WordPress à l'aide de UserFeedback !
Étapes bonus : Maximisez vos insights de heatmap 🔥
Les cartes thermiques ne sont utiles que si vous savez comment agir sur ce qu'elles vous disent. Voici comment transformer ces informations en améliorations pratiques pour votre site WordPress.
Corrigez les points où les visiteurs abandonnent
Vous pouvez utiliser les cartes de défilement pour voir jusqu'où vos visiteurs descendent sur une page. Si un contenu important est enfoui trop bas sur la page, la plupart des gens ne le verront peut-être jamais.
Vous pouvez essayer de déplacer des éléments clés comme les appels à l'action ou les offres plus haut sur la page, et diviser les longues pages en sections plus petites avec des titres clairs. Vous pouvez également utiliser des filtres de date pour suivre l'impact de ces changements sur le comportement des visiteurs au fil du temps.
Ce petit changement peut réduire les taux de rebond et maintenir l'engagement de vos visiteurs plus longtemps.
Repérer et résoudre la confusion des utilisateurs
Parfois, les visiteurs essaient de cliquer sur des images, des icônes ou du texte qui ne sont pas cliquables. Cela montre qu'ils sont confus ou qu'ils s'attendent à quelque chose de différent.
Vous pouvez examiner vos cartes de clics et vos mouvements de souris pour repérer ces zones. Si nécessaire, vous pouvez lier ces images ou ajouter des boutons à proximité pour faciliter les choses aux utilisateurs.
Vous pouvez également configurer un sondage UserFeedback rapide pour demander ce que les utilisateurs s'attendaient à trouver.
Identifier et corriger les problèmes de navigation
Si vous constatez que les visiteurs naviguent fréquemment entre les pages sans direction claire, c'est un signe que votre navigation est peut-être confuse.
Simplifiez votre navigation en vous assurant que les informations sont faciles à trouver et en ajustant tout ce qui pourrait causer de la confusion. Vous pouvez également parcourir les étapes importantes de votre site comme un visiteur novice pour vous assurer que tout fonctionne correctement.
Vous voudrez peut-être aussi consulter notre guide sur comment créer un menu de navigation personnalisé dans WordPress.
Rendez vos boutons d'appel à l'action impossibles à manquer
Si vos CTA (boutons d'appel à l'action) ne reçoivent pas assez de clics, essayez de changer leur couleur, leur texte ou leur emplacement afin qu'ils ressortent davantage.
Utilisez vos informations sur les mouvements de souris pour repérer les hésitations avant de cliquer et vérifiez les filtres d'appareils pour vous assurer que vos CTA sont visibles et faciles à cliquer sur tous les appareils, en particulier sur mobile.
🧑💻 Astuce de pro : Apporter des modifications à votre contenu et à votre design n'est que le début. Je vous recommande également vivement de configurer des tests A/B pour comparer différentes versions d'une page ou d'un élément, comme l'emplacement des boutons, les couleurs ou le texte du titre, afin de voir ce qui fonctionne le mieux.
Pour des instructions détaillées, veuillez consulter notre guide sur comment faire des tests A/B dans WordPress.
Guides connexes sur l'optimisation des conversions WordPress
Nous espérons que cet article vous a aidé à configurer les heatmaps WordPress.
Ensuite, vous voudrez peut-être consulter notre liste de conseils avancés pour les pages de destination, sélectionnés par des experts, afin d'augmenter les conversions, ou notre guide ultime sur le ciblage géolocalisé dans WordPress :
- Conseils pour les pages de destination afin de faire décoller les conversions WordPress
- Meilleures pratiques pour les CTA afin d'améliorer les conversions des pages de destination
- Comment faire des tests A/B dans WordPress
- Comment effectuer facilement des tests de régression visuelle dans WordPress
- Guide ultime sur le ciblage géolocalisé dans WordPress
- Meilleurs outils d'optimisation de la conversion pour WordPress
Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.
Vous avez une question ou une suggestion ? Veuillez laisser un commentaire pour lancer la discussion.