I am paginating a data table and have different views in my application where each view has its own rows. Some views may have data, some may not.

Showing 1-0 of 0 Page 1 of 0

is what I am showing on a page with no rows.

If I had some rows to display, it would be

Showing 1-30 of 45 Page 1 of 1

What do I display in the empty case?

Some possibilities:

  1. Showing 0-0 of 0 Page 1 of 1

  2. Showing 0-1 of 1 Page 1 of 1

What do I do here?

  • 4
    Sounds terrible, what's the reason for data not being available? Is this triggered by a user search? – DarrylGodden Jan 18 '19 at 9:17
  • @DarrylGodden i have financial data coming in from external APIs shown in the same table but divided as views, it takes me some time to get the data up and running on some views sometimes so if you load the website initially when it just boots it wont have anything to show, there is pagination but some views may have data some may not – PirateApp Jan 18 '19 at 11:50
  • 14
    @PirateApp "It takes some time"? So the area isn't "nothing matches your criteria" it's "still loading"? – Kamil Drakari Jan 18 '19 at 14:44
  • 2
    There's some answers below, one of which seems quite popular, my view would be to look at refining the queries that pull in the data and the potential to make efficiencies at that end, alongside the queries and reduce the possibility that the user could end up with no data to show. – DarrylGodden Jan 18 '19 at 15:38
  • google solved this for android apps a long time ago by letting you provide an alternate view when a ListView has 0 items – njzk2 Jan 20 '19 at 1:21

For this situation you can use an empty state which can be just text or a graphic with text and an action button.

Example of an empty state from Product Hunt:

enter image description here

Good empty states will give the users an action button which can push them in the right direction. A button with something like "Rephrase your search" might work in this case.

It doesn't make sense to show any pagination because there are no results let alone one or even half a page of results.

  • 32
    Please only show that panel when you actually did search. I know too many unreliable web apps, which show "no results" when there was a timeout or even while performing the actual search. – Christian Strempfer Jan 18 '19 at 18:16
  • 8
    Does their site really say "bummer"? Gees. – Lightness Races in Orbit Jan 20 '19 at 17:29
  • 2
    @LightnessRacesinOrbit their voice and tone is a west coast surfer dude from the '90s. – RobbyReindeer Jan 20 '19 at 20:28
  • 1
    Refining a research would only output fewer results, wouldn't it? – Eric Duminil Jan 20 '19 at 21:27
  • 13
    That mistake in the sentence though(in screenshot) – Mat J Jan 21 '19 at 6:41

I would hide Showing "0 results from 0 results". Instead I would add in place a Blank State image with a button for the user to add data. ( If the user adds the data ).

Displaying a pagination where there are no results is purely an artefact of a not so good UX.

Example : enter image description here

  • 1
    Sorry about a seemingly unrelated question, but what app is this? – aexl Jan 21 '19 at 7:45
  • Expensify is called. I don`t know anything about it. – Cristian Negraia Jan 21 '19 at 9:46
  • Displaying pagination when there's 1 page or fewer of results is also not so good UX. Related, the site should recover gracefully if I am on page 3 and then alter the search term in the URL so it now gives a 1-page result. – Harper - Reinstate Monica Jan 21 '19 at 20:38

For completeness, there's a canonical bad solution to this that is extremely common: quietly (maybe even silently) generalize the user's query until the set of results is non-empty, and show them results that they weren't looking for. Sometimes this takes the form of guessing at other searches they might have meant, Other times it's just putting advertisements in their face.

Obviously (or maybe not so obviously, since it's so common), don't do this.

  • 10
    Note: Google also includes a button for "Search instead for [X]," which is a requirement for this feature to be acceptable. – James Gould Jan 18 '19 at 17:13
  • 17
    @JamesG.: It also does that when you didn't misspell your query but it's an uncommon or foreign word. It also shows you high-rank results that omit one or more of your search terms (sometimes quietly mentioning that under the result) or that only include words it thinks are synonyms for one of your search terms (which possibly are not synonyms in the context you were looking for). All of this is extremely bad ux. – R.. GitHub STOP HELPING ICE Jan 18 '19 at 17:33
  • 7
    Netflix does this when they don't have the movie you were searching for--they instead show you movies that are similar to the one you were actually trying to find. I'm undecided as to whether or not I like this route. – Ectropy Jan 18 '19 at 18:16
  • 23
    @Ectropy: It would be so much better if they showed you the movie that you were obviously searching for, acknowledging that it exists but they don't have streaming rights to it, and indicated whether you could get it with their DVDs-by-mail service (which still exists, right?), and only then offered to show you similar movies you might like. – R.. GitHub STOP HELPING ICE Jan 18 '19 at 18:19
  • 4
    @BlueRaja-DannyPflughoeft: It's not always fuzzy-searching. Google seems to actively omit some of your search terms when it thinks you'll get "better" results without them, rather than using any distance function. But conceptually, fuzzy searching is also a generalization of the user's query, even if the mechanism is to generalize by admitting low-distance results. – R.. GitHub STOP HELPING ICE Jan 18 '19 at 20:57

I think an empty results list is just fine, when your page navigation is good.

An empty results list is consequent. It doesn't break the expectations (e.g. showing a page which doesn't look like the search page at all, like the "bummer no results" page) and conveys "here is an empty list".

The important part is your navigation. If there was a search, make sure the search field is visible above (use the same layoutfor full and empty result lists). If it was a navigation in a FAQ with categories, then make sure the needed breadcrumbs to navigate back are visible.

Do not redirect to some other page (this will break simple fixes like changing the mistyped term directly in the URL) and do not provide action buttons which are not clearly useful. When I found no answer in the FAQ category, I do not want to return to the homepage. Maybe I want to return to the FAQ index, most likely I want to return to the parent category. In search results, I most likely want to change the search term.

  • 1
    When I find 0 results, I want to return to their competitor's search page. – Harper - Reinstate Monica Jan 21 '19 at 20:40

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.