← All learning notes

Web projects

Create a search page with useful no-results feedback

By SI100x · Published

Search is a conversation between a query and a set of results. A practice search page should help the user understand what was searched and what they can change when nothing matches.

Try this exercise

  1. Use a small invented dataset and show the current query above the results. Start with title matching before adding more complicated ranking.
  2. Try a query with different capitalization, extra spaces and no matches. Show an explicit no-results message and a clear way to reset the query.
  3. Keep the result links usable when titles are long. If search is asynchronous, show pending and error states without implying that a request failure means there are no matches.

Check your result

The user should know whether the search completed and which query produced the result. Preserve the entered query when an error occurs so retrying does not require remembering and retyping it.

Explore your next step

Compare course curricula or try a free live demo to ask about prerequisites and practice work.

Explore courses →Find a free live demo →