The Next Generation of Visual Website Optimizer is launching on 29th April 2014 See What's Coming

3 Ways to Increase Conversions Using Heatmaps

Posted in How To on February 28th, 2013

Heatmaps within Visual Website Optimizer are great for getting an overview of how visitors behave on a landing page or website, but I frequently see that people don’t really use them to make a decision on anything. That’s unfortunate, because analytics and information should support decision making, and not just “provide an overview”.

To show how heatmaps are very useful to understand your visitors, I’ll discuss two case studies where they were the basis of successful A/B tests and then ask for your vote on one about Visual Website Optimizer.

Case Study 1: Google said DON’T put it on the left, but they still did

Dennis Publishing felt that they could earn more revenue from the Google ads on their website Carbuyer.co.uk. They saw on their eye-tracking heatmaps that the left pane of the website got a lot of attention from users. So they decided to shift the Google ads placement from under the review text to the left pane, in spite of Google recommending not to put it on the left.

Here is a comparison of the control and variation screenshots (click image to see larger version)

CarBuyer increased conversion rate by changing placement of Google ads

The Result

The in-house team at Dennis Publishing ran the test on 8000 visitors where it increased click through rate (CTR) by 74.5% (97% statistical significance). After making this test live site-wide, the CTR has increased by 44% and RPM (revenue per 1000 ad impressions) increased by 48%

That’s right. Dennis Publishing disregarded Google’s advice and chose to trust their own heatmaps to finally increase revenue by 48%

Case Study 2: Heatmap shows that the navigation bar is a distraction

Pair (an app for couples, now rebranded as Couple) had a simple landing page where visitors could go download the app or go to their Blog, Help and Jobs pages. This is the original page (click to see larger version)

Pair app's original landing page

Lim Cheng Soon, the growth hacker at Pair decided to run a test on the homepage using Visual Website Optimizer in which he only recorded the heatmap.

Heatmap of Pair homepage

Lim explains what he did after that:

Turns out, I found out too many people click on the navigation bar on the top instead of clicking the conversion button (link to AppStore and Google Play). So I made up a theory that having too many “distractions” around the conversion button wasn’t such a good idea.

So I do a couple of A/B tests based on the theory of removing the “distractions” around the conversion button. Such as hiding the navigation, hiding the social sharing button, hiding the “Download for Free” text. I even do “counter theory” test as to prove my theory wrong by having a larger “Download for Free” text.

And turns out, my theory was almost correct:

  • Hiding “Download for Free” text above the button gave a 10% increase of conversion.
  • Hiding navigation menu gave a 12% increase of conversion.
  • Hiding social sharing icons (facebook, twitter) wasn’t so good, a 34% decrease in conversion.
  • Having a larger “Download for Free” text (my counter theory) gave a 42% decrease in conversion.

Based on the result of A/B testing, I did a new version of a homepage for split testing by moving navigation menu to the footer (instead of header), hiding the “Download for Free” text, but keeping the social sharing icon intact. And the result? 25% increase in conversion. Win!

This is what the variation page looked after all the tests (click on image to see larger version)

Pair landing page after all tests

Three important lessons we learnt from this test

  1. Even though the menu may be difficult to see, don’t assume. Check your analytics and heatmaps.
  2. Clearing up the clutter around Call To Actions is worth testing.
  3. Social proof (if you have it in substantial numbers) goes a long way.

Case Study 3: Our turn! (we need your opinion on this one)

Okay so this isn’t exactly a case study. It is us asking for your opinion. Checkout the heatmap of our homepage (click on image to see larger version)

Visual Website Optimizer homepage heatmap

Do you see the problem? Visitors click on the “Free Trial” button on the top right more than they do on our primary call to action just below the headline, in fact, almost thrice as much. We think that we lose some conversions because the button is surrounded by other links that distract the visitor. To solve this issue, we have decided to conduct two A/B tests.

The first one is simple: Change the button text to something like “See how” or “Learn more” and direct to a page that explains A/B testing, talks about the benefits of using Visual Website Optimizer then asks visitors to sign up for a free trial. The hypothesis is that visitors need to know more before they sign up.

The second is redesigning the homepage to follow the F-shaped eye movement more closely.

Visual Website Optimizer Homepage Variation

Unfortunately, we’re strapped for time & resources and can only run one test at a time. Which one do you recommend we try first? (You’ll be voting through a tweet)

Click to vote for Test 1 – Change the primary CTA to direct to a page that explains A/B testing and Visual Website Optimizer

Click to vote for Test 2 – Add a video or image on the left and shift the headlines and CTA to the right

If you feel there’s something else we should do, let us know in the comments.

Siddharth Deswal

I do marketing at Visual Website Optimizer.

The Complete A/B Testing Guide

Know all that you need to get started:

  • What is A/B Testing?
  • Is it compatible with SEO?
  • How to start your first A/B test?
Show Me The Guide


Tags

9 Comments
Ahmad Rahman
March 1, 2013

Siddharth, the case studies are great and thank you for sharing.

As for your request for feedback on a potential test for VWO site, I’m confused. VWO is so easy to use, what resources do you need to setup the tests? Especially the first one to change the CTA on the button?

I would suggest trying a “see how” vs. “free trial” type wording switched between top and bottom. So “see how” on top, and “free trial” on bottom vs. “free trial” on top vs. “see how” on bottom.

Gleb Koshulko
March 1, 2013

Test “Free Trial” on the primary call to action button. Also test “Case Studies” instead of “Success Examples” – you wrote about similar case here: http://visualwebsiteoptimizer.com/split-testing-blog/9-award-winning-ab-tests-2013/

@Ahmad,

Thanks for dropping by and the kind words. For the first test, we’ll need to create a new page that addresses all questions of the visitor who has clicked through. So that means we have to cover
1) what is A/B testing
2) why is A/B testing useful
3) what is Visual Website Optimizer
4) benefits of VWO
5) testimonials from happy clients
6) Case studies
7) Sign-up form

This page will take up a bit of time actually.

@Gleb,

Thanks for the suggestions. The two pieces of text you’ve pointed out are actually the result of A/B tests of their own. In our case, we found that “Success Examples” leads to higher click throughs, unlike ion Interactive, who had a different experience as you pointed out.

Quincy
March 1, 2013

It would be interesting to see the results of just swapping the calls to action on those two buttons. Seems mundane, but maybe “free trial” is preferred over “try it for free”! Loved this post by the way — thanks for posting it!

joe
March 1, 2013

Why don’t you try changing the “free trial” button to purple so it’ll blend in more?

Gregg
March 2, 2013

Agencies looking at your tool may have have smaller clients who cannot afford Test & Target or WebTrends. So their clients tests may not be 3 day tests, they may be tests that take 30 days to prove out with just one test variations. In all cases, especially these, the LAST thing you want to do is plan tests with flat or losing results.

The reason I chose VWO is because you offered heatmaps.

I would suggest testing a landing page that really plays up the fact that you’re getting a testing tool coupled with heatmaps.

My first test with VWO was flat. But the heat maps actually sparked an idea for a second test by showing me users were clicking on content that did nothing. So we’re making that content active.

Okay, my recommendation below. (I’m not a copywriter, so you’ve been warned) Try changing your Value Proposition to:

“Visualize Your Visitors Clicks and Run Smarter A/B Tests – Simple A/B Testing Coupled with Built-In Actionable Heatmaps”

This is a true “Only” statement. Meaning you guys are the only testing tool within your price range (optimizly and convert) who offer heatmaps.

Your customers tests will perform better because you’re given a window into how visitors will engage with all variations and the control of your landing page.

This could also be coupled with images of heatmaps and examples of how you can apply action after seeing a heatmap.

@Quincy, Very happy that you liked the post :) The text on the big CTA was A/B tested and this is what we found to be the winner. My hypothesis is that it has something to do with the F-shape of visitors’ attention… they simply don’t see below the headline and instinctively move to the top right for all their “Free Trial” and “Login” needs.

@Joe, thanks for your suggestion. Not tried it so far because am scared blending in the “Free Trial” button will make people click less on it, and fact of the matter is, we’d like as many people signing up for trial accounts as possible. However, obviously views and opinions don’t count for much. This is a test I’ll put on our optimization roadmap.

Paras Chopra
March 4, 2013

@Greg: thanks SO much for this perspective. Yes, we know heatmaps in Visual Website Optimizer is a big value addition. But, to be honest, we never tried split testing our landing pages on that value proposition. Thanks for the idea. We’re definitely going to try this value proposition and see how it impacts our conversions. We will also blog about that split test :)

Sarabjot
March 8, 2013

Very informative case study on heatmaps.. keep up the good work..

Leave a comment
Required
Required - not published


9 × = thirty six

Notify me of followup comments via e-mail.

RSS feed for comments on this post.

I ♥ Split Testing Blog


Stay up to date

Recent Posts

Write for this blog!

We accept high quality articles related to A/B testing and online marketing. Send your proposals to contribute@wingify.com