1. As the user is typing, display matching items/entries beneath the search box in a dynamic panel.

   

   • The auto-suggest panel should appear if the minimum number of characters is present in the search box (see solution element #2), and it should remain in place until: 1) a user selects an item from the list; 2) the search box loses focus; or 3) the search has been submitted.
     
   • If the user is entering text into a "search within” field, the suggestions should only include values that are relevant to the current navigation state.
     
     
   
   Show More...

2. Invoke the auto-suggest panel only after a minimum of three characters has been entered.

   Applying auto-suggest after fewer than three characters is more likely to produce spurious results. This number may be modified if needed for individual applications.

   
   Show More...

3. Initiate an auto-suggested search by allowing the user either to: 1) select one of the suggestions, or 2) select a “Submit” button.

   

   • If the user selects one of the suggestions, the search should be initiated with the selected value. If the item selected was actually a facet value, then it should be applied to the navigational context as such rather than as a keyword query.
   • If the user chooses not to select an item from the auto-suggest list and instead selects the “Submit” button, the value the user has typed into the search box should be submitted as a keyword query.
   
   Show More...

4. Display a limited number of options in the auto-suggest list.

   

   A typical list should be limited to about 10 entries. The auto-suggested items need to feel responsive to individual keystrokes in real time as a query is entered; a list longer than 10 items is harder to quickly scan and may detract from the user's typing actions.

   
   Show More...

5. Auto-suggest should highlight the matching substring within each of the suggestions.

   

   • Consider using a different color or font style to indicate which portion of the suggested items matches the user's keystrokes.
   • Prioritize prefix matches over substring or suffix matches.
   
   Show More...

6. Consider implementing a spell-correction feature into the auto-suggest panel.

   If the auto-suggest function is not able to find any exact matches, apply a spell-correction algorithm to find approximate matches.

   
   Show More...

7. Optional: Matching items in the auto-suggest panel should be segmented into groups to help users focus on the relevant information being returned.

   

   • Auto-suggest items can be segmented by, for example, type of media, content, or other divisions that support known user needs or business objectives.
   • Simple icons or images may be integrated into the auto-suggest display to help users differentiate among different types of suggested terms.
   
   Show More...

1. Allow the user to navigate up and down through the list of suggestions by using arrow keys.

   Highlight the relevant items in the list as the user moves through the list.

   
   Show More...

2. Pressing the “Enter” key should submit the search based on the current focus.

   • If the focus is on the term in the search box that the user is typing, submit the search as a keyword search term.
   • If the focus is on a highlighted item in the auto-suggest list, submit the search based on the selected item.
   
   Show More...

Avoid returning items in the auto-suggest list that are solely merchandised content or that do not match the terms that the user is typing.

Auto-suggest is intended to work in conjunction with the user’s typing actions to make relevant suggestions as the user is typing.