Easy as 1,2,3?
Posted January 12th, 2009 by David Hamill
Using 1,2,3 links is often a result of lazy web design. In many cases, it’s the web equivalent of asking your users to rake through bargain bins. They don’t know what’s in each bin, they have to rummage through them in order to find out.
Often however, 1,2,3 links are the most appropriate option. I recommend applying a little thought before using them in your designs.
What are 1,2,3 links?
When I say 1,2,3 links I mean the links that allow you to navigate through a long list of pages (also called pagination links). This approach was made popular by search engines like Google (I’ll come back to that in a bit). You start on page 1 and in order to find what you’re looking you have to click 2, then 3, then 4 and so on.
What’s wrong with 1,2,3 links?
These links hide content. There’s no way of knowing what’s behind each of the links until you click them, so you have to either click through every link or start guessing. This can cause problems for users, especially when there are a lot of pages to look through.
I’ve chosen Hotmail as an example because I’ve struggled with this feature on a few occasions. The image below illustrates the problem.
Listing by date
These links appear at the bottom-right of the web interface for Hotmail. It allows me to scroll through past mails. However the mails are sorted by date. Let’s pretend I’m trying to find an email that was sent to me in April? Which number do I click?
If the results are listed by date then the links should be provided by date rather than as 1,2,3 links as they are here.
Listing alphabetically
So let’s say I decide to sort my emails by the name of the person who sent the email instead. If my friend Stuart sent me the email I’m looking for, then I need to get to S. I’m still forced to use the 1,2,3 links. After some painstaking guesswork I might end up at the emails from senders beginning with S on page 48. This issue renders the ‘Sort by sender’ function practically useless, unless you’re looking for that email from Aardvark Electrical Supplies.
It’s not just Microsoft
It’s not just Microsoft that falls into the 1,2,3 trap. Plenty of big websites do it, basically because it’s technically easier to achieve. The image below shows the Radio 4 page on BBC iPlayer. The 7 long pages of programmes are listed alphabetically, but the links that take you through the pages are 1,2,3 links. So which page is Secret Lives on?
So which page is Secret Lives on?
When to use 1,2,3 links
You can use 1,2,3 links when there isn’t a lot to look through or when your users actually want to look at the content of each page, one after the other.
With search results
1,2,3 links work well on search results. If the search is any good then the results will be in order of relevance. The 1,2,3 link just help the user go through each page. There should be no need for them to jump straight to page 9. If they are on page 9 it is because the user has tried pages 1 to 8 already.
When there are only a few pages
If you have 3 short pages, then it might be easier to use 1,2,3 links than categorising the pages in some way. If the pages are long then try to categorise them instead.
Alternatives to 1,2,3 links
There are plenty of alternatives to using 1,2,3 links. The method you choose depends on the context.
Chronological and alphabetical order
If you are listing alphabetically then you can substitute 1,2,3 for A-D, E-H or Aa-Am, An-Az if you have a huge list. It’s often trickier to achieve but not impossible. Likewise date order links can be provided as date ranges or using a calendar.
Categorisation
In some cases you don’t have to provide linear pages at all. If I’m looking for a new pair of shoes and I know I want brown leather shoes with laces I should be able to choose these options within product categorisation options. I then don’t need to wade through the pages of shoes I know I don’t want.
One big page
There are occasions when it’s better to show everything on one big page. If the website I’m using to buy shoes has lots of shoes I might end up with a lot of options even after filtering for brown leather shoes with laces. In this case it’s better to just give me one big page of shoes, than ask me to click through half a dozen pages. I can then click on the ones that catch my eye rather than have them hidden behind 1,2,3 links.
Think about the context of use
Whenever you’re considering 1,2,3 links, think about the context in which they will be used. There’s a good chance that it’s not the ideal approach.
What do you think?
If you have an opinion on this, I’d love to hear it.
Tags: iPlayer, navigation, search, trigger words
24 Responses to “Easy as 1,2,3?”
January 12th, 2009 at 10:57 am
Nice post, I think many people often forget there is an alternatives 1, 2 ,3 links. I like to use alphabetical links where possible.
January 12th, 2009 at 4:49 pm
A potential bonus of 1,2,3-links is that they eliminate “the fold.” I say POTENTIAL, because they don’t alleviate the motor load associated with moving to and clicking on them (just as a user would have to interact with a scroll bar). However, they provide an incentive (above the fold) to go on: “Hey, there’s more stuff over here!”
Of course there’s the business reason — more ad views when you show more pages. But we won’t go there.
January 12th, 2009 at 10:08 pm
..your alternatives are not much better–they still require the same number of clicks to get to the content.
I dont think you have made a compelling argument here.
January 12th, 2009 at 10:32 pm
Hi Nemrut,
Thanks for commenting. I’m sorry if I haven’t made myself clear here. I’ll have a look at the article and see if I can improve that any. I haven’t explained it in this post, but counting clicks is not a good way to measure usability. I’ll write a post about that soon.
But since you bring it up I’ll address your point. With an A-Z list of links I can click once to get to the listings beginning with S. In the iPlayer example I’ve used, this would save me about 5 clicks. In the Hotmail example it would save me over 25.
thanks again
David
January 13th, 2009 at 3:09 am
…you have some good ideas, i just dont think they replace pagination for displaying large data sets. what you’re really looking for are sorting functions(eg alpha, date, etc) on existing results.
in terms of measuring #clicks, i’ve found it is a good metric in determining how to streamline repetitive tasks associated with search, shopping, customer svc apps, etc. Of course it is only one data point but a valid one in terms of reducing screens and decision points.
January 13th, 2009 at 1:33 pm
Excellent post as usual Dave. One additional problem with 1,2,3 links is that the target (i.e. the number) is often very small. This makes it hard to acquire the target (Fitts Law) and it’s easy to click on (for example) “2″ when you meant to click on “1″. So building on your other solutions (like alphabetical order), I’d suggest links that read, “A-F”. “G-L”, “M-R” etc since, as well as being cognitively better, they are bigger targets.
January 13th, 2009 at 6:44 pm
The 1,2,3 are kind of a pain. Guess it’s a good idea to always have the Next and Previous links as well.
January 13th, 2009 at 10:01 pm
Hi Doc, thanks for the comment. If anyone is interested in Fitts Law then Dr Travis has a nifty usability A-Z where you can read about it:
January 13th, 2009 at 10:07 pm
Nemrut, the point I’m trying to make is not to use pagination links when there is a more appropriate option. I’m not saying they should never be used. Just that they are over-used without consideration.
I think the examples I’ve provided show this to be the case.
January 18th, 2009 at 9:15 pm
Hello!
Good article imo, who hasnt been there trying to find ‘S’…
A related issue is where the pagination or prev/next are located. I find it a pain with sites that have prev/next and 123 at the bottom only.
Often you can quickly see at the top if you found the right page and then you have to scroll down to find the “next” button.
And if they are in the top they are more likely to remain in the same position, so you can just click next, next, next without moving the mouse..
cheers
January 19th, 2009 at 11:32 pm
Nice post. Its the little things like this that can make a big difference to the user’s experience.
I’d be interested to hear your thoughts on pagination for multi-filter searches or faceted searches. Would you update the paging mechanism to reflect the search/sort criteria?
Thanks for taking the time.
January 20th, 2009 at 9:03 pm
Hi Marcus, that’s a good question. If you allow people to filter their results so there are only a few pages then numbering should be fine.
However if there are a lot of pages I’d consider allowing further filtering/browsing or categorise the pagination. It’s then easier to skip past numerous links without worrying about missing what you’re looking for.
January 24th, 2009 at 8:00 pm
[...] Usability has a nice comment on the use of numerical links (or ‘1,2,3 links’). By numerical links I mean the kind of numbered links you see at the bottom of, say, google. [...]
January 29th, 2009 at 3:05 pm
[...] Easy as 1,2,3? [...]
January 29th, 2009 at 11:05 pm
You are absolutely right. Information should be paginated appropriately according to the type of content and the way users would most likely look for specific items.
Personally, I loathe pagination in nearly every instance because you have to wait for each new page to load and you can’t easily compare things that aren’t on the same page.
Your entry about using appropriate link labels still stands true though, even without loading separate pages.
February 19th, 2009 at 10:22 pm
Excellent article! I’ve also been very surprised by the way Hotmail deals with it… Should expect more from such a company…
I think when it’s used numerical, you’d almost better NOT do it… As you mentioned, finding some particular date or something… which number to choose? Always need a couple of attempts… Why not place everything in one large list?
Take a look at Outlook for instance. Why isn’t it used there?? Everyone on this planet is scrolling through a long list of mails. Me too and I don’t mind. So why should it be different on the web?
Alphabetical is another thing, because you KNOW where to click.
February 20th, 2009 at 6:38 am
[...] Good Usability » Easy as 1,2,3? Using 1,2,3 links is often a result of lazy web design. In many cases, it’s the web equivalent of asking your users to rake through bargain bins. They don’t know what’s in each bin, they have to rummage through them in order to find out. 20. Helmikuu 2009 ( 1 minuuttia sitten ) – Linkit [...]
February 20th, 2009 at 9:56 am
An interesting approach, but in a situation where you advocate showing everything on one page instead of paginating, the load on the server will increase dramatically, both in terms of bandwidth and processing. A 5-page, 10-item-per-page display then becomes 50 items on one page.
I like the idea of alphabetical presentation, but it’s not as intuitive from a database design point of view. You would potentially need to change the indexes on the database table to make this efficient, and then cater for things like products starting with the word ‘the’ to avoid them all getting clumped in the ‘T’ section.
February 20th, 2009 at 10:10 am
Hi Chris. Good point but your database design shouldn’t dictate the user experience. It should be the other way round. I get your point about page load times but one 3 second page can provide a better user experience than 3 split second page loads. After all, your user needs to digest each of those pages only to discover that they need to try the next page.
February 23rd, 2009 at 4:34 am
[...] Source: Easy as 1, 2, 3? (Good Usability) [...]
March 4th, 2009 at 8:52 am
I try to decide whether or not to use pagination by the content of the search result…
If the posts are “nominal” (in the meaning unrelated to eachother in their main content) I prefer pagination. Consider Google’s search results: two different posts can have totally unrelated content, although the search algorithm can still sort it by mathematical relevance. But this relevance is not really the relevance of the user.
Also, when the user is not interrested in comparing two posts I like pagination.
If the posts are sortable on the factor that the user is interrested in comparing, I do not use pagination. I use scrollbars or something else to avoid that two interresting posts happen to fall in different pages.
March 16th, 2009 at 8:49 pm
[...] was talking the other day about pagination and David Hamill had a point there, those tiny numbers don’t send any message to the user, so what’s the [...]
April 7th, 2009 at 2:07 am
Hmm. I agree with a lot of your comments, but think that for the most part they are largely irrelevant.
A lot of people misuse numerical pagination – primarily by not providing other facilities for fast information retrieval. Providing links such as ‘date ranges’ for pagination presents its own issues – the compact form for dates is ambiguous (USA vs. Intl formats) and much, much longer. It’s also difficult to understand exactly how many items per page you will receive etc.
My point, I guess, is that filtering and searching are the important parts that get neglected, not pages as such. Pagination should serve a single purpose: to divide things up into digestible chunks.
Things like date ranges and ABC etc are *filters* and not paginators. They work together.
April 7th, 2009 at 7:45 am
Hi Keith, you’re right that providing other facilities for fast information retrieval are important. But you’re assuming that everyone notices them and understands how to use them. This isn’t always the case. If you paginate your results with numbers, a lot of people will assume that this is the way they navigate through them.
The issues you point out are challenges that can be solved, they just require a bit of effort . If I select a month from a date range, the number of results only becomes an issue when it gets too large. I’d rather be able to choose a month than have to guess a number between 2 and 45.
Comment on this article