A/B-testing is one of the most powerful tools for optimizing your website. It does not have to be expensive. And keeping away from implementation times and the involvement of IT is of course an advantage, right? With Google Tag Manager you can do just that.
A/B testing via Google Tag Manager (GTM) (or via Google Content Experiments for that matter) is free and simple, the method is a good option or a complement to the big test tools. There are of course pros and cons of A/B-testing through GTM, but first let us show you how to do it.
Why not Google Content Experiments? Today it is not possible to use Google Content Experiments together with GTM. And you are limited to just performing split URL test in GCE.
With a few lines of JavaScript, you can set cookie tracking, randomize in which test group the visitor lands and adjust the allocation to each test variation. This is A/B-testing through GTM. AND: Traffic is unlimited in GTM.
Script placement for A/B-testing via GTM
To minimize flicker you want to load GTM as early as possible on the webpage, that is inside the head of the page. The location of the GTM-script below makes a big part of the job – even if it is not supported or endorsed by Google to place in the head element.
Why do you want to avoid flicker?
Flicker is a phenomenon which means that the visitor has time to see A-version (control) of your test before the B version (variation) is loaded.
If a user sees a glimpse of control-variation (a flicker), it is likely that he or she can act on the first impression. Studies show that it takes 50 milliseconds to form a perception of a page, this is often referred to as ‘Halo Effect’. The consequence is that user behavior can not be traced to either the control (A) or variation (B). 1
There is still a risk of flicker with this method, but the location of GTM script minimizes this risk. There are other factors at play, such as how big the site is and how other scripts load. Before you seriously start testing, you need to ensure that effect of flicker is minimal.
Load GTM script in head to minimize flicker.
Script for A/B testing via GTM
The code in detail – what happens?
1. Create cookie
First a cookie is created to consistently show the same variation to visitors if they return. We also define how long the cookie should be valid.
2. Define control and variation candidates
What do we do? The example (see line 25 of the code) defines the test candidate: a split URL test where the test variation sends the visitor to a new address, in this case: https://www.example.com/b.htm
BUT, you yourself with some coding knowledge can make just any frontend-changes you wish as with usual A/B-testing tools, for example copy testing etc.
3. Name the test
There we usually specify test number + location where the test takes place + keywords for the test, for example: TC1 Product page layout. Variation A/B is added to the end of the test name to easily distinguish between control and test variation in GA.
The remaining code sets a value where A and B variations each get 50% of the visitors.
Implementation in GTM
If you already have GTM, you will only need to create two tags (and one variable) in the GTM.
Tag 1: Test Script
You implement the code we provided via GTM in a Custom HTML tag. Select Firing Rule to the pages that you want the test to run on. To minimize flicker you should even set Tag Priority to a high value as the tags have ‘0’ as the default value ↴
Tag 2: Send Event
You create this tag for the Universal Analytics so that you can analyse your test data in GA. Tracking is done via events ↴
Variable: Cookie
Create the variable so you can retrieve the cookie using the script ↴
Analysis in Google Analytics
Test data comes into the GA through Events, and you can benefit from creating a Custom Report (or advanced segments) to more easily follow your most important data points for the test. To know when the test is over you should manually calculate statistical significance which you easy can do by clicking here.
Pros and cons of A/B-testing via GTM
Costs nothing
Unlimited amount of traffic through the test
Quick set-up process
Just need two tags and one variable (if you already have GTM)
Lightweight, does not increase the loading time for the website (in any significant way)
Risk for flicker (follow our advice to minimize it)
Requires understanding of coding (which other testing tools also do)
Performance analysis is done in GA (you should nevertheless always secure your tests in GA)
Summary
A/B-testing via GTM can be a great way for those who do not have direct access or who are last in line to the developers. It is also a “proof of concept” – easy to prove the importance of A/B testing, a small entry threshold that is.
GTM is a complement to the larger test tools, simple and efficient when it comes to test one URL against another: Split URL test. With coding knowledge you can use GTM as a test tool – free and with unlimited traffic.
Remember that GTM-Code should be loaded in the header to reduce flicker.
1. Lindgaard G., Fernandes G. J., Dudek C. & Brown J. Behav. Inf. Technol., 25. 115 – 126 (2006).↩
