Google Web Site Optimizer Tool: I Told You So

As designers and developers, we all make design decisions every day. We scribble thumbnail layouts, we research heatmaps, we crunch designs onscreen, we try to think like the user, and we ask colleagues and friends for their opinions and insights on a complex range of issues:

• Which keywords should I use for my main navigation?
• How should I arrange the layout to keep people from dropping off?
• Where are my ads most effective?
• Can people find my search box easily enough?

In short, we all do our best to weigh up all the variables, choose the best combination, build it and get it online.

But can you prove it's the best option?

With the official release of Google's "I Told You So" Tool (otherwise known as the Website Optimizer Tool), perhaps now you can.

We were able to run a tidy little test last night that gave us some great results. I'll run you through our trial.

The Test: To Underline Or Not?

If you've visited sitepoint.com in the last few days, you would have found it difficult to avoid seeing our founders (Mark and Matt) in a chicken suit and Moose hat respectively (perhaps courtesy of some "Photoshop persuasion" from yours truly).

As we have never really discounted any of our kits before, my design brief was to make sure everyone who visits the site knew about it. I'm generally loathe to fiddle with our site header banner area but made this a temporary exception.

The sticking point was the "Our founders have gone crazy!" text. Luke, our Managing Director, was understandably concerned that users may well notice the image, but not understand that it was clickable. He was keen to have the text underlined to reinforce the idea that it was a link.

My personal view was that the image and its positioning was radical enough to motivate users to interact with it, and that the underlining would visually detract from the site without getting many more clicks.

My task was to use Google Website Optimizer to prove it either way via a simple A/B split test. (Note: The service is free but you will need a Google AdWords or Google Analytics account to run your own tests. However your testing doesn't need to involve AdWords.)

The Process

First up, create a new experiment: Once you've activated the Website Optimizer on your account, you will be asked if you want to create a new experiment.

Multivariate experiments require more set up time, more traffic data to be effective, so I'd recommend sticking to the simpler A/B Experiment option.

Next, set up your test pages: Once you've created your experiment, you need two standalone versions of the page you want to test -- perhaps index.html and index2.html. This can create other issues, but we'll talk about them later.

You also need to identify a conversion page -- the destination page inside your site to which you're trying to move users. This could be anything from a blog post or product page, to a checkout page or navigation tab. You'll need to put code on this page, so it will probably need to be a page on your site, rather than an external destination.

Next, you'll be asked to name your experiment and tell the Website Optimizer where your three test pages live. You'll then be asked if it's you who will be adding the JavaScript tags to your test pages, or if a separate developer team will be doing the deed.

I'm assuming that if you're reading this article, you're probably a D.I.Y type.

Either way, the person adding these scripts doesn't really need any JavaScript know-how, they just have to know their HTML well enough to be able to accurately copy and paste code snippets into their pages.

Add the "JavaScript tags" to your pages. Although this is the most technical part of the procedure, Google does a nice job of making it easy.

You'll have 4 JavaScript snippets to add to your pages (add one more for each new page variation).

• one at the top of your original page
• one at the bottom of your original page
• one at the bottom of your alternate page
• one at the bottom of your conversion page