Search code examples
paginationuser-experience

Recommended Pagination layout in UX?


As I search in different paginations, I can't find out if there is any best practice for pagination elements or not, based on user experience.

I have some questions:

  • I have a search result page, is it better to show the page numbers in results own section, or in other section with spaces with search result?

  • Where is the best place for showing the search result total count?


Solution

  • If you could provide a screenshot of your current Wireframe that would be helpful. Generally speaking it is best to keep elements in close proximity if they interact with each other. So the total count and the page numbers should be in the same area.

    The Same is true for the pagination itself: keep it next to the grid it controls and, if that is larger than half a screen height, add one above and below. Below for when the user skimmed through the list and didn't find the desired result, above if it is obvious from the beginning that the searched item is not on the current page. (eg. when sorting alphabetically)

    As always, there is no general rule to what's best practice. If you ask yourself 'what is the goal the user trying to achieve' this should get you on the right path. Or observe users using your product.