How to Analyze Heatmaps?

Categories
Digital marketing User Experience (UX)

UX specialists often get questions from their customers regarding what a heatmap is and how to analyze it. So, let’s go step by step. So, what is a heatmap?

A heatmap is unquestionably a must-have tool for the specialists involved in usability enhancement. Heatmaps provide valued data about clicks, hovers, and scrolls, enabling you to conduct a comprehensive UX analysis and significantly improve user interaction with your site. However, simply collecting the info from a heatmap is not enough. It needs accurate interpretation. So UX specialists proceed to analyze the collected heatmap details.

Plerdy heatmaps have helped to analyze and boost the usability of multiple sites. To better demonstrate this, I’ve further provided a few use cases of how we analyze heatmaps in the article.

Heatmap Analysis Framework

Now is the right time to clarify how one can analyze a heatmap. At Plerdy, when we have a set task to check how users behave on a certain site, we usually follow this procedure:

  • The first thing we do is generate ideas of what we should check.
  • Next, we build hypotheses for what we should improve based on the heatmap data we analyze.
  • We go page by page (home, product, cart, payment page, and so on), seeking abnormalities that prevent users from moving to the next page and making a mini-conversion. For example, it can be adding an item to the cart, filtering goods, using the search function, etc.

Next, we analyze the results obtained, and on their basis, it becomes evident how to improve UX.

How To Analyze A Heatmap: Best Cases From Plerdy

Pro-street. dk Heatmap Analysis

How to Analyze Heatmaps - 01

The analysis of a heatmap on pro-street.dk pointed to a low scroll depth. If only 25% of users scroll down the page, there is something wrong with the first screen. The main thing is that the huge logo and partner’s ad takes up the greater part of the space on the page. So, a good idea would be to make them smaller and place something more eye-catching in the central part instead.

All in all, based on the received results, I’ve recommended the following:

  • re-sizing (making smaller) huge elements, including the logo and advertisements;
  • eliminating useless icons;
  • concentration on their service rather than making partners’ ads the main focus;
  • adding catchier content and CTAs;
  • improving navigation by adding subheadings, internal links to related content, and a fast scrolling button.

Implementing the described actions will decrease the bounce rate and significantly improve the site’s usability.

Heatmap Data On 3das.com

How to Analyze Heatmaps - 02

The heatmap installed on 3das.com demonstrates that the site has repeated elements such as the “Search” and “Contact us” fields. It would be wise to leave them used once and relocate the social media icons to a footer.

The site lacks an FAQ section and pagination. Adding them would simplify the user experience.

Notably, the site content is not adapted to mobile devices, which impacts the bounce rate. So, to make users stay on your site and convert, the content should be adjusted for desktop and mobile users. And I also recommend adding a zoom function for images.

The heatmap shows that users tried to click on some parts of the text though it had no links. If these parts draw users’ interest, making them clickable would bring only good.

Besides, 3das.com needs unifying fonts and adding catchy CTAs to increase conversions.

Results Of The Alseresport.com Heatmap Analysis

How to Analyze Heatmaps - 03

The Alseresport.com heatmap analysis demonstrates rather good results. In particular, the cart and checkout pages look pretty good and safe. As for the home page, the search bar and the login button are very often clicked on. Nevertheless, there is space for improvement.

Considering authorization, there are two useful recommendations for its simplification:

  • to enable the user to see the password you are typing in;
  • to allow logging in via a social media account.

Because of a rather low scroll depth, not all users see the 5-euro discount offer at the bottom of the page. Therefore, I recommend displaying this offer on a pop-up, for instance, 15 seconds after a user loaded the page.

In general, the images on the site need to be unified in a single style and improved in quality.

Judging by 65 clicks on the “Contact” button in the footer, the site’s visitors lack some information. Therefore, the content should be expanded and structured:

  • add details about delivery methods, for instance;
  • present the product descriptions in tables;
  • highlight headings for better perception.

And though there is a good FAQ section, the relevant button should be located in a more visible place.

I also recommend forgetting about the “no results found” page. Instead, we should offer alternatives that are as similar to the user’s request as possible. Enabling users to filter the products would also positively impact the UX.

Assessing UX With A Heatmap On Animalessalvajes. world

How to Analyze Heatmaps - 04

The first thing to pay attention to is a pop-up that appears 5 seconds after the user loads the site. Unfortunately, 5 seconds is too short a period that is not enough for a visitor to understand what the site is about fully. This is why I recommend changing the display rule for this pop-up, making it appear in 15 seconds, or at a 30% page scroll, for instance.

Next, duplicated elements. If we look at the categories in the menu, the main bar, and the search bar, they are the same. We can either remove them or change them somehow. Plus, the search bar also appears twice on the home page. One will be enough.

In the right part of the screen, I see a massive blank white space that brings no use but harms UX.

Again, the search bar does not stand out among social media icons in design. However, it is more important, and, thus, it should stand out, it should be more visible.

I’ve noticed too many articles on the homepage. It is better to leave the most valued on here and add pagination.

I would also make the phrase “Discover more” clickable to lead users to the dedicated category pages. Alternatively, I’d add the buttons with CTA on those categories to hint to users where they need to click.

The subscription form placement. Only 24% of visitors scroll to this place, so it should be placed slightly above or re-designed. The neutral design makes the subscription form not very noticeable. We need to make it catchier by complementing it with a banner and changing the style or the message. Adding a bit of creativity to the site’s slogans would attract more conversions.

Again, because of a very low scroll depth, the elements in the 4th region could be placed upper on the page if they bring value.

Gothombi.com Heatmap Analysis Results

How to Analyze Heatmaps - 05

The first thing that draws my attention is the big banner that takes up almost the whole first screen. I recommend resizing it since it is more important to give here valued info rather than just showing an image. Besides, the “Learn more” button also leads users to the first screen that gives no details.

Estimating the scroll depth, I see that only 47% of users got to the third region, and 53% of visitors saw only a nice image. So, in general, we need to resize images to enhance the load speed because now it is rather low.

Though we see no important information on the homepage, we can find it in the footer. However, the links there lack an “a” tag, so they look like texts, not links.

The subscription form containing information about Covid is a good idea, but it could be improved to grab more attention since we see no clicks here. Unfortunately, another subscription form in the footer shows no clicks, which is no surprise because people rarely scroll down to it. To increase the form’s visibility, we could present it via a pop-up with rigid display rules.

When we fill in the subscription form and click “Subscribe,” the button appears again, and we are sent to another page. This is not good for UX. The user should know for sure that their query has been sent. I recommend improving the spam check page design, moving the ReCaptcha to the previous page without going to another page, and adding a message stating that the form was sent without a spam check.

Daybydaycrm.com Heatmap Interpretation

How to Analyze Heatmaps - 06

When we go to daybydaycrm.com, the first thing we see is an immediate pop-up. Judging by the 124 clicks on the “Hide” button and only three replies, we see something wrong with it. The pop-up asks users what prevents them from signing up. If we have just loaded the site, we have not had enough time to familiarize ourselves with its content. Therefore, we cannot reply. Therefore, I recommend adjusting the display rule, giving users more time to browse the site.

The heatmap shows that the Features and Pricing buttons are the most frequently clicked. Adding an arrow to hint that this section comprises more tabs would be a good improvement.

In general, for better UX, I strongly recommend the following:

  • making the menu bar floating;
  • adding an arrow for a quick return to the top of the page;
  • enabling zoom-in opportunities for images;
  • enabling users to see the password they are entering when logging in;
  • simplifying registration by allowing logging in via social media profiles;
  • adding buttons with CTAs after the described prices;
  • creating an “About Us” page to tell users more about the company and its representatives.

What else draws my attention is that the “Learn more” button gets more clicks than the “Get started free” button, probably because of the design. So we could make the latter button stand out to get clicks.

Another important piece of advice is to remove duplicated elements,

For instance, following the “Support” and “Contact” links in the footer will lead us to the same page.

Conclusions

In this article, I explained how we analyze heatmaps – such essential marketing tools. By providing Plerdy’s use cases, I illustrated the logic of the heatmap analysis framework. And I hope you have found it useful.

Article by:
CEO Andrew Chornyy

CEO Plerdy — expert in SEO&CRO with over 11 years of experience.

Leave a Reply

Your email address will not be published.