Article

8min lecture

Server-Side Testing : Définition, Avantages et Exemples

AB Tasty a récemment mis à la disposition de ses clients une version Beta du Server-Side Testing. Cela ouvre un nouveau monde des possibilités de tests – mais cela nous a aussi fait comprendre que tout le monde n’est pas vraiment familier avec les tests server-side, quand sont-ils utiles et comment ils peuvent être pleinement exploités ?

Alors, voici un bref récapitulatif pour ceux d’entre vous qui s’interrogent encore sur le Server-Side Testing !

Les tests Server-side et client-side

Avant de nous lancer dans la définition et les explications, reprenons la terminologie. Nous avons fait le choix de ne pas traduire ces termes, pour ne pas rentrer dans des confusions de langues !

Si vous utilisez une solution SaaS d’optimisation de site web (comme AB Tasty), vous connaissez déjà les solutions de test server-side et test client-side.

Les tests client-side signifient simplement que les modifications liées à l’optimisation du site ne se produisent que dans le navigateur du visiteur, c’est-à-dire du côté du client. Pour faire cela, vous n’avez pas nécessairement besoin de connaissances en matière de développement web. C’est d’ailleurs une de nos promesses chez AB Tasty ! Même si parfois la connaissance de HTML, JS ou CSS peut être utile.

C’est l’une des principales choses à retenir sur les tests client-side : l’interface web est la salle de contrôle de vos tests et tous les scripts sont exécutés sur les navigateurs de vos visiteurs.

Image Source

Cependant, la facilité d’utilisation des tests client-side – peu ou pas de développement web nécessaire – comporte également des inconvénients. À savoir, le scope de vos tests reste largement lié au design : changement de couleur, contenu, mise en page, suppression ou ajout d’éléments, etc.

Avec les tests client-side, le scope de vos tests reste largement lié au design : changement de couleur, contenu, mise en page, suppression ou ajout d’éléments, etc.

Pour certaines entreprises, c’est très bien et déjà suffisant. Il existe d’innombrables idées de test que vous pouvez déployer en client-side, mais après un certain temps, beaucoup veulent aller plus loin. C’est là que le test server-side entre en jeu.

Client-Side Server-Side
Marketing + Tech Tech + Marketing
Agilité et Réactivité Scénarios avancés et Restrictions
WYSIWYG + HTML/CSS/JS Code / App Implementation
Contenu, UI et UX Fonctionnalités et Logique Business
Web Technologies Plateforme et Language Agnostique

Des tests plus riches avec le Server-side

Dans un certain sens, les tests server-side suppriment les solutions intermédiaires (le tag AB Tasty est utilisé pour les tests client-side). A la place d’une solution, les développeurs peuvent utiliser directement le code et accéder directement aux sources, ainsi travailler sur les serveurs qui vont charger le site sur le navigateur de l’utilisateur final. Les équipes Marketing peuvent toujours définir les paramètres d’un test dans l’interface AB Tasty, mais toute l’implémentation se fait au niveau du serveur web.

Les campagnes client-side et server-side sont définies dans la même interface AB Tasty. Dans la capture d’écran ci-dessus, vous pouvez définir vos variations, vos objectifs ainsi que l’allocation du trafic (dynamique ou non). Oui tout ça dans la même interface ! Le design des variations est l’étape juste après.

Nous générons les identifiants associés et fournissons à vos développeurs des instructions pour prendre en charge votre implémentation.

Étant donné que l’implémentation des tests server-side est plus directe, cela permet des tests et des campagnes d’optimisation beaucoup plus riches.

Cependant, le fait est que pour implémenter des tests server-side il est indispensable de maîtriser les langages de back-end, tels que PHP, Node.js ou Python. Si c’est votre équipe marketing qui exécute votre stratégie CRO, elle est peut-être déjà accompagnée d’un développeur web. D’autres peuvent chercher à embaucher ce profil en freelance. Quoi qu’il en soit, si vous souhaitez démarrer avec des tests server-side, vous allez avoir besoin de deux choses :

  • Un accès au code source de votre site web
  • Un développeur compétent pour configurer et gérer les campagnes server-side

Les avantages et les limites

Entre les tests client-side et server-side, il n’existe pas une méthode mieux que l’autre – les deux ont leur place dans une stratégie CRO. Il s’agit de choisir ce qui convient à votre entreprise en fonction de vos ressources et de vos objectifs. Très souvent, vous voudrez utiliser les deux techniques à la fois.

Les avantages du client-side testing

  • Simple et rapide à lancer ou à complexifier
  • Pas besoin d’avoir des connaissances en développement web (les équipes marketing ne sont pas dépendantes des équipes techniques)
  • Toutes les données de test stockées dans une interface SaaS claire et lisible

Les limites du client-side testing

  • La portée des tests est de nature « esthétique » (forme, couleur, configuration)
  • Difficile ou impossible d’impliquer plusieurs canaux (desktop, mobiles, IoT…)

Les avantages du server-side testing

  • Test complexe, riche
  • Omnicanal

Les limites du server-side testing

  • Des compétences en développement web sont indispensables
  • Les équipes marketings sont moins autonomes

Avec AB Tasty, vos tests server-side bénéficieront des mêmes avantages que les client-side : reporting riches, statistiques bayésiennes fiables et algorithme d’allocation dynamique du trafic vous permettant d’optimiser au maximum chaque visite sur votre site.

Quelques exemples de tests server-side

Mais, le server-side testing vaut-il l’investissement ? Cela dépend de vos ressources, de vos objectifs et de votre niveau de maturité. Certains des exemples suivants illustrent à quel point les tests server-side peuvent être puissants :

Passer du “freemium” au “premium” en douceur

Les entreprises qui proposent une version gratuite de leur produit savent qu’à un moment donné, elles vont devoir commencer à facturer ces services aux clients. La question est, à quel moment exactement ?

C’est la question que se posait AlloVoisins, un site web français d’échanges de services entre voisins. Grâce à la solution server-side d’AB Tasty, ils ont pu effectuer un test d’un mois pour déterminer combien d’annonces gratuites on pouvait publier (et accepter) avant de devoir passer à la version payante. Jauger le moment idéal leur a permis de continuer à offrir un service gratuit pour attirer de nouveaux clients, sans perdre des revenus.

Trouver la limite idéale pour la livraison gratuite

Déterminer la valeur limite du panier avant d’offrir la livraison gratuite … Un problème majeur pour de nombreux sites e-commerce. Une approche server-side testing peut vous aider à déterminer la limite idéale qui incite vos clients à acheter, sans trop dépenser.

Tester vos algorithmes de recherche

Tout test lié à votre moteur de recherche ou “searchandizing” doit passer par une approche server-side. Pourquoi ? Les tests impliquant un nombre de produits consultés, la vitesse à laquelle les produits sont ajoutés au panier, le taux de transaction, la valeur moyenne des commandes… Tous ont besoin d’une méthodologie server-side.

Trouver le formulaire de Paywall idéal

Si vous êtes un média en ligne, les paywalls font probablement partie de votre site web.

Il est possible de mettre en place un paywall client-side, mais les internautes pourront facilement les contourner en supprimant leurs cookies ou leur historique de navigation. Pour une solution fiable à 100%, les règles de déclenchement doivent être gérées côté serveur. De cette façon, vous pouvez tester en toute sécurité l’impact de différents types de configurations de paywall sur votre taux d’abonnement.

Je veux en savoir plus sur le server-side testing avec AB Tasty!

Vous souhaitez en savoir plus sur les tests server-side ? Consultez notre ebook sur 10 tests que vous ne pouvez exécuter que côté serveur.

Prêt pour la prochaine étape ? Contactez-nous pour en savoir plus sur notre solution Contact@abtasty.com

Article

9min lecture

Que Cache l’Optimisation d’un Site Web ?

Si vous possédez un site Internet, alors vous savez à quel point il est important que celui-ci soit optimisé pour attirer du trafic et générer des ventes (ou des leads) grâce à un bon taux de conversion.

Mais qu’entend-t’on réellement par l’optimisation d’un site web ?

Définition : L’optimisation d’un site web comprend toutes les pratiques techniques et marketing mises en oeuvre pour acquérir du trafic, engager les visiteurs puis les convertir en prospects ou en acheteurs à partir d’une méthode clairement définie qui répond à des objectifs fixés au préalable.

Au-delà de cette définition, il est difficile de distinguer les différents éléments qui constituent l’optimisation d’un site web – tant il y en a.

En réalité, le sujet est si vaste qu’il regroupe plusieurs métiers et compétences nécessaires pour pouvoir couvrir l’ensemble des actions et correctifs à mettre en place pour optimiser son site.

Du design au développement en passant par la vitesse d’affichage et le SEO, nous vous proposons de découvrir les bases de l’optimisation des sites internet grâce à une approche en 3 chapitres.

1. L’optimisation du référencement naturel (SEO)

Search Engine Optimization

Le SEO ou “référencement naturel” est une discipline du marketing digital qui comprend les sous-activités liées au positionnement d’un site internet sur des mots-clés ciblés au préalable sur le moteur de recherche de son choix.

En France, c’est sur Google qu’a lieu l’extrême majorité du SEO : Yahoo et ses concurrents n’ont jamais vraiment réussi à pénétrer le marché français.

Qui dit “Google” dit donc “algorithmes” : l’entreprise californienne qui règne en maître sur les recherches en ligne produit fréquemment des mises à jour de ses algorithmes qui déterminent les “lois” qui font qu’un site internet peut se référencer sur tel ou tel mot-clé.

Le référencement naturel, c’est donc pour votre entreprise sa capacité à se référencer sur Google de façon ciblée et précise : vous cherchez avant tout à vous positionner sur les mots-clés qui vous rapporteront des visiteurs utiles et qualifiés.

Si beaucoup de mythes et de croyances existent autour du SEO, sachez que l’époque de l’achat en masse de liens à faible autorité est révolue : Google pénalise désormais les sites internet qui possèdent des liens externes sans rapport avec leurs sites.

En 2018, le SEO se base sur 3 piliers fondamentaux qui vous permettent de vous référencer.

Le contenu de votre site

Le contenu de votre site est ce qui alimente votre référencement : il est la base même sur laquelle s’appuie Google pour “crawler” votre site et interroger votre contenu afin d’en afficher des résultats sur le moteur de recherche.

Bien au delà du simple remplissage, la création de contenus et de ressources de qualité vous permet d’engager vos visiteurs et de vendre vos produits et solutions : c’est avec le design, l’aspect le plus crucial de votre site.

Évidemment, le contenu de votre site peut se présenter sous plusieurs formes (écrites, visuelles et vidéo) et contiendra les mots-clés sur lesquelles vous souhaitez vous référencer.

Enfin, un contenu de qualité se prête forcément au partage : lorsque votre contenu est partagé, Google interprète cela comme un signal positif.

L’optimisation on-page

En SEO, l’optimisation on-page regroupe tous les aspects techniques nécessaires au référencement sur Google.

Pour aller à l’essentiel :

  • Votre balisage doit être cohérent et doit contenir vos mots-clés ciblés.
  • Votre site doit avoir une bonne vitesse de chargement.
  • Votre site doit être responsive.
  • Votre soit doit être sécurisé via le protocole HTTPS.
  • L’architecture de votre site doit être cohérente et organisée.

Les liens

Même si c’est de moins en moins le cas, les liens sont le carburant du SEO. De façon assez intuitive, Google interprète positivement le fait que plusieurs sites en lien avec votre activité “pointent” vers le vôtre avec un lien externe.

Lorsque vous partagez du contenu ou que vos utilisateurs partagent votre site, vous augmentez la probabilité qu’un site relaye une information ou parle de vous : vous créez donc naturellement des liens externes.

2. L’optimisation des performances techniques

Page speed optimization

Les performances techniques sont le moteur de votre site internet et conditionnent l’efficacité avec laquelle vos visiteurs vont pouvoir visiter et interagir avec votre site : elles sont donc un élément central de l’optimisation des sites web.

Complémentaire au SEO, l’optimisation technique conditionne également des facteurs de performance qui viendront influencer la capacité de votre site à se référencer sur Google.

Pour aller droit au but et vous faire gagner du temps, nous avons scindé cette partie en trois :

L’optimisation de la vitesse

La vitesse d’affichage d’un site est un des indicateurs de performances les plus cruciaux qui soient : on estime en effet que vous risquez de perdre du trafic à partir de 2.5-3 secondes de chargement et que le taux d’abandon grimpe en flèche à partir de 5 secondes.

Les facteurs de ralentissement d’un site web sont nombreux. Il existe cependant plusieurs (merveilleux) outils qui vous permettent d’obtenir un diagnostic rapide de la situation :

En améliorant la vitesse, vous diminuez l’abandon dû à la lenteur de chargement et contribuez également à améliorer votre SEO.

À titre d’exemple, la BBC a calculé qu’elle perdait 10% de son trafic par seconde supplémentaire lors du chargement de ses pages (voir l’étude).

L’affichage sur mobiles et tablettes

En 2018, 52% du trafic mondial est généré par les mobiles avec lesquels la navigation sur Internet s’est fortement améliorée au cours des 5 dernières années.

Pour certains secteurs (dont le shopping !) la part du trafic mobile peut être encore plus élevée et atteindre 70-80% pour certains sites.

Avec une telle utilisation des smartphones sur Internet, il est donc impératif que votre site internet soit optimisé (on parle de “responsive”) pour l’affichage sur mobiles et tablettes.

Si vous créez des landing pages, sachez qu’il existe plusieurs outils de création de landing page qui proposent des templates 100% responsive : un bon moyen de gagner du temps lors de la création de ses pages.

Faire en sorte que son site soit “responsive”, c’est donc créer sa page de façon à ce que le contenu affiché s’adapte à la taille de la fenêtre d’affichage utilisée par le visiteur.

Pour plus d’informations, vous pouvez consulter le guide Google dédié à la création de pages web adaptatives.

Les erreurs de pages et l’hébergement

Les erreurs de chargement : tout le monde connaît. Elles prennent la forme d’un protocole HTTP de type 4XX ou 5XX dont les plus courantes sont :

  • 404 (not found)
  • 403 (forbidden)
  • 401 (unauthorized)
  • 400 (bad request)
  • 500 (internal server error)

Le problème des erreurs de page, c’est qu’elles signent souvent la fin de la visite pour les visiteurs qui tombent sur elles.

À l’aide d’un crawler, vous pourrez cependant identifier les erreurs des pages de votre site afin de les rediriger vers des ressources utiles. Pour cela, des outils comme Screaming Frog ou Botify peuvent vous aider.

Lorsque les problèmes de performances ne viennent pas de votre site, ils peuvent venir de votre hébergement : c’est à dire de l’organisme qui héberge les données de votre site qui sont chargées par un internaute lorsqu’il visite votre site.

Pour résoudre ce problème, il existe 2 solutions :

  • Changer d’abonnement (dans le cas où votre trafic dépasse les capacités comprises dans votre abonnement).
  • Changer de solution d’hébergement (dans le cas où vous êtes hébergés par une solution low-cost défaillante).

3. L’optimisation de la conversion et de l’expérience utilisateur

Conversion Rate and UX Optimization

L’optimisation des taux de conversion regroupe toutes les actions mises en place pour offrir une meilleure expérience de navigation et d’interaction entre vos visiteurs et votre site : c’est un aspect crucial pour tous les sites marchands.

En offrant une meilleure expérience d’utilisation, vous augmentez aussi naturellement le taux de conversion de votre site : les utilisateurs sont plus vite rassurés et comprennent mieux votre valeur-ajoutée.

En plus d’améliorer votre taux de conversion, une bonne expérience utilisateur (UX) augmente également votre taux de rétention et la fidélité de vos clients : vos utilisateurs sont plus susceptibles de revenir pour effectuer d’autres achats.

Pour améliorer votre expérience utilisateur, il faut commencer par identifier les problèmes en analysant vos données.

Pour cela, des outils comme Google Analytics vous permettront d’obtenir des informations cruciales sur :

  • Le type d’utilisateurs (par âge, géographie, sexe…)
  • Le taux de rebond
  • Le taux de conversion
  • L’abandon du panier

Il existe évidemment de nombreuses autres données à exploiter pour comprendre l’intégralité des mécanismes d’expérience utilisateur qui ont lieu sur votre site, mais ces 4 premiers vous aideront déjà à cibler les problèmes les plus importants.

Pour aller plus loin, utilisez ensuite une solution d’analyse de données plus poussée comme celle d’AB Tasty. Avec notre solution, vous allez pouvoir suivre le comportement de vos utilisateurs et comprendre leurs interactions grâce aux fonctionnalités suivantes :

User Session Recording. Capturez les sessions de vos visiteurs et visualisez après coup leurs interactions sur votre site pour mieux comprendre leur comportement.

Heatmap et zones de chaleur. Visualisez de façon claire l’interaction de vos visiteurs grâce à des cartes de chaleur : vous savez où vos visiteurs cliquent et où se situent les blocages.

Enquête et feedback utilisateur. Gagnez du temps et demandez vous-même aux utilisateurs ce qui pourrait être amélioré sur votre site !

Segmentation de vos visiteurs. Tous vos clients ne sont pas les mêmes : segmentez le trafic de votre site pour créer des profils types auxquels vous pourrez proposer du contenu et des offres exclusives.

Tests A/B avancés. Utilisez l’A/B testing pour éprouver vos théories : améliorez vos pages et comparez-les aux versions précédentes pour trouver la formule qui fonctionne le mieux.

Lorsque qu’on cherche à optimiser son site, il est courant de ne s’attarder que sur un seul type d’optimisation (SEO ou UX par exemple) : c’est une erreur courante qui ne vous permet pas de réellement augmenter votre chiffre d’affaires.

En marketing digital, on considère que les 3 types d’optimisation (SEO, technique et UX) fonctionnent ensemble : il est inutile d’acquérir du trafic s’il est pas qualifié et si votre site ne permet pas de les convertir. À l’inverse, un site techniquement optimisé ne vous sera que peu utile s’il ne parvient pas à attirer du trafic qualifié.

Cet article vous a plu ? Découvrez nos solutions d’a/b testing et de personnalisation et décuplez rapidement le potentiel de votre site.

Article

10min lecture

Quels rôles jouent les émotions dans la prise de décision ?

Aujourd’hui, de nombreux marketeurs sont focalisés sur l’acquisition et les chiffres. Ils oublient trop souvent que les consommateurs finaux sont, de l’autre côté de l’écran, de vraies personnes. Comprendre comment l’esprit fonctionne est essentiel dans le domaine du marketing mais aussi dans toute stratégie digitale.

La neuroscience et le CRO (Conversion Rate Optimization) ont beaucoup plus de choses en commun qu’il n’y paraît. Il est important de savoir que le CRO est, en grande partie, basé sur la psychologie humaine : sommes-nous libres des décisions que nous prenons ? qu’est-ce qui conduit nos choix ? le libre arbitre peut-il se traduire au niveau neurologique ? En bref, qu’est-ce qui préside à nos prises de décisions ? La prise de décision est un champ qui suscite un grand intérêt dans les domaines tels que la psychologie, les neurosciences, la robotique et même l’économie, et on ne compte plus les modèles et logiciels de simulation de l’esprit humain.

Psychology is the magic bullet of conversion optimisation

– Neil Patel, Analytics Expert

Si vous parvenez à comprendre le fonctionnement du cerveau de l’homme, vous pouvez alors tirer parti de ces connaissances psychologiques pour améliorer vos interfaces digitales. Une stratégie CRO permet de transformer vos visiteurs en clients, mais elle permet aussi de les fidéliser et les engager. Plus facile à dire qu’à faire ! Utiliser le pouvoir des émotions afin d’optimiser son site web et mobile n’est pas du tout un concept nouveau. D’innombrables études ont démontré que les émotions ont un impact sur les consommateurs. Pour évoquer ces mécaniques complexes de prise de décision, voyons quels rôles jouent nos émotions à travers des exemples concrets. Et comment transformer ce constat en pratique.

La prise de décision, un mécanisme pas si rationnel

Aussi complexe et mystérieux soit-il, le cerveau humain est aussi très primitif. Cela semble contre-intuitif, mais la grande majorité des décisions que nous prenons provient de notre complexe amygdalien. Cette région de notre cerveau fait partie du système limbique : elle se base sur nos émotions et nos expériences passées pour prendre automatiquement des décisions beaucoup plus rapidement que notre “esprit conscient”.

Comment utiliser la force des émotions pour optimiser vos conversions ?

Utiliser les bonnes couleurs

Les couleurs peuvent changer notre perception, altérer nos sens, nous faire ressentir des émotions. Elles ont le pouvoir d’améliorer notre mémoire et notre attention, et même le pouvoir de nous convaincre de prendre certaines décisions. Connaître la signification des couleurs est clé pour nous permettre de mieux comprendre nos comportements.

Les couleurs vives captent l’attention et les couleurs froides sont plus rassurantes par exemple. Un Call-To-Action rouge permettra de créer un sentiment d’urgence. Le vert, quant à lui, inspire calme et confiance.

Source : Kissmetrics

Créer un échange rassurant

Notre comportement naturel nous dicte nos décisions. Par exemple, si une personne nous donne quelque chose, nous nous sentons obligés de rendre la pareille. L’échange mutuellement bénéfique entre les humains est un acte naturel. Transposer ce “réflexe” humain sur un site web permet de créer un contexte rassurant pour l’internaute. Il a face à lui une situation qu’il reconnaît et donc qui le rassure !

L’échange mutuel devient tout aussi commun en ligne : pour télécharger un eBook nous donnons notre adresse email, pour bénéficier de la livraison gratuite il faut atteindre un certain montant d’achat, etc. Dans l’exemple suivant, Hubspot a mis en place une pop-in pour proposer la création d’un compte gratuitement. Dans cette étape, on peut lire un élément de rassurance “pour toujours” à l’image d’un échange entre deux personnes humaines.

Source : Hubspot

Utiliser le stress marketing

En règle générale, les êtres humains ont besoin de cohérence logique et d’harmonie affective, mais il arrive que cette harmonie soit perturbée par des événements et des situations imprévus. Et il est tout à fait normal d’avoir besoin d’un environnement harmonieux pour prendre une décision “rationnelle”. Mais nos émotions nous font parfois faire un tout autre choix.

Par exemple, un internaute peut hésiter entre deux produits (ou marques) : quel est le meilleur le produit ? Pourquoi l’autre est moins cher ? Puis-je faire confiance à cette marque ? Autant de questions légitimes mais qui ne vont pas aider l’internaute, au contraire. En revanche, si le produit A affiche “il ne reste plus que deux articles en stock”, le produit B qui n’affiche rien, paraît bien moins attractif. Nos émotions apprécient la rareté et l’exclusivité !

Sur votre site vous pouvez afficher les stocks, comme Amazon le fait :

Source : Amazon

Ou bien mettre un décompte pour créer un stress marketing sur votre site, comme l’exemple d’Asos.

Source : Asos

Personnaliser la navigation de l’internaute, la clé pour toucher ses émotions

En tant qu’être humain, nous sommes sensibles à plusieurs niveaux : les couleurs, les mots, le design mais aussi à l’attention que l’on nous porte, les échanges avec autrui, etc. Et certaines choses ont une saveur différente lorsqu’elles sont personnellement adressées. Prenez l’exemple du bouquet de fleur, c’est une attention toujours agréable qui ravive nos émotions. Mais accompagné d’un mot personnalisé, ce geste prend un tout autre sens et marque notre esprit.

Tous les experts du CRO (Conversion Rates Optimization) le savent : les petits détails peuvent avoir un grand impact. Mais saviez-vous à quel point une petite modification dans la navigation de vos internautes peut grandement améliorer leur perception de votre produit / service ? En quoi la personnalisation et l’engagement des internautes sont des éléments clés pour optimiser les conversions ?

Comment utiliser la personnalisation pour optimiser vos conversions ?

Offrir une exclusivité

L’exemple du bouquet de fleur démontre à quel point l’esprit humain peut être influencé par ses émotions. Ce n’est pas toujours le cas mais il faut le reconnaître, nous avons tendance à nous souvenir plus facilement de ce qui nous a affecté. Ce type de personnalisation fonctionne à la fois pour les internautes récurrents qui ont l’habitude de votre site mais aussi pour les nouveaux visiteurs. Il suffit de leur adresser le bon message : une offre spéciale pour la première commande par exemple, ou la livraison gratuite pour les acheteurs récurrents.

Source : Showroomprivé.com

Créer de l’engagement

Dans toutes les relations humaines, pour obtenir l’engagement de votre interlocuteur, il y a deux facteurs que vous devez prendre en considération : l’écoute et la réactivité. Ces éléments vous permettront de créer une conversation, de lui donner des réponses, le tout en utilisant une tonalité et des codes adaptés. En bref, vous alignez votre comportement à celui de l’autre, et vice-versa.
Sur un site web, reproduire cet échange permet de créer un engagement avec l’internaute. Proposer une action spécifique en réponse au comportement de l’internaute, c’est l’engager. Par exemple, après trois consultations d’un contenu proposer à l’internaute de se créer un compte paraît moins intrusif et en accord avec son comportement sur le site.

Source : Marmiton

Donner un coup de pouce à la décision

On peut dire qu’en psychologie humaine tout n’est pas que “certitude”, mais la “certitude” est dans toute prise de décision (ou presque). La certitude est une notion particulière et fondamentale chez le consommateur. On peut la définir comme le “degré d’assurance avec lequel le consommateur considère que sa croyance sur le produit est exacte”. Ainsi, à partir du moment où un acheteur est certain qu’un produit lui sera bénéfique, sa décision de l’acheter peut être confortée. Mais de nombreux sites web oublient que lorsque l’acheteur manque de certitude sur un produit, sa décision d’achat peut également en être directement affectée.

Il y a différentes raisons qui bloquent la “certitude” : le prix, les frais ajoutés (livraison), les avis des autres acheteurs, etc. Vous pouvez mettre en place une pop-in de rétention pour mettre en avant des offres (livraison offerte, avis consommateur, promotion, etc). L’idée est que cette pop-in se déclenche en fonction d’une action précise de l’internaute : s’il a mis des articles dans son panier et qu’il souhaite quitter la page, le notifier qu’il est sur le point de partir alors que son panier contient des articles ! Il est important d’afficher un message de réassurance au moment où l’internaute est en train de douter.

Source : Maisonic

 

Le marketing s’est longtemps basé sur l’hypothèse suivante : le consommateur est rationnel tant dans ses décisions d’achat que dans sa perception des messages. Dans ce contexte, les émotions étaient alors envisagées comme des éléments perturbateurs dans la prise de décision. Les neuroscientifiques démontrent qu’une très grande partie de nos actions vient de notre cerveau en dehors de la conscience et leurs études permettent d’adapter le marketing à cette réalité.

Les émotions sont aujourd’hui reconnues comme une part importante de notre processus de décision ! Comprendre les principes clés du mécanisme de prise de décision est indispensable pour convertir efficacement vos visiteurs en clients.

Article

6min lecture

Gémo développe sa stratégie digitale pour consolider sa relation client

Gémo (Groupe Eram), conçoit et propose depuis 25 ans une large gamme de chaussures, vêtements et accessoires au prix juste pour toute la famille. Gémo a su devenir un acteur incontournable de mode française avec 460 points de vente en France et 15 magasins à l’international. En 2011, Gémo devient le deuxième distributeur de chaussures et textiles en périphérie des villes.

Mais l’enseigne ne s’arrête pas là et compte bien développer sa stratégie au delà de ses points de vente. Depuis quelques temps, la marque a initié une stratégie digitale afin de consolider ses relations client, accroître sa visibilité et recruter de nouveaux adeptes.

 

Claire FREULON, Responsable e-Marketing et Damien BIGOT, UX Designer, reviennent sur leur démarche d’optimisation avec AB Tasty.

Pouvez-vous nous présenter les enjeux actuels de votre secteur ?

[Claire FREULON]

L’enjeu principal de notre secteur est de développer la stratégie digitale d’une manière générale. Le défi est de taille lorsqu’il s’agit d’une enseigne telle que Gémo dont le business est très centré sur son réseau de magasins.

Pour nous, l’objectif principal est d’accroître la visibilité de GÉMO sur un marché à forte concurrence. Les acteurs sont à la fois nombreux et variés si nous tenons compte des enseignes traditionnelles mais il y a aussi les pure players, les ventes à distance (VAD) ou encore les marketplaces. Tout cet environnement constitue un vaste choix pour le client potentiel … Nous savons que si nous ne répondons pas à ses attentes, il ne tardera pas à aller dans une autre enseigne.

Nous avons développé une vraie confiance avec nos clients en magasin, l’idée est de retranscrire cette relation privilégiée sur notre site web et mobile.

Pouvez-vous nous expliquer les raisons pour entreprendre une démarche d’optimisation sur votre site ?

[Claire FREULON]

Nous avons souhaité débuter une démarche d’optimisation sur notre site web avec pour objectif principal d’augmenter le chiffre d’affaire.

Rapidement, d’autres objectifs se sont dessinés et nous nous sommes rendus compte que des objectifs secondaires pouvaient également contribuer à l’augmentation du chiffre d’affaire comme : l’optimisation du taux de conversion, le recrutement de nouveaux clients (par exemple, la nouvelle génération de parents beaucoup plus connectés que les précédentes), l’augmentation de la visibilité de GÉMO, etc.

Et enfin, nous avons souhaité avoir la possibilité de tester et valider toutes les évolutions ou refontes avant de lancer les développements sur le site.

Quels étaient vos critères de sélection pour définir votre outil CRO ?

[Claire FREULON]

Comme nous sommes une structure importante en termes de ressources humaines, il nous fallait un outil facile à mettre en place pour gagner en agilité. Avant de choisir notre outil, nous avons pris soin de regarder les références clients des acteurs du marché. C’était important pour nous de travailler avec une solution qui comprenne et intègre nos enjeux et nos problématiques.

Autre critère qui a fait pencher la balance, c’est l’accompagnement. Nous étions véritablement intéressés pour être accompagnés et suivi dans notre stratégie d’optimisation.

Enfin, il était évident pour nous d’avoir une solution qui puisse s’intégrer simplement dans notre écosystème de solutions techniques existant. Comme nous sommes dotés d’un outil de gestionnaire de tags, la mise en place de l’outil AB Tasty a été facilitée.

Vous travaillez à deux sur vos projets d’optimisation : comment vous gérez votre complémentarité ?

[Claire FREULON]

Pour ma partie marketing et analytics, mes missions sont les suivantes :

  • je gère la roadmap avec le consultant AB Tasty
  • je soumets des propositions de tests en fonction des statistiques Analytics ou des benchmarks
  • je gère le rétroplanning et la tenue des délais de mise en place
  • je participe également à la recette des tests avant leur mise en ligne.

[Damien BIGOT]

De mon côté, je gère la mise en place opérationnelle des tests, de la maquette graphique à la programmation dans l’outil AB Tasty, ainsi que la recette et la planification.

Après la mise en place de la roadmap, on intègre les tests en fonction de leur niveau de priorisation. Nous utilisons l’outil de manière quasi-quotidienne, en particulier la brique Personnalisation, afin de mettre en avant nos services ou nos offres commerciales contextualisées grâce aux différentes possibilités de segmentation.

Le fait de pouvoir programmer le jour et la date de lancement ainsi que les arrêts des campagnes, c’est un grand plus pour les offres éphémères (comme par exemple, les ventes flash).

 

Pour continuer d’évoquer votre complémentarité : comment se déroule l’accompagnement par les équipes AB Tasty ?

[Claire FREULON]

L’équipe d’AB Tasty nous accompagne de manière régulière sur le sujet et ils sont très réactifs. Nous avons mis en place des points bimensuels. Nous suivons la planification des tests, et le respect de la roadmap. Enfin, ils nous accompagnent de manière opérationnelle lorsque nous avons des besoins développement plus complexes.

[Damien BIGOT]

Au début, j’utilisais principalement l’interface WYSIWYG (what you see is what you get : l’éditeur contextuel AB Tasty), à l’aide des modules disponibles dans l’outil. Puis rapidement, j’ai commencé à développer mes propres scripts afin de répondre au mieux à nos besoins et d’optimiser au maximum leurs exécution.

Bien-sûr, l’équipe d’AB Tasty est toujours disponible pour m’aider dans la configuration ou me faire découvrir de nouvelles fonctionnalités.

Dans quelle mesure notre solution répond-elle à votre besoin ?

[Damien BIGOT]

AB Tasty nous permet de tester des maquettes, de trouver des quick-wins, et de personnaliser notre site pour nos clients. Nous sommes bien sûr au tout début de notre partenariat et il nous reste de nombreux chantiers à mettre en place.

En termes d’organisation, nous essayons de respecter les bonnes pratiques pour gagner en efficacité. Par exemple, après chaque test, nous débriefons sur les données obtenues afin de valider, ou non, la mise en place de cette feature en production. Aussi chaque trimestre, nous organisons une réunion afin de faire le bilan sur le trimestre passé et de brainstormer sur les prochains tests à mettre en place.

Si vous devez décrire AB Tasty en 3 mots ?

Efficace, réactif et innovant !

Article

9min lecture

Call-to-action, comment donner envie de cliquer ?

Qu’est-ce qu’un call-to-action ?

On connaît « tous » le call-to-action ou bouton d’action. D’ailleurs si vous lisez cet article, c’est que vous avez dû vous-même cliquer sur des centaines, des milliers de call-to-action au cours de vos nombreuses journées passées sur Internet. Vos inscriptions sur LinkedIn, Facebook, WordPress, Dropbox ?

Probablement toutes le résultat d’un call-to-action efficace qui vous a fait cliquer, vous inscrire, lire, acheter : autant d’actions que l’on peut activer grâce à un CTA efficace.

Malgré cette familiarité avec le concept, peu d’entre nous comprennent en fait vraiment le fonctionnement et la psychologie derrière ce fameux CTA.

Qu’est-ce qui fait un bon call-to-action ? Pourquoi cliquons-nous ?  Pourquoi autant de différence entre deux mots ?

Nous ne comprenons pas pourquoi nous cliquons pour une raison simple :

Le call-to-action ne se résume pas à un bouton, une bannière ou une image. C’est l’ensemble de la psychologie et du storytelling qui l’accompagnent qui le rendent irrésistible.

Réfléchissons-y deux minutes : cliquez-vous souvent sur un « pop-up » d’une marque dont vous n’avez jamais entendu parler ? La réponse est non : vous cherchez à fermer cette fenêtre intempestive au plus vite.

Ce n’est pas la bonne combinaison de trois mots qui fait que vos visiteurs cliquent.

Vos visiteurs cliquent sur ce bouton en réponse à trois éléments qui se combinent :

  • Ce que vos visiteurs ont appris de vous (passé)
  • Ce que vos visiteurs ressentent en navigant (présent)
  • Ce que vos visiteurs attendent après leur clic (futur)

Call-to-action Dropbox

Ici sur le site de Dropbox :

  • Je sais que de nombreux collègues l’utilisent et j’ai vu leurs publicités à plusieurs reprises. (Passé)
  • J’apprécie le design épuré et la proposition de valeur : stocker mes données dans le cloud pour libérer mon temps, mon stockage et mon esprit. (Présent)
  • En cliquant, je m’aperçois que le compte « Basic » est gratuit : je m’inscris ! (Futur)

Si vous lisez toujours, vous vous demandez maintenant comment vous – qui ne dirigez pas Dropbox – pouvez bien rédiger et mettre en place des call-to-action qui convertissent.

Ça tombe bien, on en parle maintenant.

Comment créer un call-to-action efficace ?

Comme nous le disions, un call-to-action n’est pas un bouton isolé, amené sans introduction aux yeux de vos visiteurs. Un bon call-to-action doit être vu comme un aboutissement. Il doit être imaginé dans l’idée d’un « passage » à l’acte après une première introduction – voire une campagne complète.

Il peut s’agir de :

  • Demander l’e-mail après la lecture d’un article.
  • Proposer un audit à la suite d’une vidéo explicative.
  • Suggérer l’achat après la vue d’une page produit.
  • Offrir un essai gratuit après la visite d’une page.

En réalité, la qualité d’un call-to-action est intiment liée à la pertinence de votre tunnel d’achat : d’où viennent mes visiteurs ? Comment leur parler ? Par quelles étapes passent-ils avant l’action désirée ?

Et si à ce stade vous êtes totalement perdus, nous vous recommandons vivement notre Guide de Survie du Tunnel de Conversion.

Pour créer un CTA efficace, il existe cependant des bonnes pratiques et astuces qui augmenteront à coup sûr votre conversion.

  • Le visuel. Indispensable, le visuel doit être attractif. Il faut également éviter les images trop commerciales et privilégier des visuels plus personnels et originaux voire le format vidéo qui amène un CTR plus élevé.
  • Les mots. Restez bref. Un message aux alentours de 5 mots est idéal. Il faut que la proposition de valeur soit brève, concise et convaincante. Adaptez évidemment le message à ce que recherche votre audience.
  • L’action. Utiliser des verbes d’action et créer un sentiment d’urgence sont deux techniques répandues qui permettent d’augmenter la conversion. En soulignant le caractère temporaire ou exceptionnel d’une offre, vous augmentez la pression sur votre audience.
  • L’emplacement. L’emplacement de votre CTA doit être naturel. Il doit donc découler de façon intuitive du reste de la page et être amené de façon spontanée. Il faut donc éviter de placer votre CTA dans des endroits irrationnels qui ne seraient pas visibles.
  • Les couleurs. Pour générer un maximum d’impact, il est conseillé de créer un CTA de couleur différente du reste de la page. Cela étant dit, il faut également veiller à rester dans l’harmonie du thème de couleurs du site.
  • La taille. Il doit être assez visible pour ne pas passer inaperçu (n’aillez donc pas honte de l’afficher !) mais pas trop grand afin de ne pas distraire du contenu principal de la page : vos visiteurs sont également là pour se renseigner, il ne faut donc pas gêner la navigation et la lecture.
  • La compréhension. Votre proposition de valeur doit être claire et facile à comprendre. Explicitez exactement les bénéfices qu’obtiendront les visiteurs s’ils cliquent sur ce lien.

5 exemples de call-to-action efficaces

Parce qu’une image vaut bien quelques bons mots, nous vous suggérons de prêter attention à ces 5 exemples de ce nous estimons être de « bons call-to-action ».

Squarespace

Si Squarespace réussit bien quelque part sur sa Page d’Accueil, c’est bien à retranscrire l’idée de simplicité. Le design est soigné et la proposition de valeur est claire « Make your own website ».

La meilleure partie ? Le CTA en bouton noir : il résonne avec le thème et sort du lot : il capte notre attention en un instant. La touche magique : « No credit card required » qui accompagne le bouton : on sait en un instant que nous ne serons pas obligés de payer.

Call-to-action Squarespace

Adexpresso

Plusieurs choses frappent sur la page d’accueil d’AdExpresso. La proposition de valeur est limpide : « optimiser ses publicités Facebook aussi facilement que faire un café ».

Mieux, le thème couleurs du site reprend inconsciemment celui Facebook, qui se trouve être la plateforme pour laquelle ils apportent une expertise.

Enfin, le CTA en bouton vert détonne et attire l’attention immédiatement : il rassure également avec son « No Credit Card Required ! » intégré.

Call-to-action Adexpresso

Linkedin

Sur LinkedIn, la page d’accueil provoque directement l’apparition d’un formulaire dont le choix des mots est intéressant.

La première phrase « Distinguez-vous professionnellement » crée un sens de l’urgence : LinkedIn propose un service qui permet de me distinguer, je rate donc quelque chose si je ne m’y inscris pas.

La deuxième phrase « Lancez-vous, c’est gratuit » incite à l’action : c’est gratuit, qu’est-ce que je risque ? Le formulaire est volontairement court de façon à ne pas décourager.

Enfin, en bas se trouve la fonctionnalité « Trouver un collègue » : cela permet d’apporter une « preuve sociale » de la valeur ajoutée de LinkedIn, personnalisée selon la personne qui utilise la recherche.

Call-to-action Linkedin

Kickstarter

Pour le site de crowdfunding Kickstarter, les réseaux sociaux sont un canal d’acquisition primordial. Sur cette publicité Facebook, plusieurs éléments rendent le call-to-action puissant.

Premièrement, le choix des mots est en synergie avec la tag-line. « C’est le projet de montre le plus financé sur Kickstarter maintenant » résonne avec « Pas étonnant que tout le monde adore cette montre sur Kickstarter ! ».

Enfin, le visuel choisi est très attirant et l’ensemble crée un sentiment de forte curiosité : on a juste envie de cliquer.

Call-to-action Kickstarter

Udemy

Quand on découvre le site de Udemy, une tag-line interpelle directement notre attention : « Surpassez-vous ». La suite nous permet de découvrir rapidement la proposition de valeur « Obtenez des compétences en business, technologie… ».

Ce qui est intéressant dans ce cas, c’est que le call-to-action est proposé sous la forme d’une question : « Que souhaitez-vous apprendre ? ».

Cela permet d’obtenir un CTA débarrassé de l’approche commerciale traditionnelle type « Inscrivez-vous ». Enfin, on remarque deux choses intéressantes :

  1. L’offre à durée limitée en haut de la page qui crée un sentiment d’urgence.
  2. Des éléments réassurant en bas de la page qui terminent de nous convaincre qu’un coup d’œil vaut bien le coup.

Call-to-action Udemy

Optimiser ses call-to action grâce à l’A/B testing

Après ces quelques exemples de call-to-action plus que convaincants, gardez à l’esprit quelque chose : il n’existe pas de formule magique qui fonctionne pour tout le monde.

C’est vrai, ces entreprises ont trouvé de belles formules pour mettre en avant leur valeur ajoutée. Mais ces entreprises ont également construit des tunnels d’achat cohérents et une communauté sur laquelle s’appuyer.

Bon, on vous a menti. Il existe bien une formule magique pour faire convertir ses CTA.

Tester, tester et tester encore.

En réalité, derrière chaque campagne à succès, chaque call-to-action efficace, se cachent des dizaines voire des centaines d’essais. C’est ce que l’on appelle : l’A/B Testing.

Pour un guide complet de cette discipline : téléchargez notre livre blanc de l’A/B testing !

L’idée derrière le fait d’A/B tester ses CTA, c’est d’expérimenter chaque formule jusqu’à trouver la formule magique pour votre site internet ou votre produit.

Regardez plutôt les différences de conversion entre ces différents choix de mots :

Call to Action : Different Conversion Rates

L’idée avec l’A/B testing, c’est d’expérimenter des propositions de CTA différentes en jouant sur les différents leviers que vous avez à votre disposition :

  • Les couleurs.
  • Les mots.
  • L’emplacement.
  • Le format.
  • La taille.

Et vous, quels résultats obtenez-vous avec vos call-to-action ?

Article

11min lecture

Qu’est-ce qu’une Heatmap et comment s’en servir pour améliorer un site web ?

Savoir capturer l’attention de ses visiteurs est le nerf de la guerre de tous les sites Internet qui ont pour vocation de monétiser leur activité.

Et pourtant, légions sont les sites qui expérimentent « un peu au hasard » les changements qu’ils mettent en place. La page d’accueil a deux ans ? Quelques changements lancés au hasard après la lecture d’un article et nous sommes repartis pour deux années !

L’erreur est monumentale. En réalité, effectuer des changements au hasard est le meilleur moyen :

  • De faire baisser la conversion.
  • De perdre des ventes.
  • De faire fuir les visiteurs.

La vérité, c’est que chaque site est différent. Ce qui a fonctionné pour Pierre, Paul ou Jacques ne fonctionnera pas forcément sur votre site, et vice-versa.

Ce dont vous avez besoin, c’est que vos visiteurs vous disent ce qu’il faut changer. Pour cela, on utilise les heatmaps.

Qu’est-ce qu’une heatmap ?

Les heatmaps (Heat Maps), ou cartes de chaleur, sont des représentations visuelles de l’attention, de l’engagement et des interactions générées par vos visiteurs lorsqu’ils naviguent sur votre site.

Il s’agit d’une analyse que vous utilisez pour établir une « carte » de la concentration d’interaction ou d’attention sur votre page.

Mais regardez plutôt par ici :

Exemple Heatmap

Source : pixeller.co

En couleurs chaudes, on constate l’essentiel de l’attention tandis que les couleurs plus froides renvoient aux zones les plus ignorées de cette page d’accueil.

En analysant les interactions de vos visiteurs avec les pages de votre choix, vous pouvez effectuer les changements précis qui permettront d’augmenter la conversion.

À ce stade, c’est presque de la magie non ?

Laissez vos propres visiteurs vous dirent quelles sont les parties à changer pour augmenter vos ventes puis mettre en place les changements en mesurant leur efficacité, par exemple grâce à l’A/B testing.

Quand utiliser une Heatmap sur mon site web ?

Les heatmaps sont extrêmement utiles. Elles mesurent l’attention, l’engagement et même la répartition des clics sur votre site.

Pour vous permettre de mieux comprendre, voici quelques unes des raisons principales pour lesquelles les cartes de chaleur sont utilisées :

  • Mesurer l’engagement. Vous écrivez des articles et vous vous demandez jusqu’où lisent vos lecteurs ? L’utilisation d’une heatmap vous permet de visualiser le « scroll » des visiteurs et de comprendre où ils interagissent. Si vous constatez qu’une infime partie seulement atteint votre call-to-action, il est peut-être temps de changer quelques éléments.
  • Mesurer les actions. Où cliquent mes visiteurs ? Cliquent-ils sur le bon bouton ? Votre carte de chaleur vous permet de voir si vos visiteurs agissent de la façon attendue et de découvrir les obstacles qui les en empêchent.
  • Mesurer l’attention. Quels sont les titres qui attirent l’attention ? Quelles images attirent l’attention ? Quels éléments détournent l’attention du contenu principal ? Mes visiteurs voient-ils mon formulaire ? En comprenant ces problématiques, vous pouvez mettre en place les changements qui augmenteront votre conversion.

Source : unbounce.com

Grâce à ces réponses, vous pouvez répondre vous-même aux questions qui vous entêtent :

  • Où placer le contenu le plus important ?
  • Comment bien utiliser mes images, mes vidéos ?
  • Où part l’attention de mes visiteurs ?
  • Où proposer mon produit, mon service ?

Maintenant que vous êtes plus familiers avec le concept de « heat map », vous vous demandez peut-être s’il existe plusieurs types de cartes de chaleur à analyser. Et vous avez raison.

Quelle(s) Heatmap(s) dois-je utiliser ?

La plupart des solutions de heatmap donnent la possibilité de générer des cartographies de votre site sous plusieurs angles.

L’idée est de jongler entre ces différentes cartes pour révéler les comportements de vos visiteurs.

La Heatmap ou Click Heat Map

Elle permet de quantifier l’action. C’est une représentation visuelle de tous les clics de vos visiteurs sur votre page. Cette « map » génère des données précieuses puisqu’elle vous permet de comprendre exactement où interagissent vos visiteurs.

Dès qu’une personne clique à un endroit précis sur votre site, la heatmap marque cet emplacement d’un point lumineux. Si vous constatez des zones lumineuses, c’est ici que l’essentiel des clics se produit.

Exemple Heatmap

Source : sumo.com

En identifiant rapidement les « points d’action » de votre site, vous constatez immédiatement si vos visiteurs cliquent aux endroits voulus. Sur cette capture de Sumo, on voit que les outils « SHARE » et « IMAGE SHARER » sont les moins populaires.

La Scroll-Map ou « Analyse du contenu »

La scrollmap vous permet de comprendre à quelle profondeur descendent vos visiteurs lorsqu’ils « scrollent » une page et surtout : quels éléments attirent l’attention de vos visiteurs et sur quoi s’attardent-ils ?

En utilisant la scrollmap, vous identifiez si vos visiteurs « voient » les bons éléments de votre site ou si au contraire, ils s’attardent sur des éléments peu importants.

L’objectif : identifier les points forts du site et restructurer votre navigation jusqu’à ce que vos visiteurs passent le plus de temps possible sur les éléments qui comptent.

Example of Scroll Heatmap

source : nguyenvincent.com

Sur cet article qui traite de référencement naturel, on s’aperçoit que l’image et les deux lignes qui lui succèdent sont les plus populaires : environ 85% des visiteurs ont vus ces éléments.

La Heatmap « Pourcentage de clics »

La carte pourcentage de clics arrive en renfort de la heat map classique. Elle permet de voir, élément par élément, combien de clics ont été générés par telle image ou tel call-to-action. Le pouvoir de quantifier les clics élément par élément est extrêmement important.

Cela permet de :

  • Comprendre l’importance qu’accorde le visiteur à chaque élément
  • Éviter que les visiteurs ne cliquent sur des images sans lien

Heatmap with percentage of clicks

Source : nguyenvincent.com

Sur cette carte du pourcentage de clics, on voit que la section « me contacter » reçoit plus de clics que la page « présentation », ce qui indique que les utilisateurs s’orientent vers ce qu’attend le propriétaire du site : une prise de contact.

La Heatmap « Confetti »

Bien que similaire à la heatmap classique, l’approche « confetti » vous permet de voir tous les clics effectués sur votre page contrairement à un aperçu de la « densité ». Cela vous permet de voir si des zones non-cliquables sont cliquées par des utilisateurs : vous auriez alors tout intérêt à rendre ces zones cliquables.

Exemple Heatmap "confetti"

Source : crazyegg.com

À ce stade, vous en savez déjà plus sur les différences façons d’utiliser les heatmaps.

Il existe cependant une autre façon d’analyser le comportement de vos utilisateurs sur votre site : le eye-tracking.

Différence entre Heat map et Eye-tracking

Si les heat maps se concentrent principalement sur l’analyse du parcours de la souris et des clics, l’eye-tracking analyse le parcours du regard des utilisateurs.

L’intérêt de l’eye-tracking est de comprendre le chemin parcouru par le regard de l’utilisateur afin d’analyser les zones d’intérêt et d’attention sur lesquelles s’attardent vos utilisateurs.

Exemple Eye-Tracking

Source : nngroup.com

Sur le même principe que la heatmap, les zones de chaleur représentent les endroits où l’attention des lecteurs s’est le plus portée.

Bien que très utile, l’eye-tracking est un dispositif plus difficile à mettre en place que les heatmaps. Il demande de l’équipement spécifique dont peu d’agences disposent.

Si l’eye-tracking vous intéresse, il existe des solutions basées sur l’IA telles que Feng-Gui ou EyeQuant qui vous permettront de simuler un eye-tracking à l’aide d’algorithmes.

Fonctionnalités clés d’une solution de Heatmap

Quand vous cherchez un outil de carte de chaleur, faites attentions aux éléments suivants :

  • Segmentation comportementale : l’outil de heatmap doit permettre d’afficher les cartes de chaleur propres à un type d’internautes que vous définissez à l’aide de critères de ciblage et de segmentation (ex: nouveaux visiteurs, visiteurs ayant converti, visiteurs venant de vos campagnes de liens sponsorisés…).
  • Comparaison de cartes : vous devez pouvoir comparer facilement et visuellement les cartes correspondantes à différents segments d’utilisateurs.
  • Regroupement par template de pages : avoir une carte de chaleur pour une page spécifique peut rendre l’analyse compliquée si votre page est une fiche produit et que vous en avez des centaines, voire des milliers. Il faut pouvoir agréger les résultats pour toutes les pages d’un même type.
  • Heatmap responsive : l’outil de carte de chaleur doit fonctionner pour les pages consultées depuis un mobile ou une tablette. Les actions spécifiques à ces terminaux mobiles doivent être enregistrées, comme les touch, scroll et swipe. Lors de l’analyse vous devez pouvoir dissocier les comportements et sessions de navigation faites depuis un mobile ou un ordinateur pour analyser correctement une carte de chaleur.
  • Cartes exportables. Cette fonctionnalité importante vous aide à communiquer facilement les résultats à vos collaborateurs.
  • Cartes de chaleur dynamiques : vous devez pouvoir visualiser les clics sur les élements dynamiques : menu déroulant, slider, carrousel, éléments chargés en AJAX ou via un framework Javascript comme React.js ou Angular.js.
  • Heatmap rétroactive : le design de votre site a changé depuis la capture de la carte de chaleur ? La solution de heat map doit pouvoir conserver les résultats précédents sur l’affichage de l’époque et ne pas simplement superposer les résultats sur votre nouveau design, sinon les résultats sont incohérents.

Obtenir plus de conversions : combinez Heatmap et A/B Testing

Admettons : vous utilisez une heatmap pour comprendre comment vos utilisateurs interagissent avec votre marque. Vous remarquez des zones faibles et des zones fortes pour lesquelles vous voulez mettre en place des modifications.

Question : comment mesurer l’efficacité des modifications que j’effectue ? Une seule solution : A/B testez vos modifications.

Le principe : créer des versions différentes d’une page, publicité ou landing page afin de comparer les différences de performance.

En combinant Heat Map + A/B Testing, vous obtenez une méthode en 3 étapes :

  • J’identifie les problèmes grâce aux heatmaps.
  • Je teste mes solutions grâce à l’A/B Testing.
  • J’applique les solutions les plus performantes.

Télécharger notre guide pour tout savoir de l’A/B testing !

Sur ce site de réparation, une première heatmap montre que l’engagement et l’attention des visiteurs sont divisés sur de trop nombreux éléments de la page.

Constat : l’attention est dispersée et la conversion est faible.

Exemple Heatmap

Source : kissmetrics.io

À l’aide de l’A/B Testing, la société procède à plusieurs changements sur la Page d’Accueil afin de recentrer l’attention des visiteurs sur un Call-to-Action.

Une deuxième heatmap est générée après les modifications.

Constat : l’attention est recentrée sur le numéro de téléphone qui sert de Call-to-Action. La conversion augmente.

Exemple Heatmap

Source : kissmetrics.io

A retenir !

Utilisez les Heatmaps et l’A/B Testing pour :

  • Analyser le comportement et l’engagement de vos visiteurs.
  • Déceler les zones faibles et fortes des pages de votre choix.
  • Trouver les mesures à mettre en place pour augmenter la conversion.
  • Tester vos solutions jusqu’à parvenir à augmenter votre conversion.