Blog Improve your user experience by listening to your customers.
click-tracking-hotjar

Click tracking 101: what you need to know to start tracking clicks on your website

Say you’ve built a page, published a form, or sent a newsletter. As soon as they are out there, you naturally want to make sure people interact with them by taking action—the most common one being people clicking (or tapping) on something.

Enter click tracking, which is—literally—about tracking what’s being clicked (and what isn’t), so you can work on delivering more value to your users and get the clicks your business needs to succeed and grow.

In this piece, we give you an overview of the different types of click tracking you can use, examples of how measuring visitor clicks can help you learn more about your customers and increase conversion rates, and how to easily set up click tracking on your website.

Table of contents

What is click tracking?

Click tracking is an analytics feature that measures and reports where people click or tap on websites, apps, and emails.

Using software or tags, a click tracking tool records mouse clicks and taps (on mobile devices); this data is collected and displayed numerically, visually (heat maps), or by individual sessions (session recordings).

click-tracking-example

Click tracking software is used by marketers, analysts, and user researchers to attribute conversions, measure user engagement, and spot website errors and optimization opportunities.

Want to see where YOUR users click?

Get yourself a free forever Hotjar account and create a new heat map today.

Free forever. Get started!
07-scroll-heatmap

The benefits of click tracking and how it’s used

Click tracking has a few main applications for analytics and marketing teams: email tracking, link tracking, and UX click tracking—and they all give you access to more meaningful analytics data.

Email click tracking

Most popular email marketing services have click tracking features that allow you to see how many people open your emails, and which links within them get clicked.


mailchimp-click-tracking
AN EXAMPLE OF CLICK TRACKING IN MAILCHIMP, THE TOOL WE USE TO SEND OUT OUR CONTENT NEWSLETTERS

Email open rate is usually tracked by embedding a single unique pixel into each email—if the pixel is loaded, click tracker software records the email as opened.

Tracking whether people click on a link within the email is also relatively straightforward: the email service provider will usually generate a unique URL string (e.g., superduper.email/link17352882737) and forward it to your desired URL. By using a unique link per email subscriber, they can track who clicked what.

Link tracking is the practice of monitoring and reporting link clicks. There are several ways of tracking links on websites, but UTM tracking code is one of the most popular.

UTM (Urchin Tracking Module) parameters are query strings added to URLs, identifying things like traffic source or campaign name. For example, if you landed on this page after clicking a link from Twitter, the URL you see in your browser bar might look like:

03-link-tracking

Link tracking can help you attribute traffic to different marketing campaigns (like AdWords or Facebook), and track custom campaigns in Google Analytics.

UX click tracking

Click tracking can go well beyond measuring link and email clicks and help you understand how people interact with your site so you can provide a better user experience.

Click tracking tools like Hotjar’s website heat map tool record clicks on any part of a website page: links, images, HTML elements, random white space—anything.

All the clicks and taps on the same page are then combined into a heat map visualization, making it easy to see hotspots (where lots of people clicked) and cold areas (what users ignore).

taskworld-heatmap-hotjar
A HOTJAR CLICK HEAT MAP

Heat maps will render clicks on a web page, but occasionally you may need more context to better understand click patterns—for example, if the page has a lot of dynamic content and interactive elements (e.g., drop-down menus) or personalized content for different users.

When that’s the case, you can pair your heatmaps with session recordings (also known as user replays). Session recordings are renderings of visitor browsing behavior, and while you can’t directly track clicks with session replays, you can view mouse clicks and mobile taps when watching a recording—including on dynamic elements.

hotjar-recording

The qualitative insight gained from recording visitor behavior can provide the context behind user click data you’ve already collected, and help you figure out why visitors click in certain ways.

Heat maps + recordings = 🔥

Sign up for a free forever Hotjar account and start seeing how people interact with your website.

Free forever. Get started!
07-scroll-heatmap

How to better understand users with website click tracking

click-tracking understand users

Click tracking is an opportunity to better empathize with users and get the data you need to build a better experience for them, which ultimately helps your business grow.

Here are a few ways to use click tracking insights on your website or app to make improvements.

1. Track what works, and what doesn’t

Click maps show you if visitors are clicking and tapping site links, buttons, and CTAs (calls-to-action). If key elements are getting ignored, you can make changes; if sections get good engagement, you have the insight needed to double-down on what’s working.

For example, in one of our own click heat map tests, we noticed that the ‘Table of Contents’ section at the start of a long blog post was getting clicked:

click-heat-map-tracking-example
WEBSITE CLICK TRACKING ON A ‘TABLE OF CONTENTS’ ELEMENT

The click data tells us that visitors are using the table of contents to navigate to relevant sections. Without the data, we would not know if this feature was taking up valuable space on the page or adding real value to users.

Standard link tracking can’t tell you which part of a link gets clicked, but heat maps might show you which words motivate users to click. In our example, you can see that people clicked on terms like ‘heat map’, ‘feedback’, and ‘setup’.

2. Spot errors and bugs

clicktracking errors bugs

Here’s something standard link tracking can’t tell you: when clicks don’t work. Users might click on an image they assume to be a link and get stuck there, or perhaps a link or button is broken and not linking correctly and users are unable to continue browsing.

Click heat maps track all the failed clicks that stop users from progressing down the funnel and converting into customers. By collecting all those areas of confusion, frustration, and ‘rage-clicking’ from users en masse (remember: click maps aggregate data for a whole page between multiple users), you’ve got a ready-made optimization roadmap for improvement. 

User clicks are precious: don’t let them go to waste on unimportant elements.

3. Increase conversions (and revenue)

If you’re making page tweaks or performing A/B testing as part of your conversion optimization efforts, click map data can both provide ideas for new tests and help measure the success of design changes.

Here’s what we mean. Trampoline Plezier, a Dutch trampoline ecommerce company, used a scrollmap to identify that only 46.2% of visitors scrolled to the end of a landing page. The problem: the page’s main CTA button was at the bottom of the page, so most visitors were missing it.

Screenshot-2015-08-28-11.49.35
A CLICK MAP OF THE LANDING PAGE BEFORE CHANGES WERE MADE

Simply moving the button up the page meant that more users saw it and had the opportunity to click. A subsequent click map showed a huge increase in CTA clicks, which resulted in an 11% increase in click-through rate (CTR).

screenshot-2015-08-28-11.49.42
LANDING PAGE CLICKS AFTER CTA BUTTON MOVED UP PAGE

Click tracking data—especially when it’s visually displayed like the images above—goes a long way to showcasing your CRO success and getting buy-in for future tests.

***

How to set up website click tracking with Hotjar in 5 minutes

Setting up a click tracking map in Hotjar is super-easy.

If you’re not using Hotjar yet, start here

Two quick steps to get started:

1. Click “New Heatmap”

create-heatmap-hotjar

2. Give your heatmap a name

name-hotjar-heatmap

3. Choose the number of pageviews to record

hotjar-heatmap-pageview

4. Pick the target page(s)

hotjar-heatmap-targeting

5. Select “Create Heatmap”

hotjar-heatmap-live

When you set up a heat map in Hotjar, the tool automatically generates three types of heat maps for you—click map, move map, and scroll map. You can toggle each to show desktop, tablet, or mobile sessions, as well as track clicks on different devices. You can also view and download all the raw data.

***

Want to see where YOUR users click?

Get yourself a free forever Hotjar account and create a new heat map today.

Free forever. Get started!
07-scroll-heatmap
1fio2
Fio Dossetto

Fio manages editorial production at Hotjar, generally over-uses em dashes, and makes sure we publish specific, actionable pieces—with a sprinkle of our signature style on top.