No search results: what should your website show next?
A customer searches for “walnut table” while an office-only filter remains selected. No products appear. “No products available” does not fully explain the situation: the cause might be stock, wording or a filter. This guide focuses on the decisions to make when internal search produces no matches, using an imaginary furniture catalogue rather than claimed sales results.
Explain the actual reason for an empty screen
No matching items, a restrictive filter and an unavailable search service are different states. A connection problem should not tell visitors that the business has no relevant products. Establish which conditions the system can detect, then prepare a short, accurate message for each one. Avoid forcing every failure into a generic zero-results template.
Repeat the query where it helps people recognise a typing mistake. Ask the technical team to render it safely as text; a visitor’s search input should never become executable page content. The customer-facing explanation can stay simple even when the implementation needs careful handling.
Keep the query and expose restrictive filters
Leave the search field populated. Show active filters nearby and allow them to be removed individually. In our example, removing “Office” is a more direct recovery step than typing the same phrase again. If a reset control clears everything, explain the scope of that change rather than unexpectedly discarding useful choices.
When visitors open a product and return, preserve the query and filter state. On a phone, check that the message and recovery control remain understandable after the keyboard closes. Verify this in a working interface, not only in a design mockup.
Base suggestions on content that actually exists
Offer a spelling suggestion only when the catalogue supports it. A polished recommendation for an unavailable item creates another dead end. A relevant category or a route back to the complete catalogue may be more useful. If support is available, avoid promising a response time the team has not agreed to deliver.
Keep promotional recommendations visually separate from matching search results. A visitor should understand when a product is merely related to their interest. Do not fill the results area with unrelated products to conceal that the original query found nothing.
Compare an empty-state message
Make the changed result status perceivable
When results update without a page reload, a small coloured message may not reach everyone. W3C includes result counts and “No results” messages among status-message examples when they do not move focus. Appropriate semantics let assistive technology announce that change without requiring the visitor to find it visually.
Discuss how the update will be announced instead of moving keyboard focus on every search. During a screen-reader check, listen for the status, unnecessary duplicate announcements and the route back to the search input. Test the actual behaviour after filters change as well as after submitting a query.
Accept the first release with three queries
Choose a successful query, one made empty by a filter and one containing a spelling mistake. Record the expected message, available recovery options and browser-back behaviour for each. When reviewing search logs, avoid transferring names, phone numbers or email addresses that visitors may have entered accidentally into routine reports.
Connect this flow to the mobile search entrance. Our project archive can support discussion of catalogue presentation options. Include empty and error states alongside successful results in the website design handover.
Frequently asked questions
Should we automatically show all products after an empty search?
That can look like a successful match. Explain the absence of results first, then offer a clear choice to return to the complete catalogue.
Does every small site need search?
No. Clear navigation may be sufficient for a small collection. Adding search means taking responsibility for relevance, empty states and ongoing maintenance as well as the input field.