In my previous posts I introduced the idea of externalised javascript libraries to abstract over Google Analytics page tracking and ecommerce transaction tracking.
This idea also transfers nicely into Google Website Optimiser where you can experience some interesting scripts on your first visit!
Caveat
These articles assume you are at least familiar with the concept of multivariate testing, javascript, Google Analytics tracking and the Live HTTP Headers plugin in FireFox.
As with the last posts - use these scripts at your own risk. Don't link to the script libraries directly, copy and tune to your own needs!
A Simple MV Test made simpler
A normal website optimiser multivariate (mv) test requires a control script, tracking script and goal script to be placed on your pages. The control script decides which experiment variation to show. The tracking script records which test variation was shown and the goal script records the experiment conversion.
Two cookies are also used in combination with the standard GA cookies.
Standard cookies
utma
utmb
utmc
utmv
.
.
.
etc (there are quite a few!)
Website Optimiser cookies
umtx
utmxx
The nature of the standard cookies is not the subject of this article. In summary, the utmx and utmxx cookies are used to remember which test variation a users sees.
If you inspect the cookies you have in your browser right now you probably won't have any utmx cookies for the moneyspyder.co.uk domain. If you go to the example page for this article and recheck your cookies, you should now see a utmx and utmxx cookie for the moneyspyder.co.uk domain.
You've just been tested!
You will have equal chances of seeing a very simple page with one of three different pieces of text and two links:
Original page
Test 1
Test 2
(and two links to goal and purchase)
Delete the utmx and utmxx cookies and reload the page to see different variations. This is standard Website Optimiser type development/testing/debugging.
You should also inspect the HTTP Headers output. Notice the request for siteopt.js? Notice the utmx and utmxx values? If you don't see these - it's broken. Simple. Check for javascript errors.
The source of the html page will reveal the how the test is rendered. As with the page tracking example we are including Moneyspyder javascript libraries:
<script src="/javascripts/ms_ga.js" type="text/javascript"></script><script src="/javascripts/ms_wo.js" type="text/javascript"></script>ms_wo.js gives us three methods to use:
ms_wo_ctrl
ms_wo_tracking
ms_wo_goal
All three methods take the experiment id as a parameter 'k'. You can get this value from the supplied script snippets when you set up your test.
The control script normally sits at the top of your content - ms_wo_ctrl replaces this script and so, sits in the same place. Feed it the test id to setup the test. Directly beneath the ms_wo_ctrl script, call the ms_wo_tracking method. Feed it the test id and Website Optimiser ua account value to track the test view.
Now, normal test scripting applies for a moment. Wrap the content you are testing with your utmx section and noscript tags as normal. At Moneyspyder, we are considering implementing later versions of this script library with the ability to 'document.write' the utmx sections based on matching dom elements by id or class. We'd be interested to hear your thoughts on this. Less code is better, right?
So, assuming your test is set up you should now have a page that mirrors the format of http://moneyspyder.co.uk/ms_ga.html:
Viewing this page and inspecting the HTTP Headers output will reveal the following requests:
ga.js (Google analytics script library from Google)
siteopt.js (Website Optimiser script library from Google)
utm.gif requests
The request to siteopt.js will pass in values of your utmx and utmxx cookies if you have them so that you can see the same test variation you saw last time or, if you don't have the cookies, your test variation and utmx values will be set.
Having displayed the test variation content, your page will track the test view with a utm.gif request to the Website Optimiser UA account and the utmp value of the test id follwed by the string 'test':
utmp=%2F0102111525%2Ftest&utmac=UA-11-56683-1
The goal page follows a very similar format but just calls ms_wo_goal in the same way as ms_wo_tracking with the UA and k values:
ms_wo_goal(['UA-11056683-1'],0102111525);
And so the page is tracked as you will see by inspecting the HTTP Headers output for the utmp and utmac values.
Wrap up
So, we have seen how the javascript supplied by Google for page tracking, transaction tracking and website optimiser testing is totally 100% fit for purpose and great to use. But with a little thought we can afford ourselves a little more power, maintainability and ease of use. We have cleaner pages and can handle change a little better.
If these articles help you implement good quality Google product integrations then we have a success. If you want to take this work further for your own sites, great but remember it's good to share! If you want to challenge this work, feel free to leave comments or drop us a line at info@moneyspyder.co.uk - we'd be happy to exchange ideas!
No comments:
Post a Comment