Have you ever wondered how readers really interact with your blog? What parts of your blog do they explore, what are they clicking on, and what captures their attention?
Many bloggers rely strictly on Google Analytics to glean this data from their users. Time on page, bounce rate, and exit pages will all give you some insight as to how your readers are interacting with your site.
But what about things like – do they like the photo? Are they paying attention to the graph or just scrolling by? How many readers actually make it to the bottom of the post?
This is where heatmaps come in handy.
What is a Heatmap?
Heatmap software is also used for websites to understand user behavior. Examples of behaviors you can monitor with heatmaps include:
- Mouse Movement: Track which page elements receive the most mouse movements.
- Scrolling: See how far users scroll down specific webpages.
- Click Maps: See the images, links, and parts of a webpage that receive the most or fewest clicks.
They use colored zones to indicate different levels of activity.
For example, red zones reflect areas of intense engagement, whereas cooler, green, and blue zones indicate less activity.
In the image below, the left is an example of scroll tracking. This shows you how far down the page readers are getting. You don't want to put your big call to action after everyone has stopped scrolling.
On the right is an example of click tracking. It shows you where people are clicking. Red areas indicate more clicks following the rainbow down to blue indicating less clicks. (This is my favorite)
However, heatmaps are incredibly powerful for bloggers and ecommerce operations that want to optimize their websites. After all, it’s essentially the most granular level of data you can gain about user behavior on your website.
With this data, you can optimize product placement, images, website layout, and your overall content strategy to increase reader engagement and time-on-page. Not too shabby!
When Should you Add a Heatmap Tool to Your Site?
If you’re a hobby blogger, using a heatmap plugin is likely overkill. Google Analytics will be plenty to see what's going on with your site.
Heatmaps are the next level. Add a heatmap when you really want to drill down and optimize a page. If you have a blog post that is making affiliate sales it would be good to get a clear understanding of how users are engaging with the page.
Perhaps you can move some elements around to improve conversions.
You would also consider adding heatmapping to your resources page, or a sales page. This will show where readers slow their scroll and what they buzz by.
Basically, use heatmaps to make more money. But until you are earning money they are probably going to be more time consuming than they are worth.
Best Free Heatmap Tools for Understanding Your Blog
Since heatmap software is complicated, it often comes with a price tag. If you’re trying to blog on a budget or just want to test out this strategy, the following free heatmaps are your best friend.
HotJar
When it comes to free heatmaps for blogging, HotJar is really the gold standard. This leading heatmap software lets you track clicks, user scrolling, mouse movements, and splits all of this data by device type.
Furthermore, you can set up A/B tests to monitor user engagement on your existing website versus a new design concept to discover what’s optimal. You can also take live recordings that show you exactly what users are doing on your website if you want a real-time view.
HotJar also has a free heatmap plan that’s perfect for smaller bloggers. This plan includes:
- Monitoring capacity of 2,000 pageviews per day
- Up to 3 free heatmaps
- Up to 100 recordings per day
- Send up to 3 feedback surveys to ask users about aspects of your website
- Store heatmap data for 365 days
Paid plans begin at $39 per month and unlock unlimited heatmaps to cover your entire site and more data storage. Business plans have a 15-day free trial, but personal plans for smaller sites don’t have this option.
However, if you want to begin with free heatmap software, HotJar’s 2,000 daily visitor limit also provides enough user data to be meaningful.
I use HotJar's free plan here on Hit Publish. I probably don't use it to its fullest potential but I've been happy with it so far.
MouseStats
MouseStats is another free heatmap that lets you track mouse movements, scrolling, and clicks. Additionally, MouseStats also has an attention heatmap feature that helps you find the optimal place to place a CTA or affiliate offer.
You can also use its element analytics tool to compare different areas of a webpage against one another for engagement. This tool is as simple as drawing squares on a webpage that you want to monitor.
Like HotJar, MouseStats lets you record live user sessions and send out surveys for feedback. Another nifty tool is form analytics, which lets you track how users interact with things like your email list sign-up form to find where engagement drops off.
For the free heatmap plan, monthly limits include:
- 2 heatmap pages
- 100 heatmap recordings
- 100 form analytics recordings
- 100 live playback recordings
- A single form page analytics
- Mobile and desktop reporting
This is admittedly less user data than HotJar’s free plan. But, the first paid plan is only $29 per month and unlocks 15,000 recordings per feature, which is perfect for medium-sized blogs.
Unfortunately, there isn’t a free trial for any paid plan. But of course, you get started on the free forever plan. If you like what you see and want more, you can upgrade at that time.
Smartlook
If you’re looking for another free heatmap that’s on-par with HotJar, Smartlook is certainly worth considering.
Smartlook has everything you’d want in your heatmap software; click, scroll, and mouse movement heatmaps provide a comprehensive level of user behavior data.
However, one difference between Smartlook and many other heatmaps is that Smartlook has “always-on recording.” This means you can always go back and view live recordings of how users interact with your site, whereas most heatmap software requires you to enable a recording session first.
Furthermore, Smartlook lets you create heatmaps from retroactive Google Analytics data, so you don’t have to wait days or weeks to gain insights from your first heatmap. Smartlook also segments reporting by device and supports websites and mobile apps.
Finally, you can set up event tracking and funnel tracking. Events include actions like adding a product to your cart or any clickable element on a website. Funnels are created from events, and you can track where your readers drop-off from converting into customers or subscribers.
For its free heatmap, Smartlook includes:
- Up to 1,500 sessions per month
- 3 heatmaps
- 2 events
- 1 funnel
- 1 month of data history
Retroactive heatmap creation and always-on recording aren’t available for free. Additionally, Smartlook doesn’t have a survey feature, which is a notable downside if you want to collect feedback from readers.
However, Smartlook’s cheapest paid plan is $31 per month and unlocks up to 7,500 monthly sessions, 10 heatmaps, retroactive data, always-on recording, and greater event and funnel tracking capacity.
Heatmap.com
Heatmap.com is a simplistic, free heatmap that’s ideal if you’re new to heatmaps and don’t want to be restricted by monthly session limits.
With Heatmap.com, you get a click heatmap that also tracks how users engage with dynamic elements, like menus or widgets. It also lets you track how users interact with website changes like responsive design or ads and view all of the data in real-time.
Unfortunately, Heatmap.com doesn’t really go beyond this. You can’t set up event tracking, dig into funnel conversion rates, see how far users are scrolling, or track mouse movements. Heatmap.com argues simplicity is its strength, but what really stands out for this free heatmap is the user limits.
With the free plan, you get:
- Tracking for up to 1 million monthly pageviews
- Analyze up to 5 pages
- 6 months of data storage
- Desktop and mobile reporting
The cheapest paid plan allows for up to 10 million monthly pageviews and charges $5 per page you add beyond the free limit of 5. However, the free plan has more than enough user capacity for most blogs, and 5 pages is more generous than most free heatmaps.
Ultimately, if you just want to track where readers click on your website and don’t want to dive into all the data out there, Heatmap.com is for you.
Free vs. Paid Heatmaps – Deciding What’s Best For You
Using a free heatmap for your blog is the perfect way to dip your toes into the world of advanced user data analytics. However, all free heatmaps have limitations.
Notably, monthly session limits and restrictions on how many pages you can create heatmaps for are major downsides to staying free.
My advice is to start with a free heatmap like HotJar or Smartlook that have over 1,000 monthly sessions and allow for three heatmaps. Choose your highest-traffic or highest-value pages for your heatmaps and see what insights you gain after a month or two.
When you’re ready to make the jump, you can upgrade your plan to unlock more capacity.
If you want to skip the testing phase and get right into the data, I suggest checking out Crazy Egg. Widely considered to be one of the best heatmap tools, Crazy Egg has a range of features like:
- Click, scroll, and mouse heatmaps
- Live user recordings
- Heatmap A/B testing
- User-friendly snapshot reports that breakdown heatmap data into easily understandable insights
Crazy Egg starts at $29 per month but bills annually. The starter plan covers up to 30,000 pageviews, 100 recordings, and 25 snapshot reports per month. However, there’s a 30-day free trial, making Crazy Egg one of the best premium heatmaps you can try before you buy.
I’d probably hold off on using a paid heatmap if you aren’t making money from your blog. But, if you begin selling courses or want to optimize your affiliate marketing game, investing in a paid heatmap to learn how to optimize your website and content can be worth it.
Adding Heatmap Software to Your Site
Most, if not all, of the heatmap software out there will require you to put a piece of code into the header of your site.
This is very easy to do, especially if you have the insert headers and footers plugin. This is what I recommend whenever you are asked to add code to your header. If you have Google Analytics you've likely already done this.
Some of the heatmap companies have their own plugins that allow you to skip the header code. I would avoid this simply because “mo' plugins mo' problems“. Keep things simple and use the insert headers and footers plug info for everything that requires header code.
Summary
Heatmapping can bring you insights that you simply can't get otherwise. My only caution with using a blog heatmap is to start out slowly and to actually make decisions once you start monitoring how your readers engage with your website.
A flood of data and reports can be overwhelming at first, so pick one element of your blog to study and then optimize. This could be your homepage, sales page, or a high-traffic article.
Once you use a free heatmap and learn the ropes, you can upgrade your plan to unlock even more insights.
