VWO Logo
Dashboard
VWO Insights
Heatmaps

Robust Heatmapping Solutions for Your Websites

VWO heatmaps help you see how visitors browse your website, what catches their attention, and which elements distract them.

Know more
Complies with:
VWO GDPR Ready Badge
VWO CCPA Ready Badge
VWO G2Crowd Leader Spring Badge
VWO BS 10012 Certification Badge

We tweet useful stuff daily

Related content:

Google Analytics Heatmap: How to Create and Read

7 Min Read

Google Analytics is one of the many services that Google offers to help you measure your website’s performance by tracking and collecting metrics on your website’s visitors, their conversion rate, bounce rate, average session duration, page views, and so on.

Despite tracking every data point that marketers need to gauge their website’s performance, GA lacks one very important element – the visualization of collected data, in particular, heatmaps. This has always been a major cause of concern for its users because it means they invariably have to invest in other visualization tools.

Google Analytics and heatmaps

A quick SERP analysis of the query ‘Google Analytics heatmap’ on Google shows that there are two contrasting intents behind raising this query. The first is that readers want to learn how to create a website clickmap using their GA data with a Chrome extension, and the second is how they can analyze data using different heatmaps. This blog attempts to address both these queries so readers can gauge every aspect of Google Analytics-related heatmap.

To tackle the gap between numerical data and data visualization, Google released its In-Page Analytics feature, which now works through a Chrome extension. This way, GA bridged the gap between quantitative and qualitative data to a great extent.

Chrome extension for Google Analytics heatmap

When it was first introduced, the In-Page Analytics feature looked like this on the GA dashboard:

screenshot of the In-Page Analytics within Google Analytics
Image Source: Iblogzone

The heatmap generated using this feature showed user clicks on links on a page in percentages (aka a clickmap).

The only prerequisite for this was that you must be logged into your website’s GA account, and then you can configure your GA settings and view data on your web pages as you navigate through them.

However, GA soon removed this from In-Page Analytics and introduced a chrome extension for the same. Once you install the extension, you can view click data in the form of clickmaps. The video (GIF) below elucidates how this extension works and the resultant overlay website heatmap (clickmap):

GIF on how to use Page Analytics Chrome Extension from Google

The Page Analytics extension once turned on for a page, gives an overview of metrics like page views, unique page views, average time on page, bounce rate, exit percentage, and real-time page visitors. These are the default metrics that are shown when the extension is turned on, but you can always change them to the metrics that you want to see on the page.

a screenshot of the metrics displayed by Google Analytics
Image Source: Google

More importantly, it gives you an option to change the segment whose data you want to see on the page itself. 

Here’s how the Page Analytics extension by GA works and how you can configure the data displayed in the above-shown reporting tab:

1. Set up your Google Analytics account: The only condition that needs to be met for using the Page Analytics extension by GA is for you to have a GA account set up for the website/URL on which you want to use the plug-in. Once you have an account set up, you can download the Page Analytics extension, and your GA account will supply it with all the captured and configured data like segment, geography, and so on.

2. Segment visitors: GA comes with built-in segments on top of which you can create custom segments based on the audience you are targeting. These segments are then automatically fed into the extension’s segment drop-down so you can easily change them on the page while you are browsing through it. 

 

a screenshot for all the different visitor segments within Google Analytics

You can add up to 4 segments, and for each segment, Page Analytics displays an individual reporting tab.

3. Modify configurations: If you look at the extension’s reporting dashboard above, you will see that it displays data on metrics like page views, unique page views, average time on page, bounce rate, and so on. For each of these, there is a drop-down from which you can choose the metric you want to track.

screenshot of the different configurations of metrics and dimensions within Google Analytics

Once you configure these elements, you will be able to see some numbers reflected against each of them. Now, the best part about this particular extension is its versatility and how much room it gives for you to configure the settings on the page itself. You can select if you want to see data on all visitors or real-time visitors, you can modify the date range, add a date range for the data to be compared, customize the clicks threshold, and more.

screenshot of the date range selected within Google Analytics
screenshot of the various percentage options available within Page Analytics Chrome Extension

The configurations being taken care of, the Page Analytics extension generates a Google Analytics heatmap, in real-time, that visualizes click data on the web pages. You can either choose to simply see the data through colors or a small bubble displaying percentages, or both.

screenshot of the configuration options available for heatmaps within Page Analytics Chrome Extension

4. Analyze the plotted heatmap: Using the two visualization types using above, and diving deep into GA data as well, you can discover trends in user behavior on your pages, their click pattern on links, and come up with data-backed solutions to fix experience compromising elements. 

However, even after offering so much, the Page Analytics extension by GA has one major flaw that it only creates clickmaps, and that too for the links on the web pages alone. Hence, if you plan on using website heatmaps as a primary tool for data visualization and analysis, you will have to invest in a full-blown heatmap tool such as VWO

VWO heatmaps is a robust tool you can use to comprehensively visualize visitors’ behavior and interaction with your site. Learn more about VWO heatmaps in the section below. 

Other heatmaps powered by Google Analytics

The second query intent on how to create heatmaps using the data collected through Google Analytics has been answered in detail by Seer Interactive. Their analytics team built a Google sheet. This sheet basically behaves like a dashboard, that lets you heatmap certain metrics and enables you to identify major trends over time. For instance, look at the heatmap they created using GA data to identify when visitors are landing on the website organically so as to pinpoint the best time to push content pieces live and when to promote them:

screenshot of the Google Analytics powered Heatmap spreadsheet created by Seer Interactive

To get you started, you can refer to Seer Interactive’s Google Analytics heatmap sheet and see how they help their clients by leveraging the power of GA. 

Now that both the questions pertaining to Google Analytics heatmap have been addressed, put on your analytics glasses and see for yourself how it can help you collect and visualize data in a way that was not possible before when GA offered only numerical information on how visitors interacted with your website.

Go beyond clickmaps with VWO heatmaps

VWO offers heatmapping capabilities that go far beyond simply analyzing your site visitors’ quantitative data over a clickmap or spreadsheet. VWO heatmaps allow you to picture how your visitors navigate through your webpages, which elements capture their attention, and which ones they tend to ignore in just a simple click, without having to depend on any extension. In addition, VWO’s AI-powered heatmap generator enables you to have a predictive visual representation of visitor behavior on your web page. You can rely on VWO heatmaps to show you exactly where visitors are clicking, how far they are scrolling, how they are engaging with dynamic elements such as modal boxes, and so on. You can also know clicks on non-clickable elements. 

In fact, here’s a comparison of features offered by VWO heatmaps vs Google Analytics heatmaps: 

Comparison between VWO vs Google Analytics heatmaps
Heatmaps

You also get to segment your visitor base using conditional logic and gather granular insights on behavior of various groups. Ultimately, you can use all the insights gleaned to draw hypotheses around how you can steadily improve the performance of your web pages through A/B testing and experimentation.

If this sounds like something that could help scale your CRO roadmap, take VWO heatmaps out for a spin with the free trial

Leverage Vwo Heatmaps

FAQs on Google Analytics heatmaps

What is Google Analytics in-page feature?

The Google Analytics in-page feature shows user clicks on links on a particular page in percentages, i.e, a click map. It is no longer a feature of Google Analytics, however you can still create the clickmap through GA, using the Page Analytics Chrome extension.

Why is heatmap for GA data useful?

The heatmaps created on the data extracted from Google Analytics can help you easily identify and visualize trends within your important GA metrics such as the number of new visitors, pages/session etc. We have shared a template where you can easily setup GA powered heatmaps. Get the template in the post.

Shanaz Khan
Shanaz Khan Marketing at VWO
More from VWO on Website Heatmap
Heatmap Analysis: Top 5 Web Pages to Pay Your Attention To

Heatmap Analysis: Top 5 Web Pages to Pay Your Attention To

Understanding how heatmaps, as a qualitative research tool, can help marketers map the performance of…

Read More
Astha Khandelwal

Astha Khandelwal

6 Min Read
Heatmaps for UX: Quantifying Interaction for Better Website Experiences

Heatmaps for UX: Quantifying Interaction for Better Website Experiences

One of the many questions that User Experience designers want to answer with considerable certainty…

Read More
Shanaz Khan

Shanaz Khan

10 Min Read
Eye Tracking Heatmap: Front Row Seats To Your Visitor’s Worldview

Eye Tracking Heatmap: Front Row Seats To Your Visitor’s Worldview

Before we dive into the fascinating nuances of eye tracking and its many applications, it…

Read More
Shanaz Khan

Shanaz Khan

7 Min Read

Scale your A/B testing and experimentation with VWO.

Start Free Trial Request Demo
Shanaz Khan from VWO

Hi, I am Shanaz from the VWO Research Desk.

Join our community of 10,000+ Marketing, Product & UX Folks today & never miss the latest from the world of experience optimization.

A value for this field is required.

Thank you!

Check your inbox for the confirmation mail

All you Need to Know About Conversion Optimization Get the Guide