Collab space: Search results

This is an open space for collaborating on a search results pattern. To join in the conversation please add a comment below.

Overview

Search results allow users to explore products and services using keywords or phrases.

When to use search results

Search results help users find content quickly by returning results based on a specific keyword or phrase.

Use the search results pattern for:

  • Global searches
  • Result listings where primary search is by keyword

Do:

  • where possible, account for typos and synonyms in search queries
  • trigger the search if a user hits the Enter key when typing in the search field
  • always display the search bar with the user’s last searched term
  • if there are no results, clearly communicate if there are no matching results and provide suggestions or follow up actions

Interaction Design & Usability Research

Results

By default, search results should be sorted by relevance. If there is a user need, offer a sort function to allow users to order the results based on supplementary criteria.

Do:

  • ensure search results are tested and return accurate and relevant results
  • show the number of search results returned
  • where possible, bold the matching keyword or term in the result description
  • use pagination when more than 10 results are returned

When displaying results, consider what information is important to the user and display what they require to make an informed decision.

Content options can include:

  • Headline - use to identify the title of page or result
  • Description - use to give the user a snapshot to the content
  • URL - use to indicate when content is located on a different site
  • Label - use to indicate the result category when this will give greater context over the result type or content. For example, the file type if it differs from a webpage.
  • Date - use when it brings value to the user to know this information and be clear on their relation to the content (for example “Last updated”).

No results

If no results are returned, allow the user to continue their journey by:

  • Showing an alternative suggestion if search term is not found or a spelling mistake is detected (if possible)
  • Tips to improve or widen their search results
  • Contact information or other ways to navigate the site

Filtering

Adding filters can help users narrow down their search results.

Predictive search

Assist users by providing suggestions as they type. This can speed up search times, reduce no results being returned and surface content the user may not be aware of. Ensure suggestions are relevant and match your user’s need.

UI Design

1 Like