Paging buttons position – Top, Bottom or both?

Question

The question is on where to place the paging buttons on a catalog page. We have some basic choices here.

1. Only on bottom.
2. Both on bottom and on the top.

The obvious argument to place it only on the bottom of the page is to force your user to see your entire catalog first, then to move to the next page. Also is you see the major web sites, like amazon, ebay and other similar, they have place the paging only on bottom of the page.

But in the previous year's major sites have place the paging on both, on top and on the bottom.

The argument to place it also on the top of the catalog page is to help the user, after is scroll down, to scroll again up, see second time some line that have keep in mine, and then move to the next page with out the need to scroll again down.

The question is – its better for the user to have it on both places or not. Maybe some sites need to force the user to scroll down and up again and that’s their goal, to see as much as possible, but it is good for a user or make him leave the site is you make him frustrate by up and down.

One alternative that I have think about is to have the upper paging buttons hidden, when the user is scroll down you make it visible, and if the user come up again its shown, that way you force your user to see the entire catalog first before move to the next page, but keep it on both.

Answer 1

There are several advantages of putting the paging control both on top and on the bottom, and only really one disadvantage namely the additional screen real estate it requires.

You mention that you as the site owner want the user to view all content on each page, still you provide the option to jump to pages (by displaying paging numbers) thereby letting the user skip pages, so that argument is a bit contradicting. If you enable useful features for navigation the user will like you for it, and most probably spend more time on your site rather than if you didn't provide it.

Another advantage that you didn't bring up is that the user gets an instant overview of how many pages the catalogue holds with the paging control on top. If the view is a search result, and the paging control shows 10+ pages, then maybe the user wants to refine their search. In this case the user would appreciate to be notified of this right away.

Answer 2

A different option is to have a menubar (or similar concept) that is always visible, regardless of where you are on the page. Whether this is appropriate is dependent on your application and your goals.

This is obviously what is used in most desktop applications, where menubars and toolbars are always (or almost always) visible. On the web, one readily-available example of this is in Gmail. When you scroll in a mail message in Gmail, a small toolbar is always visible no matter how far you've scrolled in the message. This small toolbar contains highly-used actions such as "delete" and "add label". Likewise, in the message list, the "newer" and "older" buttons are always accessible, even if you have scrolled down. You do lose some screen real estate to this toolbar, so it's a design choice whether this approach is useful enough and meets your goals to justify the use of screen real estate for it. Google appears to have made the decision that it was useful in mail but not in web search.

Answer 3

If your content is such that it is unlikely that a user would need to jump to a specific place in your content, then you could make a good case for placing paging buttons only at the end. Google search is a good example. However even here, once someone is on page 2 they may want to navigate back to page one easily without having to scroll down to the end. This gives a good argument for having them in both the beginning and end on all pages but the first. This can be mitigated by having shorter pages, but that brings about other concerns.

In situations where it is likely that users will need to be able to jump to a place in your content, then it makes sense giving them at the beginning, and for ease of navigation, you will likely need them at the end as well.

But there is also a design consideration to balance against placing paging buttons at both the top and bottom of content. This tradeoff as well as other means that is no right answer for all applications.

As a side note, in some situations infinite scroll makes more sense that pagination, so it may be worth looking into that first, in which case you won't need to place pagination buttons.

Answer 4

It depends on the main goal of your page. In order to persuade user to see the whole page content it is of course better to show buttons only at the bottom of the page. This makes sense in e-commerce websistes with a limited list of items.

The Wayne State University used an interesting approach for visualizing the "Back to Top" button and force users to scroll down. You can se a demo at this link http://blogs.wayne.edu/web/2012/03/16/a-better-return-to-top-experience/

You could use a similar technique for your top buttons bu using a javascript to detect how far the visitor has scrolled and display top buttons out of the content area.

Hope this helped