Optimize
2.2K members online now
2.2K members online now
Learn how to create your first experiment and get tips on creating A/B, redirect, and multivariate tests.
Guide Me
star_border
Reply

a/b testing a different header

Visitor ✭ ✭ ✭
# 1
Visitor ✭ ✭ ✭

I know how to a/b test two different versions of a page, but what if you want to change an element that is prevalent on every page, like a header and top navigation.

Is there an equivalent a/b test where you can just add some javascript for two different versions. Version A will show this element, Version B will show another element. Then Analytics can you tell you which version performed the best?

1 Expert replyverified_user

Re: a/b testing a different header

Visitor ✭ ✭ ✭
# 2
Visitor ✭ ✭ ✭

+1 also looking for an answer to this.

a/b testing a different header

Google Employee
# 3
Google Employee

Yes, this is very easy.

 

Just use any page of your site as the "editor model" page and use it to modify the element.

Then go back to the experiment details page (before starting an experiment) and use the targeting tab to change the default URL targeting rule (experiment targets just the model page) to a regexp for URL or path .* (means match any url).

 

If you want to use javascript instead of the just the editor UI (palette, edit menu, dragging etc), click on your element and use the "Run javascript" option of the edit menu (note that you can use jQuery only if you are including it in your site yourself and if its defined above the Analytics + Optimize installation). The same will apply in regards to targeting.

a/b testing a different header

Visitor ✭ ✭ ✭
# 4
Visitor ✭ ✭ ✭

Hi Dimitris,

So I've changed the colour of the add to bag CTA on one of our product pages (just to test the above theory). I can see the targeting automatically targets the editor 'model' page so I edited that and used URL Matches and kept the editor page URL in there then below clicked 'OR' and pasted our Homepage URL and ended with .*htm  (as our product pages end with .htm  in a hope i can target everything beginning with OURBRAND.com and ends with .htm). Note: I've taken the dot out before the htm as I've read that this doesn't work but I'm clutching at straws here and code isn't my forte. So now targeting reads 'URL matches any of' with the above two URLS there. I've started the experiment on our testing site and I'm only seeing the changes on the editor model page (I've also set 'B' at 95% so I have more of a chance seeing it). It would be great to get your feedback.

 

Many thanks 

a/b testing a different header

Google Employee
# 5
Google Employee

You need to use the "matches regex" operator instead. You could follow those steps.

- In the container page use the overflow menu next to your experiment and "copy it"

- Go to the targeting tab and edit the rule to

  "URL matches regex http://OURBRAND.com/.*"

  If you have urls that work on http and https or use the www sometimes you could even use

  "URL contains OURBRAND.com"

  If you use the container script just on your site and don't really care about the URL you could do

  "URL matches regex .*"

  The . in the regular expression means any character and the * means any number of times.

  One random site with a quick simple introduction to regular expressions:

  https://www.icewarp.com/support/online_help/203030104.htm

- Don't start your experiment yet. Use the preview icon to test your model page

- In that tab navigate to other pages of your site and make sure that the change works well everywhere

- End your current running experiment (you can also archive it from it overflow menu)

- Start your new experiment

a/b testing a different header

Visitor ✭ ✭ ✭
# 6
Visitor ✭ ✭ ✭

Hi Dimitris,

 

Thank-you ever so much for your response! That was a great help. My next hurdle is behaviour targeting: How do I only show this test to new customers? Or returning customers? 'Time since first arrival' seems like a very long winded way of doing this and I can't see how this will apply to returning customers?

Thanks

a/b testing a different header

Google Employee
# 7
Google Employee

'Time since first arrival' will work fine as long as you don't want to make things "sticky".
For example, this would not help you with the following case: show changes to new users and keep showing them on their following visits.

 

'Time since first arrival' is the time since a user first came to the site (this time is recorded). So if you say use something like 'Time since first arrival' greater than 1 hour, the changes will start been showing to users at least 1 hour after their start visit on your site, which sounds as a good approximation for returning customers.

 

It is possible that a user may see changes if they keep using your site for more than > 1hour on their first visit, or they may not see changes if they come back within an hour.

But in general this is a good approximation of what you probably want to do.

 

To explain a bit more with another example: if you say 'Time since first arrival' less than 5 minute this means that the user will see the changes in the first visit and if goes back to the page in the next 5 minutes.

 

After this the user will not see changes but the user will be in the experiment in the sense that any objectives (goals met etc) will be attributed to his first experience on the first visit.