Usually, autocomplete is the first search element visible to users. Therefore, making an excellent first impression is crucial, so users trust it and continue searching. When implementing autocomplete, we recommend following these best practices:
When suggesting products, autocomplete should have a clear CTA “See all” or “See all results”, so users don’t confuse autocomplete with a search results page. On desktop, it could be at the bottom; on mobile, it should be on top, so users can easily land search results page.
When suggesting products, they should have a well-visible medium to large size image, with a title and price (with a discount if applicable). You can also show the brand and reviews if relevant. Don't suggest more than 5 products.
When suggesting categories or keywords, the matched keywords should be bolded, so users see what keyword their entered phrase matches.
Autocomplete shouldn’t replace the search results page, where users are used to having their search experience. Therefore it shouldn’t be wide-screen, nor have facets, or scroll features.
You can implement Autocomplete the same way as the rest of the search. Read search implementation guidelines to learn more.