Search Results

Problem

Search results can be confusing.

Solution

Offer search results in comprehensible formats, allowing users to modify these formats to suit their needs.

Context

Your website or application offers a search mechanism.

Rationale

Users will have been searching for something because they aren’t sure exactly where it is. They aren’t even sure that the search terms they used were the best ones. When they get search results they are likely going to quickly scan the results, potentially looking through many results before they find just the right match. Therefore, your goal is to provide search results in a default format that are very easy to visually scan, while also providing a way for users to reformat the results to their liking (e.g., sort, filter).

Implementation

While you want to provide users with the ability to reformat search results, you need to try and anticipate a good default way to present them, based on what you know about your users and the type of information.

One thing to recognize is that users rarely choose exactly the right search terms the first time, and many searches therefore become an iterative process. As part of the search results, show the user the search terms that were previously provided by the user in an editable search field along with a search button, allowing the user to modify the search at any time (i.e. without having to return to a different search page).

A good default will be to sort the results based on whatever relevance algorithms, or rules the underlying search engine has been programmed to use. For example, if a users searches for articles on a news website, the search engine may already return the results based on relevance to the user’s search query.

Because you won’t know much else about how the user may want to see the results, you should offer easy to use formatting features to the user. These include allowing the user to sort (e.g., by date, relevance, author and other appropriate attributes), as well as filter based on attributes of the results.

A common type of filtering uses the Faceted Navigation pattern to allow users to filter out results based on categories (e.g., for consumer products typical facets are price, color, style).

If related information exists for each result, you may want to show brief versions of the most relevant information as part of the search result. For example, for product search results, you may want to show customer ratings, prices, availability, etc.

You should also provide actions that users would typically want to perform next to each search result. For example, in a listing of consumer product search results, you can provide an “Add to Cart” button to allow the user to purchase the item from the search results without having to go to another web page.

Many searches result in large numbers of results, so you will usually want provide meta-information, such as the total number of search results. In addition, you will want to use a pattern such as Paging to break large numbers of search results into manageable chunks of results that users can view one page at a time.

Sources

Patterns in Interaction Design, Search Results

UC Berkeley Web Patterns, Search Results

Tags

Navigation, Search.