How to display last page in pagination if one more than shown pages?

Question

I'm working on a pagination plugin that lets users choose how many pages they want to show at a time out of the total, like in this example the user set it to show 4 pages out of the 100 available pages:

Like many pagination controls it shows the number of pages set to display around the current page then the last page separated by ellipses.

The problem comes in when the user sets the number of pages to display 1 less that the total number of pages. So in this case they decide to show 4 out of the 5 available pages.

I can show the last page separated by ellipsis still to keep consistent:

But there is no numbers between 4 and 5 so it shouldn't have the ellipsis:

But then I am displaying 5 pages, not the 4 the user requested, so I should only display 4:

But this makes it inconsistent since the last page is normally shown, and users have no way of knowing there is (or what is) the last page.

What is the proper way to display this situation?

EDIT: Stack Exchange by default shows 5 pages, the ellipsis, then the last page. After clicking through many SE forums I found one with just 6 pages and they handle it by removing the ellipsis.

I believe that is the best practice for most pagination setups but what about a plugin like mine where the user explicitly sets the number of pages to display.

Answer 1

I think you can resolve this issue considering the following:

tp: total number of pages uc: user's choice

So, let's say tp=100 and uc=5 . You will use something as you said, like 1, 2, 3, 4, .... , 100

However, if tp=5 and uc=4, then I would show 1, 2, 3, .... , 5

Basically, you want to show the total number of pages and you need to respect User's display choice. This formula, which basically is a counter that displays TP number preceeded by (UC-1), covers both needs while keeping consistency.

Display considerations aside, I'd also display a small text clearly stating total number of pages. While page navigation is pretty known, I have found quite a bunch people not understanding this approach, so adding that in a small message won't hurt. Additionally, Iwould also limit the UC variable in order to avoid users select unmanageable numbers, for example 100 pages out of 100.

Edit to answer comment: Personally, I'd use a lower limit of at least 3. And if you want to allow a great deal of customization, then if >3, allow to use only directional arrows . Think about this: You need to have current page, last page and the X (ellipsis). This ellipsis is important, because it covers both a semantic and a syntactic function: there's an omission of data which is implied by the sign.

So, let's go with the minimum number of boxes to display (numbers are the total amount of pages, current page may coincide with on of the spots):

• 1

No numbered navigation

• 2

2 spots (first / last)

• 3

3 spots (first / second / last)

• 4 and over

3 spots (first / undetermined / last)

These are the minimums. Now, you want to offer users the option to choose the amount of spots (navigational items). So it's obvious 1 won't have any spot, 2 will need 2 spots to represent the needed information, 3 will need 3 spots to represent the needed information (and this is tricky, because second spot could easily be an ellipsis. But if you have 1,...,3 , it's obvious the ellipsis is 2, thus not an undetermined value and therefore ellipsis makes no sense) and from there, the MVP (minimum viable product) is 3 spots where the second spot is undetermined.

But these are the bare minimum. If user chooses to display 4 spots, and there are 4 total pages, then you can't have 1, 2, ... , 4, because again, it's clear the ellipsis is 3, so you need to keep that in mind as well: Ellipsis are shown only if UC=(TP-2) ∧ TP>3

Well, hope this helps!

Answer 2

I think you can address this by setting the right expectations at the outset. Instead of asking the user to specify the number of pages to display. Instead let them specify the maximum number of pages to display.

Then there is no mismatch of expectations when they see a lower number of pages displayed.

Answer 3

In your example, just show page 4. If the developer defined the picker to show four at a time and the list includes five, just show them all. Think of the user. If I want to jump to page four, and it's been replaced by an ellipsis, I'll have to pick some other page to make #4 appear so I can pick it. Arrgh. Just show it.