loving the dot com

These days there are a billion and one scripts and companies which can tell you all sorts of statistics about your website traffic, but there’s a new kind of statistic in town - the heat map

Instead of the conventional way of collecting statistics by parsing through log files or logging page hits in real time, heat mapping scripts actually respond to where users click on your pages. By using this data it’s possible to draw some really pretty pictures which can clearly illustrate how users physically move about the site - which elements are more popular than others? How far are people willing to scroll down? Is this Ad actually working? A heat map is the answer.

Commercial Heatmaps

The main names on the commercial side seem to be clickdensity, crazyegg and ClickTale - although ClickTale are still in beta testing and have yet to officially launch their service.

Here’s an example of the offering from clickdensity:

Once you sign up for the service, all you have to do to get their service working is paste a little bit of javascript directly before your closing </body> tag in your page and they immediately start tracking your visitors. As you can see from the picture you also get a lot of filter options on how to narrow down the results shown to you - whether it is in a heat map, or more traditional form. One of the particularly neat features splits the page up into it’s individual elements and gives you individual statistics as you hover over each one.

After trialing clickdensity’s service on a couple of websites at work it was immediately clear that there are a huge number of clicks which just appear to go absolutely nowhere - whether this is because of users clicking on their browser window to bring it into focus, or just randomly clicking it isn’t clear. It is very clear where the large majority of clicks are going though, and I think their map is very nicely rendered.

If you’re looking to test out heat mapping for your website, I would very much recommend you take a serious look at clickdensity as they have more detailed statistics than other providers I have seen. One thing to be wary of though, statistics are (currently) restricted to the exact domain names associated with the accounts - so subdomains count as seperate domains. This means if you have a large site which sprawls over a large number of subdomains, you’ll have to add a tracking account for each one.

Non-Commercial Heatmaps

Wherever there’s a good commercial project, there’s often a non-commercial open-source one too. This one isn’t as good as it’s paid-for counterparts, but then it is being built in people’s spare time and they have no financial motivation to make it as pretty.

The non-commercial offering comes in the form of LabsMedia’s ClickHeat. This system is written in JavaScript (of course) with a PHP/GD backend. Here’s what theirs looks like:

As you can see the interface can’t really compete with that of clickdensity, but most the functionality is there. I have briefly tested this system too and while it does work, I would be more inclined to use a paid-for service at the moment simply because the reporting side isn’t entirely up to scratch.

That said - having had a flick through the code which makes it work, it becomes clear that the system isn’t half as complicated as you might think. All the JavaScript has to do is tell the server where on the page the user has clicked, the majority of the code is dedicated to drawing the heatmap image. This is also fairly trivial in the grand scheme of things.

It’s often said that simple ideas are the best, and I’m surprised that more people haven’t implemented a similar sort of system to this. As it is so simple it does make you wonder how long clickdensity, clickegg and ClickTale can stay ahead of the game.