Quelques boutons de formulaire – Tests A/B

Voici quelques boutons de validation et d’annulation de formulaire faits pour des tests A/B. Vous pouvez les télécharger, utiliser et distribuer librement pour tout type d’utilisation (perso et pro).

Téléchargement des boutons pour les tests A/B

Cliquez sur les liens ci-dessous pour télécharger la plaquette de boutons: format png ou format jpg

Pour les hover, vous pouvez par exemple mettre un simple voile noir d’opacité 0.15.

N’hésitez pas à demander d’autres combinaisons si vous le souhaitez, pour tester d’autres formulations par exemple.

Passer aux tests A/B – Fonction PHP

Voici un exemple de code pour réaliser vos propres tests A/B sur votre site en utilisant les événements de Google Analytics.

<?php
// Choix aléatoire d'un des boutons parmi 40 possibles
$random=rand(1,40);/* Retourne un integer [1;40] */

//Définition du style
echo '
<style>
input[type="submit"].testab_bouton_valider {
background: url(/images/boutons/valider-'.$random.'.png) no-repeat;
height: 57px;
width: 150px;
}
input[type="submit"]:hover.testab_bouton_valider {
background: url(/images/boutons/valider-'.$random.'-hover.png) no-repeat;
}
</style>
';
/* ici toutes images ont été ajoutées dans le sous dossier "boutons"
du dossier "images" situé a la racine.
Toutes les images sont à nommer "valider-1.png", "valider-2.png",
"valider-3.png", etc. et leur hover "valider-1-hover.png",
"valider-2-hover.png", etc.*/

/* Mettez ici votre formulaire
echo '
<form method="post">
<input type="text" name="input1">
...
<input type="text" name="dernier_champ">
';
FIN des champs ici*/

echo '
<input type="submit" class="testab_bouton_valider" onClick="_gaq.push([\'_trackEvent\', \'Tests AB\', \'Formulaires\',
\'Clic bouton '.$random.'\']);" value=" ">
';

/* NB: On appelle ici un  événement de Google Analytics
l'appel du code de tracking doit donc être fait en début de page */

?>

Voilà, ce code vous permettra normalement de réaliser quelques tests A/B sur vos formulaires pour booster vos conversions.

Google Analytics devrait vous donner les informations sur le bouton ayant reçu le plus de clics, il ne vous restera donc plus qu’à définir ce bouton pour l’ensemble de vos formulaires. (Attention, attendre que le nombre de clics total soit significatif: plus vous testerez de combinaisons plus ce nombre devra être grand (pour diminuer les risques))

 

3 Commentaires

  1. Social à Répondre

    Merci.

    J’avais préféré mettre une version très large de l’image pour que l’on puisse la modifier sans craindre pour la perte de pixels mais effectivement le faire avec des sprites est une très bonne idée !

    Dès que j’ai le temps, je mettrais donc deux nouvelles plaquettes (sprites bouton et hover) ainsi que le code pour tester directement les différents boutons 🙂

    Merci pour le commentaire

  2. Rémi à Répondre

    J’ajoute un conseil partisan concernant l’AB Testing. Je conseille d’utiliser AB Tasty qui est le 1er outil de testing français. Disons que pour les personnes qui ne sont pas techniques c’est plus simple 🙂

    COMMENTAIRE MODERE: tapez "Je conseille d’utiliser AB Tasty qui est le 1er outil de testing français" ou "J’ajoute un conseil partisan concernant" sur Google pour en connaître la raison.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *