Voor het uitvoeren van A/B tests zijn verschillende tools op de markt. Bekende tools zijn bijvoorbeeld VWO, Optimizely en sinds 2017 Google Optimize. In dit blog gaan we verder in op het gebruik van Google Optimize.
Het is je wellicht opgevallen dat websites zoals Booking.com of Coolblue continu in ontwikkeling zijn. Soms veranderen er kleine dingen, zoals een knopkleur, en soms grotere dingen zoals de aanduiding van een menuknop. Wanneer je op een van deze sites aan het browsen bent is de kans groot dat je in een zogenaamde A/B test terechtgekomen bent. Bij een A/B test worden twee of meer varianten van een pagina naast elkaar getest op een vooraf bepaalde hypothese. Door op basis van je resultaten steeds verder door te testen kan je ervoor zorgen dat je website zijn doel, zoals productverkopen of genereren van leads, steeds beter dient.
Na de vorige paragraaf zal je je allicht afvragen waarom wij in dit geval verder ingaan op Google Optimize, terwijl er ook alternatieven zijn. Een van de grote voordelen van Optimize is de eenvoudige instap, er is geen verregaande codeerkennis nodig om een eenvoudige test op te zetten. Dit maakt dat je eenvoudig zelf kunt starten met testen, zonder een relatief dure programmeur in te hoeven schakelen. Daarnaast is de integratie met Google Analytics en AdWords voor ons als online marketeers een grote plus.
Pluspunten Google Optimize
Gratis te gebruiken.
Goede integratie met andere Google producten.
Relatief eenvoudige integratie op de website.
Eenvoudig te gebruiken visuele editor, maar ook de optie om code aan te passen.
Nadelen Google Optimize
Maximaal vijf verschillende experimenten kunnen tegelijk uitgevoerd worden.
Rapportage beperkt zich tot GA data, daar waar VWO bijvoorbeeld heatmaps en replays biedt.
Alternatieven
VWO is inmiddels al een keer genoemd, maar er zijn meer tools die gebruikt kunnen worden voor het uitvoeren van A/B tests. Een ander bekend alternatief is Optimizely. Bij Datarunsdeep uit Australië hebben ze een mooie vergelijking gemaakt tussen Optimize, VWO en Optimizely. Zij concluderen dat het ideale pakket verschilt per doelgroep, maar dat uiteindelijk bij ieder pakket de gebruiker de grote winnaar is. Aangezien alle drie de programma’s voldoende mogelijkheden bieden tot het opzetten van een goede AB test.
2. Installatie van Google Optimize
Wanneer je een account aanmaakt in Google Optimize zal je door verschillende stappen geleidt worden. Deze stappen bestaan uit het akkoord gaan met de voorwaarden en het kiezen van een containernaam. Wanneer je vervolgens binnen de interface terechtkomt zal je zien dat rechts weergegeven staat welke stappen je nog moet doorlopen. Hoewel de stappen genummerd zijn, is de volgorde van deze stappen niet bindend. Je kan ervoor kiezen om gelijk aan de slag te gaan met het opzetten van je eerste experiment, maar je kan ook eerst alle koppelingen voltooien. In dit geval kiezen we voor de tweede optie.
Linken aan Google Analytics
Het linken van het Optimize en het Analytics account is een vrij eenvoudige stap. Vereiste is wel dat het Google account waarmee je ingelogd bent toegang heeft tot de Analytics property. Als je de juiste property gevonden hebt kan je aangeven met welke weergaven je de koppeling wilt maken.
Bonustip: Maak gebruik van een gefilterde weergave in Analytics waarin je je eigen IP-adres uitsluit. Op die manier voorkom je dat je de data vertroebeld als je zelf je site bezoekt.
Plaatsen Optimize code
Na het linken van de accounts krijg je de optie om Optimize te implementeren. De implementatie van Optimize kan op verschillende manieren. Zo kan Optimize eenvoudig geïnstalleerd worden door een enkele regel code toe te voegen aan de Google Analytics code, maar ook met behulp van de Google Tagmanager. De voorkeur gaat uit naar directe plaatsing in de broncode van de website. Deze methode zorgt namelijk voor de snelste laadtijd. Twijfel je welke methode voor jouw site het meest geschikt is? Dan kan deze gids van Google uitkomst bieden. In alle gevallen geldt dat de container waarin Optimize geplaatst wordt op de juiste plek in de broncode moet staan. Staat de GA code bijvoorbeeld onderaan de broncode in plaats van direct na de <head> tag, dan zal Optimize niet optimaal functioneren.
Google Optimize installeren met het Analytics script versie 2
De Google Optimize code om in combinatie met Google Analytics te plaatsen heeft een update gehad waardoor dit nog eenvoudiger wordt. Waar eerder zoals onderstaand beschreven een regel aan de GA code toegevoegd moest worden, kan deze nu losstaand geplaatst worden. Dat maakt het vooral makkelijker als Google Analytics via een kant-en-klaar oplossing ingeladen wordt.
Deze nieuwe code wordt geïnstalleerd door onderstaande regel bovenaan de <head> sectie van de website te plaatsen.
Google Optimize installeren met het Analytics script
Hoewel de nieuwe methode eenvoudiger is, werkt ook deze installatiemethode nog. Als je gebruikmaakt van de analytics.js variant van GA dan kan je Optimize toevoegen met behulp van onderstaande regel:
ga(‘require’, ‘GTM-XXXXXXX’);
De XXXXXXX worden uiteraard vervangen door de container ID van jouw Optimize account. Als je deze regel aan je GA code toegevoegd hebt komt de basiscode er als volgt uit te zien:
Wanneer je Optimize toch via de Tagmanager wil installeren is het van belang dat ook je Analytics code via de Tagmanager geladen wordt. Er is een voorgeprogrammeerde tag beschikbaar die je kan gebruiken. Aandachtspunten bij de installatie zijn dat je dezelfde GA code gebruikt in beide tags en dat je met behulp van sequencingMet sequencing bepaal je de volgorde waarin de verschillende tags in de Tagmanager geladen worden. ervoor zorgt dat de Optimize tag voor je Analytics tag geladen wordt.
Een uitgebreide handleiding is te vinden op de Google Support site.
In sommige gevallen, bijvoorbeeld doordat de Tagmanager niet op de juiste plaats in de code staat, wordt Optimize niet goed ingeladen. Wat je in dat geval nog als alternatief kan proberen is de code als aangepaste html plaatsen in plaats van via de voorgeprogrammeerde tag. Plaats dan de code zoals hierboven bij Via Analytics script genoemd is in deze aangepaste html. Zorg ervoor dat je de regel ga(‘send’, ‘pageview’); weglaat, anders worden je pageviews namelijk dubbel geteld. En gebruik ook in dit geval sequencing om de tag voor de Analytics tag te laden.
Page-hiding snippet
Voor het uitvoeren van een test legt Optimize een layer over de standaard pagina heen. Doordat de layer geladen wordt na de basispagina kan de originele pagina een fractie van een seconde zichtbaar zijn voordat de testversie geladen wordt. Om dit flikker-effect te voorkomen kan je gebruikmaken van de page-hiding snippet. Deze snippet zorgt ervoor dat in de tijd voordat de testversie is geladen een wit scherm getoond wordt. De implementatie handleiding van dit script is hier te vinden. Aandachtspunt van dit script is de standaardtijd die ingesteld is voor de weergave van het witte scherm. Wanneer Optimize niet goed geladen wordt zal dit script ervoor zorgen dat elke pagina eerst vier seconden wit is voordat deze weergegeven wordt.
Testen of Optimize werkt
Wanneer je bezig gaat met het maken van een experiment krijg je de mogelijkheid om de Optimize-installatie te verifiëren.
Controleer naast het automatische verificatieproces ook handmatig nog even of experimenten werken. Dit kan door na het aanmaken van een experiment de pagina is verschillende browsers te laden (incognito modus kan hierbij helpen).
Als Optimize correct geïnstalleerd is kan je verdergaan met het opzetten van je experiment!
Werkt Optimize nog niet goed? Een veelvoorkomende oorzaak is een verkeerde plaatsing van de containercode. Controleer of je container (Tagmanager of Analytics) op je juiste plaats in de broncode staat.
3. Opzetten van je eerste experiment
Met de installatie achter de rug kan je nu beginnen met het opzetten van een experiment. Bij het maken van een experiment wordt je gevraagd om een naam, een editorpagina en welk type experiment je uit wilt voeren. Het is goed om te weten dat de editorpagina weliswaar de pagina is waarop je je aanpassingen uitvoert, maar dat je experiment niet enkel tot deze pagina beperkt hoeft te blijven. Hoe je een experiment over meerdere pagina’s uitvoert gaan we later op in.
Type experimenten
Je krijgt de keuze uit drie verschillende type experimenten, te weten de A/B test, Multivariatietest en de omleidingstest. Voor de volgende stappen houden we de A/B test aan.
A/B test
Dit is de meest bekende test welke we ook in dit artikel al een aantal keren genoemd hebben. Met behulp van de editor kan je verschillende varianten maken van een pagina en deze tegen elkaar testen.
Multivariatietest
Met behulp van de multivariatietest kan je verschillende onderdelen van je pagina tegelijk testen. Voorbeeld je wilt zowel een knopkleur als de knoptekst testen. Door gebruik te maken van dit type test maakt Optimize automatisch meerdere testvarianten aan:
Aangepaste tekst (originele knopkleur, aangepaste tekst)
Beide aangepast (aangepaste knopkleur, aangepaste tekst)
In het bovenstaande voorbeeld wordt uitgegaan van slechts twee kleuren en twee teksten, maar bij meer kleuren, teksten of elementen kan deze testmethode je een hoop werk uit handen nemen.
Omleidingstest
Bij deze variant zorg je ervoor dat je los van Google Optimize twee pagina’s aanmaakt op je website. Optimize zal bezoekers van je website vervolgens verdelen over de twee verschillende pagina’s.
Experiment dashboard
Als je de keuze voor een experiment hebt gemaakt kom je in het experiment dashboard terecht. Binnen het Details scherm waarop je binnenkomt kan je het experiment opzetten. Je vindt hier de optie om experimentdoelen in te stellen, een beschrijving & hypothese te noteren, de targetting van je experiment te configureren en het aanmaken van varianten.
Doelen
Er worden verschillende doelen aangeboden die je kan gebruiken om je testresultaten te beoordelen. Standaard zijn in elk geval de transacties, bounces, paginaweergaven en sessieduur beschikbaar. Daarnaast kan je gebruik maken van de in Analytics ingestelde doelen. Een erg prettige optie die later aan Google Optimize toegevoegd is zijn de aangepaste doelen, dit was bij de introductie van het pakket nog niet beschikbaar. Met de aangepaste doelen kan je op basis van gebeurtenissen of paginaweergaven nieuwe doelen configureren zonder dat je je Analytics data vervuilt. Dit is bijvoorbeeld handig als je een doel wilt meten zonder directe waarde, bijvoorbeeld of gebruikgemaakt wordt van een menuknop. Met de gratis variant van Google Optimize kunnen experiment op maximaal drie doelen beoordeeld worden binnen de interface.
Tip: In Google Analytics is onder Gedrag ook het kopje Experimenten te vinden. Hieronder kan je experimenten ook op sitegebruik en je Analytics-doelset beoordelen.
Met behulp van de beschrijving en hypothese kan je in 5.000 woorden beschrijven wat je aan het testen bent en wat je van het experiment verwacht. Door dit veld duidelijk in te vullen maak je het voor jezelf en anderen makkelijker de resultaten van het experiment te beoordelen.
Targeting
Onder het kopje targeting kan je bepalen wie je experiment te zien krijgt en hoe bezoekers over je experiment varianten verdeeld worden. Onderstaand is een voorbeeld te zien van een experiment met naast het origineel twee varianten van een pagina. Dit experiment is gericht op bezoekers vanaf een mobiel apparaat, waarbij deze bezoekers evenredig verdeeld worden over de pagina varianten.
Naast het type device zijn er nog tal van mogelijkheden om het experiment te targeten. Een voorbeeld daarvan, welke erg interessant is voor ons als online marketeers, is de AdWords optie. Hiermee kan je specifieke landingspagina’s testen bij verschillende campagnes, advertentiegroepen of zoekwoorden.
Varianten
Wanneer de doelen en hypotheses bepaald zijn kan je aan de slag met het aanmaken van de verschillende paginavarianten. Als je een variant gemaakt hebt verschijnt deze in het overzicht met de gegeven naam, het percentage van de doelgroep dat naar de variant gestuurd wordt, een knop naar de preview op verschillende weergaven, het aantal wijzigingen en de variant opties zoals het aanpassen van de naam of het verwijderen van de variant. Om naar de editor te gaan selecteer je het aantal wijzigingen.
De editor is een WYSIWYG, oftewel een What You See Is What You Get, editor. Als je bijvoorbeeld een tekstblok selecteert dan kan je met de toolbox rechtsonder het formaat van de tekst, het lettertype, de omvang van het tekstblok etc. aanpassen. Daarnaast kan je natuurlijk ook de tekst in het blok aanpassen.
Standaard staat de weergave op de desktop variant, maar als je je experiment wilt richten op mobiele bezoekers dan is dit natuurlijk niet ideaal. Door midden bovenin te klikken op standaard kan je de weergave veranderen naar verschillende andere apparaten.
Met je doelen, targeting en varianten gereed kan je het experiment vanuit het experiment dashboard starten!
4. Testresultaten beoordelen
Met je experiment aan de gang zullen (langzaam aan) de resultaatrapporten gevuld worden. Als het experiment een positief resultaat geeft voor een van de varianten zal je een melding zoals onderstaande krijgen waarbij in plaats van de beëindigingsdatum zal staan dat het experiment beëindigd kan worden.
In het geval van onderstaande experiment was het primaire doel het bouncepercentage, deze lag bij variant één significant lager dan bij het origineel en variant twee. In het overzicht kan je zien wat de verwachte verandering in het primaire doel is bij implementatie van deze variant. Daarnaast wordt de procentuele kans dat een variant de beste is weergegeven. Bij een waarde boven de 95% is het dermate waarschijnlijk dat de resultaten representatief zijn dat er van significantie gesproken wordt. De resultaten worden bepaald op basis van Bayesiaanse statistiek.
Op basis van de waarnemingen worden volgens de regels van Bayes een verbeterde schatting van de kansverdeling gemaakt. De zogeheten a-posteriori-verdeling.
Een uitgebreide uitleg over Bayesiaanse statistieken kan je vinden bij analyticsvidhya.
Als je naar beneden scrolt krijg je eerst de verbetering per variant te zien op de verschillende experimentdoelen. Door nog iets verder door te scrollen kom je bij de uitgebreide analyse per
doel. Hier krijg je nogmaals dezelfde resultaten te zien als bovenaan de pagina, maar dit keer kan je het ook afzetten tegen de andere varianten. Zo kan je in onderstaande resultaten ook de verdeling in bouncepercentage zien (middelste 95%, middelste 50% en mediaan).
Als je alle doelen goed ingesteld hebt is het beoordelen van je testresultaten zeer eenvoudig doordat Google Optimize alle statistieken voor je doorberekent.
5. Waar begin je met testen?
Nu je de instrumenten klaar hebt staan om een test uit te voeren is het tijd voor de volgende stap. Je kan nu bepalen wat je wil gaan testen. Hoewel we het aan het begin hadden over de knopkleuren die door partijen zoals Booking getest worden, is dit voor kleinere partijen waarschijnlijk niet de juiste plek om te starten.
Waar begin je dan wel? Mooie uitgangspunten voor experimenten is feedback van bezoekers, dit kan zowel vanuit werkelijke contacten zijn als vanuit de data die je terugziet in je Analytics pakket. Zijn er bijvoorbeeld pagina’s met hoge uitstappercentages? Of hoor je van klanten dat ze moeite hadden met de navigatie? Dan zijn dat mooie punten om mee te beginnen. Daarnaast kan je je ook baseren op bijvoorbeeld expertblogs, zo wordt er veel gesproken over het hamburgermenu op mobiel. Aangezien de ideale situatie verschilt per doelgroep en website kan het interessant zijn dit soort experimenten te repliceren voor je eigen situatie.
6. Conclusie
Wil je starten met het optimaliseren van je website? Dan is Google Optimize een erg mooi pakket om mee te beginnen. Als je de bovenstaande stappen doorlopen hebt ben je in staat tot het opzetten van eenvoudige experimenten. Ben je ook bekend met html, css en javascript? Dan kan je met Optimize nog een stuk verder gaan dan eenvoudige experimenten. Al met al heb je hiermee een krachtige tool in handen om je website naar een hoger niveau te tillen.
Vond je dit interessant?
Schrijf je in voor onze nieuwsflits en ontvang maandelijks een update met onze laatste blogs en updates!
