Avoiding ambiguous time lines

Published on 11^th June 2009 in Usability, Websites, tagged navigation, time.

Time flows from left to right, at least in the Western world. It progresses in graphs from the axis on the left to the empty space on the right. You click on the right facing button to go to the next month in a calendar and on the left one to go to the previous month. Sometimes it flows from top to bottom, as on Twitter, but on the horizontal plane it’s always left to right.

The same metaphor applies to a wide range of chronologically ordered information, including websites. However, some ignore this standard and this can be confusing for users. Take a look at this example, from The Unofficial Apple Weblog:

If we’re currently on the second page of posts, which button would you click to see newer or older posts?

If you assume that this navigation uses the standard metaphor of time and click the left button to view older posts, you’ll be a bit surprised, because it does exactly the opposite. TUAW’s page navigation not only has the direction mixed up, but the words ‘next’ and ‘previous’ are also ambiguous.

If you’ve gone from the first page to the second page, going to where you’ve previously been would mean returning to the first page. However, if you arrived at the second page from elsewhere, you might interpret this as viewing previously written posts.

This problem is extremely easy to solve if you stick to two basic rules:

• Left arrows go back in time, right arrows go forward in time.
• Use ‘older’ and ‘newer’ instead of ‘next’ and ‘previous’.

The following example from the Impact website I designed removes any ambiguity:

By sticking to the conventional depiction of time and using unambiguous words, you’ll end up with a much clearer navigation that won’t confuse people who visit your website.