Eyes LEFT!

Good website design puts essential information where the eyeballs are.

This is an eyetracking heatmap which shows how much time readers have spent looking at any given spot on the web page. Red represents the most time and blue is the least.

Studies have shown over and over that readers on the Internet read the top few lines then scan down the left margin to find anything of interest. And even when they find it, they’ll concentrate on the text toward the left margin and read less of the text toward the right.

This left-margin pattern works for every separate element of a page, including copy, navigation, opt-in box… everything.

So there’s one simple design trick that will make it easy for your site visitors to cherry-pick the information they want — align left!

Line everything up so it looks like this:

Item one

This is item two

Number three item

Item four

Here’s item five

Usability guru Jakob Nielsen points out that left-justification makes it easy for the eye to scan down and land on the beginning of each line. Now try to read these columns:

What difference did you notice? Did you get bogged down in the first lines and then give up?

With both right and center justification, your eye has to keep moving to pick up the start of each line. That slows down reading considerably, and makes it much harder to find the bit of information you’re searching for. A lot of people just give up.

Nielsen also suggests that you use the most important words at the beginning (left) of the line, and don’t repeat the same words to start list items.

If you’re working with a designer, you may have to do a bit of arm-wrestling to get boring old left-justification throughout your site. Designers tend to pay attention to how things look rather than how they read.

But it’s a battle worth winning. Left-justification works — and isn’t that what good site design is all about?