Heatmaps Shopify : comment repérer vos fuites de conversion

Les heatmaps Shopify montrent où vos visiteurs cliquent, scrollent et hésitent, pour repérer vos vraies fuites de conversion au lieu de deviner quoi corriger.

Guilhem Teyssier·
Shopify Heatmaps: How to Find Conversion Leaks

Votre tableau de bord analytics indique que 68 % des visiteurs quittent votre fiche produit la plus vendue sans aller plus loin. Il ne dit pas pourquoi. Une heatmap, si.

Google Analytics vous dit ce qui s’est passé. Il compte les sessions, les ajouts au panier, les débuts de checkout. Il ne vous montre jamais le moment où le curseur d’un acheteur se fige sur une ligne de frais de livraison, ni l’endroit exact où 40 % des visiteurs mobiles arrêtent de scroller et s’en vont. C’est dans cet écart entre « ce qui s’est passé » et « pourquoi c’est arrivé » que la plupart des boutiques Shopify perdent de l’argent sans jamais le savoir.

Ce qu’une heatmap vous montre réellement

Une heatmap est une superposition colorée de votre page. Le rouge et l’orange signalent beaucoup d’activité. Le bleu et le vert, presque aucune. Trois types comptent pour une boutique Shopify : les cartes de clics, les cartes de scroll et les cartes de mouvement. Les cartes de clics montrent où les gens tapent ou cliquent, y compris sur des éléments non cliquables, ce qui révèle clairement que votre design les perturbe. Les cartes de scroll montrent jusqu’où les visiteurs descendent réellement dans la page. Les cartes de mouvement suivent le curseur sur ordinateur, ce qui correspond étroitement aux endroits où les gens lisent ou hésitent.

Rien de tout cela ne remplace le suivi de votre taux de conversion. Cela l’explique.

Là où les boutiques Shopify perdent vraiment des conversions

La plupart des marchands pensent que le problème vient du produit. C’est rarement le cas. Un e-commerçant a constaté un taux d’abandon de 80 % sur sa page de checkout avec ses outils d’analytics classiques, sans comprendre pourquoi, jusqu’à ce qu’il ajoute une heatmap et voie les acheteurs cliquer à répétition sur un estimateur de frais de livraison qui ressemblait à un bouton sans en être un. Ce n’est pas un problème de prix. C’est un problème d’interface déguisé en problème de prix.

Le schéma se répète à quatre endroits sur presque toutes les boutiques Shopify :

  • Les fiches produits, où les acheteurs cliquent sur des badges de confiance ou des guides des tailles non interactifs et n’obtiennent rien
  • Le panier, où les gens survolent les frais de livraison pendant plusieurs secondes avant d’abandonner
  • Les fiches produits sur mobile, où des contenus essentiels se trouvent sous la ligne de flottaison et ne sont jamais vus
  • Le checkout, où un seul champ déroutant peut faire chuter le taux de finalisation de plus de 10 points

C’est le mobile qui surprend le plus. Environ 60 % des visiteurs mobiles ne scrollent jamais assez loin pour voir un contenu qu’atteignent 80 % des visiteurs sur ordinateur, sur la même page. Si votre proposition de valeur principale, vos avis ou votre appel à l’action se trouvent sous cette ligne, vous êtes invisible pour la majeure partie de votre trafic. C’est l’une des principales raisons pour lesquelles les taux de conversion sur mobile restent inférieurs à ceux sur ordinateur dans tant de boutiques.

Aucun de ces quatre points ne nécessite une refonte. La plupart se règlent avec un libellé plus clair, une zone de clic plus grande ou un élément déplacé de huit pixels vers la gauche. Le plus difficile n’est pas la correction. C’est de savoir où regarder avant de passer une semaine à tâtonner.

Les trois types de heatmaps, comparés

Type de heatmap

Ce qu’elle révèle

Idéale pour

Carte de clics

Où les gens tapent ou cliquent, y compris les clics dans le vide sur des éléments non interactifs

Fiches produits, panier, navigation

Carte de scroll

Jusqu’où les visiteurs descendent avant de quitter la page

Landing pages, longues descriptions produits, pages collections

Carte de mouvement (ordinateur)

Mouvements du curseur, un indicateur de l’attention de lecture et des hésitations

Checkout, grilles tarifaires, pages comparatives

Combien de sessions il vous faut vraiment

Cinquante sessions vous mentiront. Ce n’est pas assez de données pour distinguer une vraie tendance d’un mardi quelconque. Il vous faut au moins 200 à 300 sessions sur une page avant qu’une heatmap commence à dire la vérité. Pour une décision importante, comme la refonte complète d’une fiche produit, attendez 500 sessions ou plus. En dessous de ce seuil, ce qui ressemble à une « zone à problème » n’est peut-être que trois personnes qui ont scrollé bizarrement.

La fréquence d’analyse compte aussi. Une fois qu’une page est stable, un contrôle mensuel suffit largement. Regarder plus souvent une page inchangée, c’est observer du bruit. Mais dès que vous lancez une nouvelle campagne, modifiez une mise en page ou constatez un pic de trafic, générez immédiatement une nouvelle heatmap. D’anciennes données sur une page modifiée vous parlent d’une page qui n’existe plus.

Une heatmap ne répare pas votre boutique. Elle vous empêche simplement de deviner quelle partie est cassée.

Lire une heatmap sans se mentir

Le biais de confirmation est le plus grand risque. Vous ouvrez une heatmap en étant déjà convaincu que votre image principale est le problème, et vous trouverez un moyen de le voir dans les couleurs. Ne partez pas d’une théorie. Partez des zones les plus froides d’une page qui devraient être chaudes, comme un bouton d’ajout au panier qui ne reçoit presque aucun clic, et remontez le fil à partir de là.

Croisez avec les données de votre tunnel avant de toucher à quoi que ce soit. Si votre taux de finalisation du checkout est correct mais que votre taux de passage de la fiche produit au panier est faible, la heatmap doit vous orienter vers la fiche produit, pas vers le parcours de checkout. Poursuivre la mauvaise page sur une intuition fait perdre des semaines. C’est aussi là qu’un A/B test, même sommaire, prouve son utilité : servez-vous de la heatmap pour formuler une hypothèse, puis testez la correction au lieu de supposer qu’elle a fonctionné.

Prix : ce que coûtent vraiment ces outils

Vous n’avez pas besoin d’une suite entreprise à 167 $ par mois pour commencer. Les outils de heatmap d’entrée de gamme pour Shopify coûtent à partir d’environ 4,99 $ par mois, avec un milieu de gamme confortable entre 19 et 55 $ par mois pour la plupart des boutiques en croissance. Gardez les offres premium, celles qui incluent des plateformes d’expérimentation complètes, pour le jour où vous mènerez des tests structurés sur plusieurs pages à la fois. La plupart des boutiques qui font moins de 500 000 $ de chiffre d’affaires annuel n’ont jamais besoin de dépasser le milieu de gamme.

Installer une heatmap sur Shopify sans toucher à votre thème

Vous n’avez pas besoin d’un développeur pour ça. La plupart des outils de heatmap s’intègrent à Shopify de la même façon : installez l’app, copiez un script de suivi dans la section head de votre thème (ou laissez l’app le faire automatiquement via l’intégration du Shopify App Store), et commencez à collecter des données en quelques minutes. Aucune modification Liquid, aucun thème de sauvegarde, aucun risque de casser votre checkout.

Un piège revient sans cesse : on installe l’outil, on regarde une heatmap au bout de deux jours et on en conclut que quelque chose ne va pas. Deux jours, ce n’est rien. Le trafic d’un mardi après-midi ne ressemble en rien à celui d’un samedi en pleine promotion. Laissez-lui le temps avant de tirer des conclusions, et excluez les visites de votre propre équipe : vos clics de test internes apparaîtront à coup sûr comme des points chauds rouge vif et vous induiront en erreur.

Segmentez par appareil dès le premier jour si l’outil le permet. Une heatmap unique qui fait la moyenne des comportements mobile et ordinateur est presque inutile, car les deux publics interagissent avec votre page de façons complètement différentes. Quelqu’un qui fait défiler une fiche produit du pouce sur son téléphone ne se comporte en rien comme quelqu’un qui la parcourt sur un écran de 27 pouces.

Les priorités si vous partez de zéro

  1. Installez d’abord un outil de heatmap sur vos trois pages les plus visitées : votre meilleure fiche produit, votre panier et votre page d’accueil. Pas sur tout votre catalogue.
  2. Laissez-le tourner sans y toucher pendant au moins deux à trois semaines, ou jusqu’à atteindre plus de 300 sessions par page, selon ce qui arrive en dernier.
  3. Analysez les cartes de scroll avant les cartes de clics. Les données de scroll vous disent si les gens voient seulement votre offre, avant même de vous soucier de ce sur quoi ils cliquent.
  4. Analysez le mobile et l’ordinateur séparément. Ne faites jamais la moyenne des deux. Ils racontent presque toujours des histoires différentes.
  5. Corrigez le plus gros clic dans le vide ou la plus forte chute de scroll que vous trouvez, puis mesurez à nouveau avant de toucher à autre chose.

Choisissez une page. Observez-la. Corrigez le problème le plus criant. Puis passez à la suivante.

Questions fréquentes

Prêt à convertir plus de visiteurs ?

7 jours d’essai gratuit, sans engagement. Vos premiers modules sont en ligne en 5 minutes.

Essayer gratuitement