404 Tech Support

ClickHeat – Get a HeatMap of Clicks on your Site

If you’re looking for an easy way to figure out how your visitors are interacting with your website, you might be interested in ClickHeat. ClickHeat adds a small bit of Javascript to a web page and then will record where clicks occurred, even if they weren’t links. This would be important if you’ve recently redesigned your website and visitors are not finding it as intuitive as you’d like. Say there’s a deceptive image that everybody thinks should be a link, you would see a lot of clicks on that image even though clicking it does nothing. ClickHeat provides an easy, non-invasive way to do some basic usability testing for your site.

To setup ClickHeat on your site, you simply download the less than 1MB zip and extract the clickheat directory. Upload that directory to you server and then visit yoursite.com/clickheat/index.php.

After a few preliminary checks to make sure your server setup is compatible with ClickHeat, you’ll get to the configuration aspect of ClickHeat. This allows you to define some of the functionality and look of the ClickHeat results page. You can always come back and tweak these settings as you see them in action. Conveniently, you can create a visitor login so that others can see your clickmaps without the ability to change configuration settings.

After the general configuration of ClickHeat, you’ll need to configure a profile for each page you’ll want to track. You can set an identifying name for the page with the group tag and set the quote for how many clicks will be tracked per visitor. Once a profile is created for a page, click the Javascript link to get the code. Once you have the Javascript, you just stick it anywhere on the page between the HTML body tags. If you’d like, you can also set a cookie so that your own clicks are not counted in the statistics.

Once you have the code embedded (and any cache cleared, if necessary), you can test that the code is working by visiting the page with ?debugclickheat after the URL. This should give you a little popup frame to confirm some of the configuration settings for ClickHeat, as seen below.

Once you have ClickHeat in place, you’ll just have to give it a little while for visitors to come and the stats to start rolling in, then you’ll get results like:

The results grab a live view of the page you want to check and then draw a layer on top of it with some opacity to show where clicks land. You can change the opacity level to your preference, filter by brower and screen resolution, and look at results of the day, week, or month. Where one click occured, a blue dot will appear. If more clicks in a spot were performed, the dots may become bigger and will head toward a shade of red. A lot of the recorded clicks on my site appeared to be quite random, but upon filtering by resolution they seemed to make a bit more sense and landed on links and images.

If you’d like to see ClickHeat on your site, you can find the project files at the ClickHeat website and also on SourceForge.

You might also be interested in checking out this HeatMap/ClickMap tool from Corunet.