Usually, the 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 the autocomplete, we recommend following these best practices:
When suggesting products, the autocomplete should contain a clear CTA “See all” or “See all results”, so users clearly see that there are more products for the search query than the suggested ones. 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 keywords, the matched keywords should be bolded, so users see what keyword their entered phrase matches.
The autocomplete shouldn’t replace the search results page, where users are expecting to get their search experience. Therefore it shouldn’t be wide-screen, nor have facets, or scroll features.
You can implement the autocomplete the same way as the rest of the search. Read the search implementation guidelines to learn more.