Access analysis is essential for improving your website. Google Analytics, which is often used for access analysis, reveals quantitative numbers such as number of accesses, number of CVs, length of stay, exit rate, etc., but it also reveals how users act on the pages of a website. I don’t know until now.
A heat map is a tool that qualitatively visualizes user behavior on the pages of a website and allows specific improvements to be made from a UX/UI perspective. This time, we will introduce how to improve your website using heatmaps.
For website analysis methods other than heatmaps, we recommend this.
Results can vary depending on how you approach web analysis | MarkeTRUNK
What is a heat map?
A heat map
is an access analysis tool that uses colors to visualize actions such as what content users are viewing on a website, where they are clicking, and where they are leaving the website.
A heat map can be compared to a thermography that allows you to visually see a person’s body temperature.The temperature appears to be high in areas where action is concentrated, and the temperature appears to be low in areas where action is not concentrated. .
The actions reflected in the heatmap are cursor movements. The heatmap is reflected from the cursor log. Therefore, in order to view the heatmap, you need to install a tool-specific tag on your website.
What you can learn from heatmaps
The following four things can be seen from the heat map.
①Scroll
It reveals how far users who visited your website read from the first view on the page, and where they left the page. Specifically, the first view is set to 100%, and the percentage of users remaining until that point is displayed.
By measuring the exit rate during a page, you can understand whether the content was what the user was looking for when accessing the page.
②Attention
Find out which parts of the page your users spend most time reading. Specifically, we measure the time spent after scrolling and visualize it by color. The red part means it’s been read a lot, and the more it goes from yellow to green and green to blue, the less read it is.
You can see that the parts that users often read are the information that they are looking for, and conversely, the parts that are read less often are the information that users are not looking for.
③Click
See where users are clicking on your page. Similar to ② Attention, the location of the click is measured, and if it is frequently clicked, it will be displayed in red, and from there, it will be displayed from yellow to green, green to blue, depending on the degree of click.
You can see where people are clicking or not clicking, and whether there are “accidental clicks” such as clicks on non-CTA buttons.
④Mouse move
You can see how the mouse (cursor) is moving. The movement of the cursor is said to match the user’s gaze. You can understand how the user’s line of sight moves.
Website improvement using heatmaps
We will introduce how to improve your website using heatmaps.
① First view of top page
For effective website improvement using heatmaps, the first view of the top page is very effective. For the first view, you need to consider various elements such as catchphrase, CTA button, track record (evidence), and service UI settings.
For example, you can use a heat map to measure whether a catchphrase resonates with users. Specifically, we look at whether users scrolled or left after reading the tagline. We will improve the effectiveness by changing only the catchphrase and looking at the change in the exit rate immediately after the first view.
For CTA buttons, you can improve the effectiveness by changing the CTA type, text, location, and design, and observing changes in the click color.
We will improve the exit rate and number of clicks while considering the track record (evidence) and the presence or absence of a service UI.
②Frequently viewed content
If the most viewed content is at the bottom of the page, you might want to move it to the top of the page. By moving your content from the bottom of the page, where the drop-off rate is high, to the top, where it is more readable by many users, more users will read your content. Users will be able to see the content they are looking for, which will ultimately prevent users from leaving and improve CVR.
③Conversion page
It is also effective for improving CVR on conversion pages such as inquiries and document downloads. For example, if the form is not displayed or cannot be reached after a page transition, it is effective to put the form in first view.
④ Analysis by segment
If it is possible to analyze the results by dividing them into certain segments, it would be effective to improve the effectiveness based on the analysis results for each segment.
- Analysis of CV users/non-CV users
- Analysis of new users/returning users
For example, segment as above and improve your content and CTA buttons.
free heatmap tool
Some heatmap tools are available for free. First, try using it for free and start improving your site.
①User Heat
You can use up to 300,000 PV per month for free, and if you have enough PV for analysis, you can view five areas: “Perusive reading area”, “End area”, “Click area”, “Mouse movement”, and “Exit area”. Since you can view multiple pages within a site instead of just one page, you can analyze each page. You can also embed it with Tag Manager, making it easy to get started. However, since it is not possible to limit the period of time for analysis, it is difficult to analyze the site after it has been improved.
User Heat
https://userheat.com/
②Ptengine
You can use it for free up to 3,000 PV per month. It has an access analysis tool function and a heat map function, allowing you to perform quantitative and qualitative analysis at the same time. With the free plan, heatmaps can only be viewed on one page of the site, so it is recommended to start with analyzing the top page.
Ptengine
https://www.ptengine.jp/
③SiTest
You can use it for free up to 30,000 PV per month and can register two domains. It is also possible to perform heat map analysis segmented according to user behavior.
SiTest
https://sitest.jp/
summary
- Heatmap is an access analysis tool that visualizes user actions within a website using colors.
- Heatmaps show how far on a page people look (scroll), where they click (clicks), where they look often (attention), and how they look (mouse movements). understand
- When using heatmaps to improve the first view, you can change only the catchphrase and see the change in scroll exit rate, or change the type, text, location, and design of the CTA and see the change in click color. while improving the effectiveness
- Some heat map tools are available for free, so we recommend trying them out for free and working on improving your site.