A search field is a style of text field that’s optimized for performing text-based searches in a large collection of values. Many windows include a search field in the toolbar, but a search field can also be displayed in the body area of a window. A search field includes a magnifying glass icon, and can also include placeholder text and a cancellation button.
Use a search field instead of a standard text field to implement search. A text field doesn’t have the search field appearance that people expect.
Avoid supplying an introductory label. People are familiar with the distinctive appearance of a search field, so there is no need to label it. The exception to this is when you place a search field in a toolbar. In this case, you must supply the label "Search", to be displayed when users configure the toolbar to show icons and text or text only.
In general, enable the cancellation button. Most search fields include a cancellation button that erases the contents of the field and immediately terminates the search.
If necessary, provide hints and context in a search field. A search field can contain placeholder text—such as "Search for a place or address" or simply "Search"—as a reminder of the context being searched.
Initiate the search at an appropriate time. You can begin searching as soon as the user starts typing or wait until they press Return or Enter. Searching while the user is typing causes the results to be continuously refined as the entered text becomes more specific. If search occurs after the user finishes typing, consider showing a menu while the user is typing that lets them choose from commonly searched terms or recent searches.
Take privacy into consideration before displaying the user's search history. People might not always appreciate having their search history displayed onscreen. As an alternative, you might consider offering a scope bar that helps people narrow down results quickly.
A scope bar can be added to a window to let people refine the scope of a search. When searching in the Finder, for example, a scope bar lets you filter for items in specific locations or matching attributes like modification date and extension. Some windows offer a scope bar that includes an integrated search field.
Favor improving search results over including a scope bar. A scope bar can be useful when there are clearly defined categories in which to search. However, it’s best to improve search results so scoping isn’t necessary.
If appropriate, let people refine scoping operations. Supplementary scoping rules can be enabled using filter rows that appear beneath a scope bar. For example, when searching for a file name in Finder, you can click an Add button to specify additional attributes like an extension or modification date range. A filter row can include text fields, buttons, and other controls for specifying filter criteria.
Use appropriate button appearances in scope bars. Buttons should adopt a recessed style when used as toggles and a rounded rectangular style when used to initiate actions or specify search criteria. See Scope Buttons.