Improve site search: top tips (Part 1)

Maximise the value of a good site search feature

In this first of 2 articles on the subject, Principal UX and Ergonomics Consultant, Helen Cheetham, provides advice on how to improve site search.

Why it is so essential to perfect your site search feature – and how do you do it? Follow our simple guidance to optimise your site search for the best user experience possible. In this article we focus on the site search field itself, while a follow up piece will focus on the actual search results.

When do users use site search?

Our extensive experience conducting website user testing tells us that users rely on a site’s search feature. This is particularly true when they look for something specific, but also when they are unable to find what they want through the standard site navigation.

In ecommerce, search is often used by consumers that know precisely what they want to buy, in order to accelerate the purchase process. In other business and public sectors, search is generally preferred to contacting Customer Services.

Top tips: improve site search

Tip 1: Make the search function consistent

Provide one consistent search box on every page of your site, so that users can easily locate and identify it. Generally, we recommend placing the box in the same place on every page, although to avoid duplication, there may be instances when it is appropriate to move the box.

For example, Graze demonstrate this effectively; their search box disappears from the top of the page on the results page, in favour of a lower search box that is positioned closer to the search results.

Optimise the search box position

There is ongoing debate about the best placement of the search box. Many popular websites place the search box towards the top centre or top right of the page. Based on their survey with 142 participants, A. Dawn Shaikh and Keisi Lenz found that the most convenient location for the site search is the top right or top left of each page. This is where users could easily find it using the common F-shaped scanning pattern, as shown in their chart showing the expected position of the site search.

Prominently display the search field

Display the full open-text search field by default: hiding it behind an icon makes the feature less noticeable and increases the cost of interaction. Airbnb is a great example of a site where search is a focal point.

On content-heavy sites, it may be appropriate to use sticky navigation to keep the search bar visible as the user scrolls up and down pages within the site. This ensures ease of access to search while browsing content.

Tip 4: Accompany the search box with clear iconography

Use a simple magnifying glass icon to clearly and immediately indicate a search field to users. This is one of the most universally recognised icons.

Tip 5: Provide a clear search button

• To progress with their search, users should have the option to:
  Click a clear, visual call to action next to the search field, such as a ‘Go’ or ‘Submit’ button (use consistent wording throughout).
  Press the return button on their keyboard.

Tip 6: Provide clarity about what users can search for

Include a sample search query in the input field, or explain to users if multiple search criteria can be used. This gives them clues about what queries can be used (see examples below). The placeholder text should disappear when the user begins typing in the field and be limited to a few words (to keep the cognitive load low).

Tip 7: Ensure input fields are appropriately sized

A short input field limits the number of visible characters, which means only a small portion of typed text will be visible at one time. This makes it difficult for users to review/edit their full query and encourages them to use short and imprecise queries.

A 27-character text input should accommodate 90% of queries. A ‘growing’ search box (that expands when clicked) ensures the search box is prominent, while also conserving space.

Tip 8: Provide auto-suggestions

Users often struggle with query formulation; poor search results on the first try mean later search attempts rarely succeed. Effective auto-suggest tools reduce data input and guide users to articulate their search query. The best auto-suggest search tools:

• Highlight differences between the inputted information and suggested information.
• Auto-correct spelling.
• Recognise root words.
• Use predictive text.

The Financial Times site provides a nice example of how auto-suggest presents a range of results under clearly grouped categories.

The ACCA website limits the suggested list to 10 items, to avoid overwhelming users.

Until part 2: optimising your site search results

With a clear understanding of the requirements for an optimised site search field and our simple but effective top tips, you can evaluate and improve site search.

If you would like help conducting a deeper analysis of your search feature (or any other component of your website), with recommendations of how to improve site search with a more user-friendly and effective approach, we can help you! We frequently undertake usability and accessibility expert reviews of websites and test websites with real users, to gauge their interaction with and reactions to certain features/content and to identify areas for improvement.