website heatmap

5 Proven Reasons to Install a Website Heatmap

12 March, 2018

If you have ever tested your website usability on your own, you know how many assumptions arise in the process of interface assessment. Very often we rely on our personal experience and mistakenly believe that other users perceive information in the same way.

As the result, it becomes extremely difficult to clarify the real reasons behind users’ behavior. Why do the majority of visitors ignore the largest banner on a website? Why does a part of potential customers leave a page despite a tempting offer to proceed?

To understand the behavioral factors of web resource visitors you need a website heatmap. This is a special tool for usability analysis.
The key advantage of the website heatmap is the opportunity to check whether the design of your web resource is convenient and understandable to users.
In other words, the click heatmap gives a chance to step into your users’ shoes.

Examples of Practical Benefits of a Click Heatmap

We really appreciate feedback and comments from our users. This is what allows us to collect valuable information for further improvement of our service.
Success stories of our customers are among the key indicators of Plerdy’s efficiency.  By following up our partners we get a chance to learn what practical benefits the website heatmap gives.
So based on the experience of Plerdy’s users, we have defined 5 main reasons why click heatmaps are especially significant for e-commerce projects.


Obviously, the design of a website must work and have maximum efficiency.
What does “working” mean when it comes to the interface of an online store?
First of all, this means that all components of a website are properly positioned and perform the assigned functions. If some elements (buttons, fields, banners) are not clickable, this may indicate that the chosen design or its certain components should be reviewed.

The effective design of an online store inevitably should take into account existing standards. It is much easier for website visitors to interact with a web resource that has standard navigation and location of buttons. Moreover, all new (even brilliant) ideas should always be additionally tested.
During such test, some elements of the design may appear to be unnecessary.

For example, there was an error detected in the design of our customer. The admins of the site just didn’t notice this flaw for more than a year.
This design had a small hamburger button with no function. Probably, it remained there from an adaptive version:

меню гамбургер
Visitors, hoping to open a hidden menu, clicked on it 13 times during one month only:

клики на меню
In terms of modern design, one should also consider such a new psychological phenomenon as “banner blindness”. This is a learned ability of users to look through advertising banners or skip them. Such behavior is caused by the defensive mechanism of a body. Every day we see hundreds of offers to buy something, and, as the result, we are getting used to ignoring them.
The example of a banner that remained unclicked for half a year:

A website heatmap shows how users perceive a certain banner.


A click heatmap helps to understand what type of content is the most popular with your web resource visitors.
It’s commonly known that the quality of content determines users’ interest towards a website. The popularity of a web resource or some of its pages you can assess using analytical systems (such as Google Analytics) while an interface and page content can be evaluated only with click heatmaps.

By the way, it was the research of user behavior that proved the practical benefits of an F-shaped pattern of content.
A major part of the planet reads text from left to right and from top to bottom, hence important information should always be positioned top left:

как читают тексты
Scroll depth data shows what portion of text users read. Based on this information you can define the best spots to locate banners or calls to action.
For example, the blog of an online store has some pages that are read down to the end (scroll rate is 60-80%):

данные карты кликов
However, other pages are only less than 20% scrolled. So we have recommended this store to rewrite the articles that have visitors but fail to catch their interest.


Do you know the difference between the behavior of users that opened a website on a laptop and those who use it from a smartphone? If no, then you don’t have a full picture to perform a usability audit.

While Google Analytics tells which pages are visited by users on different devices, Plerdy shows how people interact with a site:

клики по днях

The red curve is clicks on smartphones, the green one – on tablets, and the blue stands for desktops.
A special feature of Plerdy is that it allows collecting click data from over 15 different screen resolutions with 99% accuracy.

The data segmented by device type shows the number of clicks on various elements of a page and the ratio between different segments:

тип устройств


With a website heatmap, you will see which images on your website are a good choice and which should be replaced. This is especially applicable to online stores the pages of which are full of vibrant images.

All images on a website must either attract attention or sell, therefore, you should add only the high-quality ones.
If it is a category page, a website heatmap shows the elements that get the most and the least clicks:



Do all calls to action on your web resource work? In case of a link or a button with the offer to buy goods, you will be able to find out whether they are conveniently positioned, have an appropriate color and size.

A research of TechWyse has proven the impact of colors, sizes, and location of elements on a bounce rate. Another research, carried out by CareLogger, has shown that properly chosen colors of buttons may increase CTR by 34%.
Using Plerdy we have found the example of a button with an extremely low clickability:

как кликают
A designer has created this button, but, obviously, visitors more often go to a product, clicking on its name. Therefore, we have offered to conduct an A/B test to define the best product name font and color of the button.

In the same project, there was also a page with too many sections that made it unnoticed:

где не кликают
A site menu is an important element of navigation. Its analysis can show many interesting nuances.
Based on a 3-month click heatmap you can define which sections of a desktop version of your website are the most frequently visited by users.

A general click dynamics with the distribution of data between pages and their most popular components is separately collected:
общие клики


A real result is the best way to conclude.
In the picture below, you can see the changes that happened on the pages of an online store after “More” button had been added to all categories (here 2 different category pages are used for better illustration):

процент отказов

As you see, the bounce rate significantly changed. Some small corrections helped to make general changes to the behavioral factors on the whole website. This demonstrates the benefits of a click heatmap as a tool. While the analytics tracks users’ actions, the website heatmap shows why do they act like this.
So, here are 5 reasons to try Plerdy for your project:

  1. It helps to choose a “working” interface.
  2. You can define which content is popular on a website.
  3. An audience is segmented by device type.
  4. You can clearly see which images attract the most attention.
  5. You can significantly improve CTR.

Yet summing up, we still take some time to draw a general conclusion on all projects, as we are going to get the data from other resources and results of the changes of the above-mentioned projects.

Leave a Comment

Your email address will not be published. Required fields are marked *