Search box
The Design Need:
Users want to search the content of the website for a specific item of information without using the offered navigation options (such as menus).
Design Examples:
Design Solution:
Offer a text input box where the user can enter free text to search on.
- A search box should be provided on every page.
- The search box should be consistently placed throughout the website.
- The search box should be long enough to show the typical terms used on your site.
- Do not offer advanced search options in a first level.
- Search the whole site by default, if you offer to search only specific parts of the content.
- Using drop-down lists to narrow a search distracts novice users from the rest of the form.
- Allow use of the enter button to submit a search action.
- Clearly label the search box as such.
- The label “search” on the action button should only be used for keyword search, not for other search types such as faceted search or parametric search.
When to use:
You should provide a search function on every site unless the website is so small that it can easily be explored via menu-functions and other basic navigation features.
Why use this solution (rationale):
A search tool is an important technique for giving the user efficient access to required information. Users often do not know the identifiers used for the content of your website. Providing free text entry is often the best starting point to get to the result they are looking for. Free text entry helps even if they do not know exactly what they are looking for e.g. a digital camera.
You'll find this pattern is often on:
- Top left of site
- Top Middle of site
- Top Right of site
More info elsewhere:
- “Evaluating the Usability of Search Forms Using Eyetracking: A Practical Approach” on www.uxmatters.com
- “Does Search Need to be in the Upper Right?” on www.uie.com
- “Search: Visible and Simple” on www.useit.com
- A related design pattern on www.quince.infragistics.com
