Skip to main content

Using heat maps to improve user experience

· 3 min read
Luke Owen
Luke Owen
Lead Front End Developer @ Lunio

Once you get traffic to your website, you can start analysing it. You can introduce heat mapping into your UX to help you understand how users interact with your site.

And one of the best things is: you don’t have to be technical to read them

How heat maps can help​

Users are clicking things that aren’t clickable​

Users will click things they expect to be interactive, like links or to expand an image. It’s frustrating when something doesn’t behave as expected, so if your heat map shows lots of people clicking a random part of the page: you need to pay close attention.

Sometimes these are just misclicks, or the user is clicking to un-focus something else (like a menu). But these should be fairly random and with enough data, you’ll be able to ignore the outliers and see clear patterns.

Discovering bottlenecks​

A big benefit of heat mapping is discovering things that slow down your user flow, ideally you want the user to move smoothly through your site to complete their action.

For example if your main menu is hidden behind a button, and every user clicks that button – maybe its time to rethink that menu.

For bigger screens at least you can make the menu permanently visible, removing a stage from the user journey and giving them one less thing to think about.

Measuring how far users scroll​

Few people will scroll to the bottom of a page, heat mapping will show you how far they’re prepared to scroll before dropping off.

You can use this information to move the important elements further up the page so more people will see them. You can also simplify the page, if nobody is scrolling to the bottom to watch that video: get rid of it.

Measuring the effectiveness of your CTA’s​

This is especially helpful on a landing page, where you’re likely to have multiple calls to action to encourage users to convert. A heat map will show which are getting the most clicks (these are your most valuable), and which are being totally ignored.

The heat map will also highlight any elements that are drawing users away from your CTA’s, which will need to be fixed sharpish.

Validating your existing UI​

If your existing user experience is already really good, then your heat maps can help validate this. You might not have any reason to edit or redesign your UI: if it’s not broken, don’t mess with it.