Contexte
Vous recevez un Brief vous demandant de tester une nouvelle version de la bannière « Promotions été 2020″ déployée dans le slider en Home Page.
Pré-requis
- Mise en ligne des différentes versions des bannières à tester
- La campagne « Promotions été 2020 » doit durer suffisamment longtemps pour vous permettre d’obtenir des résultats significatifs (à minima : une semaine)
- S'assurer que les ventes des produits concernés par la campagne « Promotions été 2020 » remontent bien dans l'outil d'A/B Testing.
A avoir en tête…
- Le slider de la HP est un composant dans lequel les bannières « tournent » beaucoup. Le contenu du slider peut être modifié plusieurs fois par jours au gré des promotions et autres opérations de dernière minute.
- Le slider est l’un des éléments visuels le plus visible d’un site. En réalisant un AB Test sur ce composant vous allez donc toucher une audience importante. Vous devez aussi avoir en tête que cet AB Test sera très « visible » en interne : vous allez devoir plus que jamais soigner votre recette. Un succès sur un AB Test de ce type sera souvent un sponsor intéressant pour la suite…
Best Practices
Si la bannière à remplacer se situe à la première position du slider, celle-ci va se charger, être visible à l’utilisateur pendant quelques instants puis être remplacée par la variation. Ce type du rendu visuel dégrade fortement l’expérience utilisateur dans la mesure où le slider de la home page est souvent un composant graphique de grande taille ; et le remplacement en cours de navigation d’un tel composant aura un impact d’autant plus important sur la qualité de la navigation.
La bannière remplacée ne doit jamais être située en première position du slider
Ciblage
On l’a vu, le slider est un composant où les bannières sont amenés à être régulièrement modifiées. Vous ne devez donc déclencher votre AB Test que lorsque la bannière à modifier est présente. De cette façon, vos statistiques d’audience seront fidèles à la réalité : un visiteur ne sera comptabilisé dans l’AB Test que lorsque la bannière à remplacer est présente dans le slider.
Pour que l’AB test se déclenche, il faut donc que l’ensemble des conditions suivantes soient réunies :
- La bannière « Promotions été 2020 » est présente dans le slider et n’est pas en première position
- Le visiteur navigue en Home Page
Tracking
Souvent les bannières présentes dans le slider en Home Page disposent d’un tracking spécique dans l’outil d’analyse (Google Analytics, AT Internet, Eulerian).
Les équipes merchandising peuvent ainsi suivre pour chaque bannière le volume d’impressions et de clics générés.
Vous devez leur permettre de distinguer pour la campagne « Promotion été 2020 » le cas où c’est la bannière version A qui s’est affiché et le cas où c’est la version B. Pour cela, vous allez devoir ajouter 2 dimensions supplémentaires dans les rapports de vous outils webanalytics : la dimension versionABTest et la dimension variationABTest . Ces dimensions devront préalablement avoir été ajoutées dans le tag de votre outil de suivi analytics
Autre bonne pratique : dans le script de votre test, intégrez un hit de conversion "impressionBannièreHP" qui sera envoyé une fois que la bannière de la Home Page aura été remplacée. De cette manière, vous pourrez connaitre le volume réel d'impressions de la bannière que vous tester. Prenons le cas d'un visiteur qui arrive sur en Home Page, et qui par conséquent entre dans le segment de ciblage de votre A/B Test. Si ce visiteur quitte la page quelques instants après et que le script de votre test n'a pas pu s'exécuter entièrement le hit "impressionBanniereHP" ne sera donc pas déclenché. Pour calculer le taux d'impression de votre A/B Test, vous devez effectuer le ratio entre le nombre de clics sur la bannière que vous remplacé et le nombre d'impressions !
Par ailleurs, vous devez surveiller le taux de visibilité de votre bannière, obtenu en divisant le nombre de visites avec impressions sur le nombre de visites exposées à l'A/B Test. Si le taux de visibilité est inférieur à 90% cela signifie que votre test rencontre peut-être un problème, ou que le temps de chargement de la page est trop élevé...
Variation
Comme toujours souvent l’éditeur WYSIWYG de votre solution d’AB Testing ne pourra rien pour vous. Voici l’ensemble des étapes à réaliser en Javascript :
- Sélectionner la bannière que vous souhaitez remplacer. Cette bannière doit avoir un attribut qui lui est propre (par exemple : un id ou une class « name »).
- Remplacer la source de l’image de cette bannière
Best practice : votre code doit toujours fonctionner dans le cas où le slider de la Home Page venait à être déplacé, comme par exemple s’il passe en 2ème position car la 1ère est désormais allouée à une lame promouvant les gestes barrières contre le coronavirus.