Heatmap

 

Why do visitors behave the way they do on your website ?

For our delights, more and more tools are addressing this question: The "Why".

If you're lucky enough to count a heatmap tool in your marketing arsenal, this post will show you 15 powerful ways to use it.

Beyond and deeper than the "where do they click or don't click" question, let's have a look at heatmaps with less guess, and more data.

1) Investigate your Navigation Menu

This is one of the most useful thing with heatmaps.

If you have many menu items, it's not really a problem for e-commerce sites. But for lead generation sites, classified ad sites, or SaaS sites, the less menu items, the better.

So basically, heatmaps will tell you what are is most used menu items, and which are the ones unused, that you could potentially remove.

Important: choose the right heat map tool. You should be able to visualise where people click on drop-down menus, and dynamic elements.

A famous tool like crazy egg for instance, didn't have this feature a while ago (If someone knows if they have now, please leave a comment).

Example 1 :

On a B2B lead generation site, I had a successful A/B test by reducing the number of menu items from 7 to 5.

Example 2 :

On an online store, thanks to heatmaps we realised that 85% of the sales were coming from only 3 categories. At that time, we realised it wasn't optimal to have a menu cluttered with many categories, when most people were only clicking on 3 categories.

2) Low volume sites : Use Meta heatmaps

If you have a low traffic website, and your menu doesn't change from page to page, you can take advantage of "template heatmaps".

Rather than having one heatmap per page, a template heatmaps shows you clicks on elements which don't change much. Like the header, the footer, or the menu. Very handy.

3) Site search : Is it much used ?

In a glance, you will see if people click more on the site search than they do on your categories, or menu items.

This is a solid hint to know whether the navigation is clear or not.

Also, an interesting thing to do, is to create a segment for people who used the site search.

It may happen that people using the site search are converting better, since they know what they are looking for. If so, you may want to address them a specific message. 

4) Get more space in your designs and pages

banners : which ones clutter the page for no reason ?

This is what everyone do with heatmaps.

Areas where people click a lot, should be brought forward to get even more attention. After all, this is what most people are looking for.

Areas where people don't click, should be removed, so as to leave more room for click elements.

This is obviously a general principle, and some elements with very few clicks may be very profitable. As always, rules should be adapted to your context.

 

5) Where do people need more info ? 

Something less intuitive, is where people click, when there is no link.

It may be that the design suggest a link, unvoluntarily.

Or, it may be that people are looking for more information about a specific topic. This latter case is much more interesting, because it tells us what people want, what may help them to convert.

For a new B2B lead generation site for instance :

If a landing page heatmap shows a lot of clicks on a specific word, it may be a good thing to address more information about it, within the page.

As landing pages are often made very short, these are great indications of where the description is actually too short.

6) How do people interact with your footer ? 

Years ago, or website linked used to have a fuller field with links sitewide, for SEO reasons. Now this is really outdated.

You may use your footer for different reasons, like adding elements of navigation, your social bookmarks, and opt-in for your newsletter etc

People shouldn't really need any specific element of the footer. Otherwise, it 'd mean they'd struggle until the end of the page to find what they were looking for.

In cases that happen, and some elements of your footer are hugely popular, it's likely that a link or a block should be higher on the page.

7) Is your page too long, or too short ?

For e-commerce sites, some listing pages are very long.

For lead generation sites, some services or products need to be explained before arousing interest.

All pages can't be made short. Some page work better if they're long.

It's tricky to find the right balance between a short page, quick to read, and a long page, where you have more room to pitch your product/service.

Scroll maps are just made for that. It tells you to percentage of people scrolling down to a specific area.

This is not really easy to read. This is what I look for in scroll maps:

  • how many people scrolled enough to see the Call To Action button.
  • Is the gradient smooth ? Or Which are the areas where all the people are leaving the page ? This latter case shows a page area that should be more comprehensive or direct to the point.
     

8) Analyzing this Homepage rotating carrousel, slide by slide

It is hard to pitch something powerful with just a few words.

Every marketer encounters the situation, to such a point that a "solution" became very popular: the homepage carrousel.

The problem is, that most visitors makes a decision to continue their visit or leave your website within a few seconds. So they just don't have the time to see all the slides of your carousel, far from it.

So assuming that they will see only one slide of your carousel, let's hope it will be the good one.

This is one explanation of why carrousel have such a bad reputation regarding conversion rate optimisation.

Using heatmaps is great to analyse a carrousel's performance.

Usually, you will see a lot of clicks on the navigation controls. If it doesn't happen, that probably means that the controls are somehow hidden. 

But what's really interesting is comparing the clicks on each slide of the carrousel. Must heatmap tool include a percentage heatmap, which gives you more quantitative details.

So, if your first slide gets 70% of the clicks, and the five remaining slides share 30% of the clicks, ask yourself if your marketing messages shouldn't be put somewhere else.

9) Filters : which ones are the most used ?

Here is one of information that is hard to retrieve with your analytics software : what filters are the most used by visitors?

In a glance, a heat map will show you what filters are popular, and which are the ones which just clutter your page.

Then, you may use this information to prioritise the order for the display of filters.

10) B2B Lead generation : Which field make users abandon the form ?

If the goal of your website is to collect leads, then your forms are of primary importance.

The typical patterns who lead visitors to your form page, or 'Conversion funnels' 

Funnel optimisation is such a popular topic, for good reasons. It is so crucial to know at which step your visitors are dropping and exit your website.

If your goal is that visitors fill in your form, then you could have even more granular data.

Wouldn't it be nice to know which form fields are easy to fill in for your visitors, and which are the one that make them run away?

By using heatmaps with percentage, you are able to see this.

Just like scroll maps, what you're after is a clear break. If the form field is really unclear, or ask very sensitive information to your visitors, most of them may leave at this point.

Identifying these forms breaks is the greatest start to enhance your form's conversions. Next step, just A/B test the form without the guilty field !

In addition to breaks, you could look for the overall conversion rate: if people begin to form, do they fill in till the end?

As you can see, heatmaps are a huge help to understand how your visitors interact with your forms.

11) Segmenting by converters / non-converters

Here's a goal is quite simple: observe and notice the behavioural differences between converters and non-converters.

By segmenting, you could find features or usages which could be either a dead-end for conversion, or leads to massive conversions.

Do converters use more as a menu, or the site search?

Which banner is more clicked by converters? By non-converters?

Which category? Which slide of my carrousel ?

Just like segmenting in Google analytics, every significant difference between converters and non-converters is insightful.

Next step : Make non-converters behave the way converters do!

12) Segmenting by new/returning visitors 

It is quite common to see a greater conversion rate for returning visitors, compared to new visitors. 

So it's useful to dig in the behaviour of new vs returning visitors. And heatmaps are just perfect for that.

Which elements of navigation do returning visitors use ? Which banner make them crazy ?

Important note: any remarkable preference from segment X, could be used for web personalisation. For instance, if returning visitors love the banners A, B and D, why not remove the banner C for this segment ?

Offer people what they want. Not all the people want the same thing, but specific segments of people want the same thing. Hidden opportunities there!

13) Segmenting by source and channels

As Marshall McLuhan put it, "the medium is the message".

Your audience will interact differently with your pages, depending on where they come from.

Let's use heatmaps to see if we can identify some clear different patterns.

Then, let's personalise the user experience using segments.

14) Segmenting by device : clicks on mobiles too

Due to the nature of tactile devices, you may expect clicks to be in different places.

Something that is legible on your desktop, may not be legible on small resolutions. That will obviously affect clicks!

So, segments by devices.

Not all heatmaps tools are responsive. I use Beampulse, which works great to analyse clicks on mobiles.

But how to see your heatmaps on mobiles from your desktop?

Here is the is the easiest process for me:

  • Use Google Chrome
  • navigate to a given page with your heatmaps tool
  • Open from developer tools by pressing Ctrl+Maj+I on PC
  • In the upper left corner, click on the smart phone icon to toggle the device mode
  • Then choose a device
  • And refresh the page to refresh the user agent (important)

That's it! Now you have your heatmaps on any smart phone from your PC, within 30 seconds.

15) Thank you pages

Do you try to get one last thing from your visitors on your Thank you pages ? 

If not, you should.

  • Promote your company values,
  • display your newsletters' opt-in with an irresistible offer,
  • display partners' offers
  • show your latest hilarious tweets... 

Thank you pages are a good place to engage further with your customers, and make them eventually come back.

But, do people click on your offers ?

Or rather, who is the winner, what is the thing that gets clicks ? What should be removed ? 

Conclusion

Far from being just another marketing gadget, heatmaps are a great source of analytics data. 

Heatmaps are often underused, and by segmenting, you will gain the greatest insights.

If you follow this 15 steps list, you will likely gain a better understanding of your visitors.

Then, you will have a great hypothesis for A/B testing or web personalisation.

 

 

I'd love to know how you use heatmaps, please let me know in the comments below !

Add comment

Security code
Refresh