Make your navigation fast with Fitts' Law

These days, the interface for anything more complicated than a microwave oven includes a pointing device, like a mouse or joystick.  One of the oldest and most famous usability dictums, Fitts' Law, can help you ensure your interface is easy and fast to use. Given how long the law has been around (it was first proved in studies in the '50s), it's amazing more desktop applications and websites don't take it into account.

Fitts' Law has been neatly summarized as "The time to acquire a target is a function of the distance to and size of the target." In other words, when you want to click a button, it's fastest when the button is both large and close to your mouse pointer.

On a computer screen, the pointer stops when you hit an edge. In terms of Fitts' Law, this makes the edges and corners infinitely large -- all you have to do is yank the mouse in one direction, with no careful aiming required. Good interfaces, such as the Mac OSX example shown, take advantage of this by putting important functionality along the edges and corners. Fitts' Law was a guiding principle for the the large Ribbon navigation buttons in Microsoft office 2007.

Some implications of Fitts' Law for design of your products and websites are:

• It's okay to pair a search field with a small search button. Navigation functions can be small if they're close to where the mouse pointer will be. Since mouse users will click into the field and then click the button, they'll begin very close to the button.
• Your website is more usable if your large logo graphic is linked to your homepage, and you don't rely on just a small Home link at the top. If the function is likely to be far away from the mouse pointer, it needs to be fairly large.
• In certain software applications (games that take over the whole display, for example), you can take advantage of the "virtual targets" afforded by the edges and corners of the display. Do so by putting the most commonly used or most important functions there.
• Some high-end software relies on large displays to pack in the data -- but don't shrink your functionality to the same scale. If you know that your application will be used at a high screen resolution, make your navigation options bigger to compensate.