7 Incredibly Useful Tools for Evaluating a Web Design

Mirrored By DuggMirror (?) at 00:51:49 EDT Apr 22, 2008

Original URL: http://sixrevisions.com/tools/useful_web_analytics_tools
Comment on this story at http://digg.com/design/7_Incredibly_Useful_Tools_for_Evaluating_a_Web_Design

View Stats on This Story's Diggs From DuggTrends

Other Mirrors: Google cache   Coral Cache 8080 8090   Archive.org Wayback Machine

7 Incredibly Useful Tools for Evaluating a Web Design

April 20th, 2008 by Jacob Gube | 17 Comments | Stumble It! del.icio.us

leadin - analyticsAn effective web design is one in which your users are able to find information quickly and in a logical fashion.

Do they visit the content you want them to visit? Are they looking in the right places of your web page? Are you able to keep your user’s attention, or do they just leave quickly?

It’s not just about the content either. If your design loads slowly - or if moving from one section to another takes a long time - it affects the user’s experience.

These things can be the make-or-break factors between a user clicking on a link to find more information, or the back button to find it elsewhere.

Some things to consider:

  • Are important information being seen by the user?
  • Are the navigation and action items intuitive?
  • Is the user being directed to sections in a logical manner?
  • Does the web page load quickly enough to not turn away the user?

If you’re interested in analyzing and optimizing your page layout - here’s some extremely useful tools that you can use to help.

1. ClickHeat

ClickHeat is an open source visual tool for showing "hot" and "cold" zones of a web page. It allows you to see which spots users click on most, and which spots are being ignored.

ClickHeat - Demonstration screenshot

It’s very easy to implement on your website, you only have to include an external JavaScript file.

Download: Clickheat on SourceForge.net.

2. Crazy Egg

Crazy Egg offers a myriad of analytical tools to help you visualize what visitors are doing.

Crazy Egg - Screenshot of confetti overlay

Features include: Confetti - allowing you to see what people are clicking on based on certain factors such as their operating system and where they came from, Overlay - providing you with tons of data about particular links, and Report sharing - enabling you to share the data with team members and clients.

The free version only allows 4 pages to be tracked - so use your top landing pages to get the most data.

3. YSlow for Firebug

A key tenet of a strong design is that, not only should information be presented in a logical and elegant fashion, but that it must also be served quickly, with very little delay.

YSlow for Firebug - Performance Grade and breakdown of Yahoo! homepage

YSlow for Firebug is a free tool for Mozilla Firefox that gives you information about your front-end design to see if it performs well. It gives you a letter grade (A through F) and outlines your web page’s trouble spots.

It’s based on the Yahoo! Developer Network’s "Best Practices for Speeding Up Your Web Site" initially written by Steve Souders, who was once the Chief of Performance at Yahoo! and is now working over at Google on web performance and open source initiatives.

Downloads: Firebug extension for Firefox (required) and YSlow.

4. clickdensity

clickdensity is a full suite of usability analysis tools that will help you assess your web page design.

clickdensity - screenshot of hover map

You can use heat maps showing where users click on the most, hover maps - which shows people scrolling over links but not clicking on them, and A/B Tests which allows you to change certain page elements to see which style is more effective.

The free subscription give you 5,000 clicks and only one page and one site to monitor.

5. ClickTale

ClickTale offers a lot of user data pertaining to how visitors use your website.

ClickTale - Heat map

There are plenty of things you can look at such as average time it takes for a user to click on a link, a user’s hesitation on clicking a link, hover to click ratio, and much more. It also provides detailed reports and charts on your users’ monitor sizes to better optimize your web page design to cater for the typical visitor.

6. Clicky

Perhaps the most interesting feature that Clicky has is its real-time tracking and monitoring feature, called Spy (check out the demo here).

Clicky - Spy Data

Besides Spy, there’s a host of other analytics data you can look at such as user Actions - which records click data from your users and Visitors - providing you user data.

7. Google Analytics

One of the best free services that Google offers is Google Analytics and probably the most well-known analytics tool. It’s incredibly easy to install and offers plenty of user and content data to help you learn more about your web pages’ performance.

Google Analytics - Site Overlay feature

It has a feature called Site Overlay, which gives you a visual representation of the popular places your users like to click on. It also offers data on bounce rates and your top exit pages (to see what pages make users leave).

So there they are, some of the best tools in the market to help you troubleshoot and optimize your page layout. In the end, it’s a combination of great content, as well as how you present this content — that will lead to an effective design.

17 Comments

Gravatar picture
Almakos

April 21st, 2008

Amazing. I didn’t know such tools exist. especially for free.
Thanks!

Gravatar picture
Ed

April 21st, 2008

Nice article, I princpally use Analytics, Clicky and Statcounter. I’ve also used reinvigorate (http://www.reinvigorate.net/) in the past who also have a nice real time desktop application you can install and it can trigger a “chi-ching” sound on your desktop when you make a sale - nice :)

I’m gonna check out clickheat though - looks nice

Gravatar picture
Nate

April 21st, 2008

Good list. I personally run heat click on my sever with php my visits. It’s good to see where people are trying to click on my site for navigation.

Gravatar picture
AndyEd

April 21st, 2008

You might also appreciate Stomper Scrutinizer — it’s a vision simulation embedded in a browser to help raise consciousness on the impact of design and even to conduct usability evaluations.

http://about.stompernet.com/scrutinizer/learnmore

Gravatar picture
Carlo of 77Lab

April 21st, 2008

Great Post Jacob!
ClickHeat is amazing!

Gravatar picture
Tony Chester

April 21st, 2008

Nice list here. We used to use Crazy Egg quite a bit but it started acting all wonky for about a week so we pulled it. This was about two or three months ago and it mainly was taking forever to load; therefore the page would never finish loading. Maybe we will revisit them again.

Gravatar picture
Copes Flavio

April 21st, 2008

Very nice list list, I especially like Crazy Egg :)

Gravatar picture
Pagealizer

April 21st, 2008

For landing page metrics try http://www.pagealizer.com/
Pagealizer helps site owners get insight on how powerful their site content is. We show you in great detail how long people stay on your page (effective bounce rate), how far they scrolled down the page and where they clicked.

Gravatar picture
Jacob Gube

April 21st, 2008

@Pagealizer - that’s a spiffy app.

For those interested, check out the demo page here: http://www.pagealizer.com/?page=report&type=demo

The free version looks very generous too… you get all the analytical data, the only limitations are: 200 clicks are tracked and no SSL support.

Thank you for sharing!

Gravatar picture
Josh Mock

April 21st, 2008

I’ve tried almost all of those tools at one time or another and would say that Google Analytics, CrazyEgg and YSlow have been the three that stand out even among these.

Gravatar picture
elamb

April 21st, 2008

Swizzle fa Shizzle, my nizzle.

Leave a Comment