web-dev-qa-db-fra.com

a / b testant des centaines de pages à la fois, avec une mise en page différente

Je veux essayer une nouvelle mise en page pour ma page de produits. Cela impliquerait une nouvelle mise en page et un nouveau schéma de couleurs sur chaque page de produits. Il existe des centaines de pages produits. Ma question est, comment faites-vous un test/b lorsque le changement concerne plusieurs pages?

J'appelle une classe products.php, et j'ai créé un nouveau design à products1.php. Je ne sais pas comment envoyer la moitié de mon trafic à chaque classe et une piste/b. Comment y parvient-on? Le même problème se poserait si je voulais tester un en-tête différent sur tout le site.

1
Source

Cela dépend de la façon dont votre variante "b" est implémentée. Les pages séparées sont difficiles à tester, tandis que les transformations javascript sont beaucoup plus faciles.

Voici quelques conseils généraux, j'espère que cela vous aidera:

méthode Javascript:

Toutes vos pages de produits doivent partager des sélecteurs CSS similaires.

Par exemple, si vous modifiez tous les boutons sur toutes les pages de produits, vous pouvez utiliser le code générique $('.add-to-cart').css({ background: 'green'}) qui changera tous les boutons en vert au lieu de vous soucier de chaque page de produit individuellement.

Méthode des pages séparées:

C'est plus compliqué. Il y a deux façons de faire ça.

1) Vous pouvez fractionner le trafic côté serveur, mais vous devrez tout coder manuellement et ne pourrez pas utiliser un logiciel de test a/b facile pour cela.

if (has cookie) { make sure they see the same thing as last time}
else { generate a or b randomly, if b, then redirect to b page. set cookie}

2) Utilisez Javascript pour rediriger 50% du trafic de A vers B:

<!-- first hide your default page so the visitor doesn't see both versions -->
<style id='some-id'>html,body {visibility:hidden}</style>
<script>
if (visitor is in version B) {
   // redirect if needed
   location.replace(http://site.com/new-page.php);
} else {
   // un-hide if they should not be redirected
   $('#some-id').remove();
}
</script>
2
d-_-b

Votre question sera fermée car elle concerne l'implémentation plutôt que l'UX mais je me sens généreux

Vous devriez (si vous utilisez les meilleures pratiques de développement Web modernes) utiliser une feuille de style distincte pour vos mises en page, polices, couleurs, etc. Si vous êtes vraiment intelligent, vous devriez utiliser sass pour compiler vos feuilles de style en fichiers uniques.

À l'aide de cookies et de javascript, vous devriez ensuite pouvoir tester dans quel groupe de test chaque utilisateur se trouve et leur servir les feuilles de style alternatives en fonction du résultat.

Vous pouvez en savoir plus sur une carte javascript ou cookies.

1
Andrew Martin