Microsoft Clarity : le tuto complet pour installer l'outil, lire les heatmaps et respecter le RGPD

Microsoft Clarity est un outil gratuit d'analyse du comportement des visiteurs qui enregistre leurs sessions et produit des cartes de chaleur de chaque page de votre site. Là où Google Analytics 4 vous dit combien de personnes sont venues et d'où, Clarity montre ce qu'elles ont fait sur la page : le bouton qu'elles n'ont pas vu, la photo sur laquelle elles cliquent dix fois, le formulaire qu'elles abandonnent.

Dans les comptes que nous suivons pour des entreprises du Nord, c'est l'outil qui débloque une discussion de refonte : la vidéo d'un client qui cherche le prix pendant quarante secondes convainc plus qu'un taux de rebond. Encore faut-il l'installer proprement, le déclarer dans votre bandeau cookies et savoir quoi regarder.

Microsoft Clarity : définition et fonctionnalités

Microsoft Clarity est un outil d'analyse comportementale (UX analytics) : un script installé sur votre site capte les clics, les défilements et les mouvements de souris de chaque visiteur, puis les restitue sous forme de vidéos et de cartes. La documentation officielle (learn.microsoft.com/clarity) décrit ces briques :

• Les enregistrements de session (session replay) : la reconstitution de la visite d'un internaute, page après page, à partir des interactions captées.
• Les cartes de chaleur (heatmaps) : une superposition colorée, du bleu au rouge, qui agrège le comportement de tous les visiteurs d'une page.
• Le tableau de bord : sessions, appareils, sources et indicateurs de frustration détectés automatiquement.
• Les événements intelligents et les entonnoirs : neuf actions détectées sans configuration (achat, ajout au panier, contact, envoi de formulaire, demande de devis…) et jusqu'à 20 événements personnalisés créés sans code.
• Copilot : l'IA générative de Microsoft résume des sessions ou des heatmaps et répond à vos questions en langage naturel.
• La visibilité IA : les visites venues des assistants conversationnels et le passage des robots d'IA.

Selon la FAQ Clarity, l'outil est gratuit sans limite de sites, de trafic ni échantillonnage. La seule borne concerne les enregistrements : 100 000 sessions par projet et par jour, un plafond hors de portée d'une entreprise de taille moyenne. Microsoft précise que Clarity ne doit pas être utilisé sur des sites qui ciblent des moins de 18 ans.

Microsoft Clarity ou Google Analytics 4 : deux outils complémentaires

Clarity ne remplace pas GA4 : GA4 mesure et attribue le trafic et les conversions, Clarity explique ce qui se passe sur une page donnée. Quand GA4 signale qu'une page d'atterrissage convertit deux fois moins que les autres, Clarity montre pourquoi.

Si vous débutez avec GA4, commencez par les indicateurs GA4 qui comptent vraiment pour une entreprise : ils désignent les pages sur lesquelles ouvrir Clarity en priorité.

Installer Microsoft Clarity : code, Google Tag Manager ou WordPress

Pour installer Clarity, créez un compte gratuit sur clarity.microsoft.com, ajoutez un projet (un projet correspond à un site), puis posez le script de suivi par l'une des trois méthodes suivantes. Les premières données apparaissent dès que le code est en place.

Méthode 1 : coller le code dans le <head>

Dans Settings › Setup, choisissez Install manually › Get tracking code, puis collez le script dans la section <head> du gabarit commun de votre site. C'est direct, mais chaque modification, à commencer par le branchement du consentement, repasse par un développeur.

Méthode 2 : Google Tag Manager, notre recommandation

Google Tag Manager (GTM) est le gestionnaire de balises gratuit de Google : il ajoute des scripts sans toucher au code et les conditionne au consentement. Notre guide pour installer Google Tag Manager et créer vos premières balises détaille sa mise en place. Microsoft documente trois options :

1. La connexion automatique : Settings › Setup › Google Tag Manager › Finish setup, choix du compte et du conteneur, puis Create and publish.
2. Le modèle officiel : dans la galerie de modèles de GTM, ajoutez « Microsoft Clarity - Official », saisissez l'identifiant de projet (visible dans l'URL de votre projet, après /projects/view/) et déclenchez sur « All Pages ».
3. Une balise HTML personnalisée contenant le code de suivi.

Nous préférons le modèle officiel, maintenu par Microsoft. Si votre bandeau ne gère pas encore le Consent Mode, exigez analytics_storage dans les paramètres de consentement avancés de la balise.

Méthode 3 : l'extension WordPress officielle

Sur WordPress et WooCommerce : Extensions › Ajouter, recherchez « Microsoft Clarity », installez, activez, ouvrez le menu Clarity, connectez-vous et choisissez ou créez un projet. Tableau de bord, enregistrements et heatmaps s'affichent alors dans l'administration WordPress. Shopify, Wix, Squarespace ou Webflow ont leurs propres intégrations.

Vérifier l'installation. Le compteur d'utilisateurs en direct de Clarity doit bouger quand vous naviguez sur le site, et l'onglet Réseau de votre navigateur (clic droit › Inspecter) doit montrer des requêtes vers clarity.ms/collect. N'installez pas Clarity deux fois (extension et GTM) : les sessions seraient doublées.

Microsoft Clarity et le RGPD : le consentement est obligatoire en France

Microsoft Clarity dépose des cookies non essentiels : un site français doit recueillir le consentement du visiteur avant de l'activer. Depuis le 31 octobre 2025, Microsoft exige en plus qu'un signal de consentement lui soit transmis pour toutes les visites venant de l'Espace économique européen (EEE), du Royaume-Uni et de la Suisse, comme l'indique la page « Consent Management » de la documentation Clarity.

Pourquoi Clarity n'est pas exempté de consentement

La CNIL dispense de consentement certains outils de mesure d'audience, à condition qu'ils servent uniquement à mesurer l'audience pour le compte exclusif de l'éditeur, produisent des statistiques anonymes et ne permettent ni recoupement avec d'autres traitements ni suivi sur plusieurs sites. Clarity ne coche pas ces cases. Microsoft écrit lui-même que son usage normal « requiert des cookies non essentiels », il pose des cookies tiers comme MUID, qui identifie les navigateurs sur les sites Microsoft notamment à des fins publicitaires, et il demande de classer Clarity parmi les cookies non essentiels du bandeau. Les enregistrements, qui reconstituent un parcours individuel, sortent de toute façon d'une mesure purement statistique.

Votre bandeau doit donc bloquer les cookies de Clarity, dont _clck (identifiant du visiteur) et _clsk (lien entre les pages d'une session), tant que le visiteur n'a pas accepté, avec un refus aussi simple que l'acceptation. Notre article sur le bandeau cookies conforme au RGPD détaille ces règles.

Ce qui se passe sans signal de consentement

Le mode consentement de Clarity est activé par défaut pour les visiteurs européens. Sans signal, le script se charge mais collecte sans cookie, et la documentation en liste les effets : chaque page vue devient une session, chaque visiteur est compté comme nouveau, les entonnoirs affichent une perte totale à chaque étape et les réponses de Copilot peuvent être fausses. Un tableau de bord rempli de sessions d'une page et sans visiteur récurrent trahit un signal qui n'arrive pas. Si le visiteur refuse, Clarity supprime ses cookies et reste en mode sans cookie ; un consentement accordé vaut neuf mois au plus.

Transmettre le consentement à Clarity

Trois voies sont prévues. Google Consent Mode : si votre bandeau envoie déjà ses signaux à GTM ou gtag.js, Clarity les lit et les applique sans autre réglage. Une plateforme de consentement compatible (CMP), comme CookieYes cité par la documentation. Ou l'API Consent V2, appelée par votre bandeau au moment du choix :

window.clarity('consentv2', {
  ad_Storage: "denied",
  analytics_Storage: "granted"
});

analytics_Storage autorise la mesure, donc les fonctions de Clarity. ad_Storage autorise le partage de données avec Microsoft Advertising pour le reciblage et les conversions publicitaires. Reliez chacun à la bonne catégorie de votre bandeau (mesure d'audience, publicité) au lieu de tout accorder d'un seul bouton.

Informer vos visiteurs. La FAQ Clarity est explicite : vous devez informer vos utilisateurs. Votre politique de confidentialité mentionne Clarity, les données captées (enregistrements, cartes de chaleur), leurs finalités et renvoie à la déclaration de confidentialité de Microsoft, qui fournit des modèles de texte. Microsoft indique stocker les données sur Azure ; les clients européens contractent avec Microsoft Ireland Operations Limited, qui encadre les transferts vers les États-Unis par des clauses contractuelles types. Ces pages vont de pair avec les mentions légales obligatoires de votre site.

Masquer les données sensibles dans Clarity

Le masquage remplace les contenus sensibles par des symboles dans le navigateur, si bien qu'ils ne sont jamais envoyés à Microsoft. Trois modes se règlent dans Settings › Masking : Balanced par défaut (nombres et adresses e-mail masqués), Strict (tout le texte masqué) et Relaxed (rien de masqué hors formulaires). Le contenu des champs de saisie et des menus déroulants est masqué dans tous les modes : ce que vos clients tapent n'est jamais enregistré.

Pour un espace client ou un récapitulatif de commande, ajoutez l'attribut data-clarity-mask="True" au bloc HTML concerné. Un changement de masquage met jusqu'à une heure à s'appliquer et ne vaut pas pour les enregistrements passés. Excluez enfin les adresses IP de vos bureaux (Settings › IP blocking, IPv4 uniquement) pour que vos propres visites ne faussent pas les cartes.

Comment lire une carte de chaleur Clarity

Une carte de chaleur Clarity agrège les interactions de tous les visiteurs d'une page, du bleu pour les zones froides au rouge pour les zones chaudes. Elle se génère sans délai et sans seuil minimal de trafic, dans la limite de 100 000 pages vues par carte. Cinq types existent :

• La carte des clics, calculée élément par élément, avec des filtres sur les clics morts, les clics de rage, les clics suivis d'une erreur, les premiers et les derniers clics ;
• La carte de défilement, qui donne par tranche de 5 % la part des visiteurs ayant atteint chaque niveau, avec le « pli moyen » (ce qu'on voit sans faire défiler) ;
• La carte d'attention, qui montre le temps moyen passé sur chaque partie ;
• La carte des zones, qui totalise les clics dans un périmètre que vous dessinez ;
• La carte de conversion, disponible quand Clarity détecte des achats, qui relie chaque zone cliquée au taux d'achat.

Séparez toujours mobile et ordinateur avec le sélecteur d'appareil, filtrez par source quand une campagne arrive sur la page, et mesurez l'effet d'une modification avec la fonction Compare. Le bouton Summarize heatmaps fait rédiger par Copilot un premier résumé, sans exploiter les cartes de zones ni de conversion.

Clics de rage, clics morts, défilement excessif : les indicateurs à surveiller

Les indicateurs de frustration de Clarity signalent automatiquement les sessions où un visiteur a buté sur votre page. Les définitions ci-dessous reprennent la page « Semantic metrics » de la documentation, et la dernière colonne la correction que nous appliquons en pratique.

Un clic mort peut venir d'une page qui répond trop lentement. Si vous en relevez beaucoup sur mobile, contrôlez le temps de réponse et les Core Web Vitals de votre site avant de redessiner quoi que ce soit.

Exemple : ce que révèle la heatmap d'une fiche produit

L'exemple suivant est illustratif, avec des constats fictifs : la fiche produit d'un e-commerce de décoration lillois qui vend une lampe en céramique en trois coloris. GA4 montre un bon taux d'ajout au panier sur ordinateur, faible sur mobile.

Carte des clics, filtre mobile. La photo principale concentre les clics de rage : les visiteurs essaient de l'agrandir et rien ne se passe. Les pastilles de couleur reçoivent des clics morts, car ce sont de simples images. Correction : une galerie plein écran au toucher et de vrais sélecteurs de variante.

Carte de défilement. Le pli moyen tombe juste au-dessus du bouton « Ajouter au panier », repoussé par un long texte d'ambiance. Correction : remonter prix et bouton sous la photo, replier la description dans un accordéon, ajouter un bouton fixe en bas d'écran.

Carte d'attention. Le bloc « Livraison et retours », en bas de page, retient longtemps ceux qui l'atteignent : ils cherchent les frais de port avant de s'engager. Correction : afficher délai et coût de livraison à côté du prix.

Enregistrements. Une dizaine de sessions filtrées sur les clics morts révèlent un détail absent des cartes : sur certains téléphones, la bannière cookies masque le bouton d'achat tant qu'elle n'est pas fermée. Correction : une bannière plus compacte.

Après mise en ligne, la boutique compare les cartes avant et après et suit l'ajout au panier mobile dans son tableau de bord GA4. La méthode vaut pour une page contact : sur celle d'un cabinet d'expertise comptable, des clics morts sur le numéro de téléphone disent qu'il faut le rendre cliquable. Les principes d'une landing page qui convertit aident ensuite à prioriser.

Exploiter les enregistrements de session et Copilot

Les enregistrements de session servent à comprendre un comportement que les cartes ont repéré : regardés au hasard, ils font perdre des heures. Partez d'une question précise et filtrez, par exemple « sessions mobiles venues de Google Ads, arrivées au panier, avec un clic de rage ». Les filtres couvrent l'appareil, la source, les pages, les événements et les erreurs, et s'enregistrent en segments réutilisables.

Copilot accélère ce tri : il résume une session ou un groupe de sessions en quelques phrases et répond à des questions comme « quelles pages ont le plus de clics morts cette semaine ? ». Microsoft rappelle que ces réponses d'IA générative peuvent contenir des erreurs : vérifiez dans un ou deux enregistrements avant de décider. Les enregistrements sont conservés 30 jours, ceux mis en favoris 9 mois : gardez ceux qui illustrent un problème, ils serviront à convaincre.

Relier Microsoft Clarity à Google Analytics 4

L'intégration GA4 importe vos données Google Analytics dans Clarity pour passer d'un chiffre aux enregistrements et heatmaps correspondants. Elle se configure dans Settings › Setup › Google Analytics integration › Get started, avec une seule propriété par projet. Un tableau de bord « Google Analytics » apparaît alors dans Clarity (audience, acquisition par canal et source/support, pages populaires, pays, appareils), chaque carte ouvrant les sessions de la même période.

Clarity n'envoie pas l'URL de lecture des sessions dans GA4, précise la documentation. Attendez-vous aussi à des chiffres différents entre les deux outils, qui ne traitent pas de la même façon les sessions, les robots et le consentement. Pour lire vos sources de la même manière des deux côtés, appuyez-vous sur des paramètres UTM correctement construits.

Trafic IA et robots : les nouveautés 2026 de Clarity

Clarity mesure désormais les visites humaines arrivées depuis un assistant d'IA et le passage des robots d'IA sur vos pages. Les visites sont classées dans deux canaux, AIPlatform (lien dans une réponse) et PaidAIPlatform (annonce dans un assistant), pour ChatGPT, Claude, Copilot, Gemini et Perplexity. Seules les visites depuis les sites de ces assistants sont comptées : les AI Overviews de Google n'y figurent pas.

Le tableau de bord « Bot Activity » s'appuie, lui, sur les journaux de votre CDN (le réseau qui sert vos pages : Cloudflare, Fastly, Amazon CloudFront, Azure Front Door), avec d'éventuels frais facturés par ce dernier ; la dernière extension WordPress l'active par défaut. Comme le rapportait Abondance le 14 août 2026, Clarity y a ajouté l'indicateur « AI Scrape-to-Referral Ratio », qui compare les pages aspirées par une IA aux visites qu'elle renvoie : dans l'exemple publié par Microsoft, un outil d'IA ayant envoyé 41 visites affichait environ 6 000 pages aspirées par visite rendue. Aucun ratio cible n'est universel.

Pour une entreprise, l'intérêt est de voir si les visiteurs venus de ChatGPT achètent ou repartent, et d'objectiver l'ouverture ou le blocage de certains robots. Notre article pour mesurer votre visibilité dans les IA replace ces données dans un suivi complet, et notre guide pour être cité par ChatGPT et les moteurs IA explique comment augmenter ces visites.

Les erreurs fréquentes avec Microsoft Clarity

Les problèmes que nous trouvons en reprenant un site équipé de Clarity viennent du paramétrage, rarement de l'outil.

• Aucun signal de consentement : sessions d'une page et entonnoirs à zéro, diagnostiqués en une minute avec le test de console.
• Clarity chargé avant le choix du visiteur, ou rangé parmi les cookies « nécessaires » du bandeau.
• Deux installations en parallèle, par exemple un code en dur oublié après une refonte.
• Les visites internes de l'entreprise et de l'agence web mêlées aux autres.
• Des conclusions tirées de trois enregistrements au lieu d'une carte portant sur des centaines de pages vues.
• Une politique de confidentialité muette sur Clarity.

Nous installons Clarity sur la plupart des sites que nous suivons, couplé à GA4 et à un bandeau qui transmet le consentement, puis nous en tirons chaque mois une courte liste de corrections. C'est l'une des briques de notre accompagnement data et analytics : l'outil est gratuit, l'analyse et la mise en conformité font la différence.