Auto suggest: best practices for autocomplete suggestion

Can you take a hint? How about an autocomplete suggestion in a search box?

More to the point, if you’re a retailer or online media content provider, can you effectively provide autosuggest for your search-box users?

You’ve probably noticed the autocomplete feature when you type in a Google search term or use other high-profile search engines such as Bing. Search box technology seems to be getting better at anticipating human needs. The autosuggest feature seems to be thinking about what you might want, and maybe your request aligns with popular searches done by other people. You enter a few letters (or even just one) in the search field on a company’s homepage and it feels like you’re playing charades: the search engine starts guessing. 

A definition of auto suggest

Wondering what the difference is between auto suggest (or autosuggest) and autocomplete functionality? You’re not alone; it’s easy to confuse them, and people often refer to them interchangeably, along with other terms including typeahead and predictive search. 

But if we’re going to get technical, auto suggest is a broad concept that encompasses predicting search user queries and providing query suggestions based on partially entered search terms, usually in a text box below the search field.

Autocomplete is in essence a subset of autosuggest; it automatically finishes words and phrases as a user types, rather than offering suggestions.

Of course, autosuggest is more than a parlor game punctuated by frenzied guesswork. Search algorithms are expertly designed based on vast amounts of user data so that they can “intelligently” anticipate users’ thoughts. 

Regardless of the fine points, these days, if you have a searchable web site or app and want to get or stay ahead of your competition, providing your users with auto-suggest functionality is a must. 

Autocomplete suggestion best practices

When it comes to implementing autosuggest, which search features will keep your audience engaged and help them find their desired content fast? Here are some best practices for designing the right experience:

Scope your content

Since the dot-com bubble of the 1990s, the amount of available digital content has exploded; even a single ecommerce site may contain hundreds of web pages. Wading through the quagmire of content isn’t an option for users — they must be able to instantly narrow their searches or they’ll waste time and never get anywhere.

This is where scoping comes in. Scoping helps your users customize and narrow their search queries before the search engine starts searching.

Scope “tags,” which categorize search queries by type, point users to the right section of a website. A good example is the tags for Google’s search engine, which initially narrows the search results page by categories such as image, video, and news.

Useful for: Sites and apps offering a wealth of content that can be sorted by type 

Example: Amazon, which scopes its products as categories such as book, film, household, clothing.

Tips

• Make your scope tags broad based (e.g., appliances, cleaning products)
• Allow for user selection of multiple scope tags (so people don’t eliminate entire product categories too early)
• Place scope tags near the search bar so they’re easy to select (and have the search bar then acknowledge the selection).

Cater to mobile searchers

With 76% of consumers shopping using mobile devices’ tiny keyboards, offering excellent mobile-friendly search can make a huge difference in their shopping success rates.

Useful for: A site or app that has a large base of mobile users (e.g., Apple Maps)

Example: Gmail autocomplete

Tips

• Make the search icon and  input field big enough and easy to see
• Provide quick predictions (with a delay of less than a second)
• Support keyboard navigation and shortcuts with a plugin
• Support mobile functionality (e.g., provide an optimized, user-friendly interface)

Provide advanced search 

Studies show that people prefer fewer options to more choices; beyond a certain number of choices, they become overwhelmed. If a user is overwhelmed by an overabundance of options, it may well lead to “action paralysis” — the inability to make a choice. 

What does that mean for search on your site? Simply put, too much user search choice will kill your conversion.

Advanced search that keeps things pared down can help your users make choices and move forward. Advanced search is an extension of scoping, with more filters for users to select. It lets searchers  so they can quickly navigate to a more-specific search result, which is especially useful when search results are extensive.

Useful for: A site or app that supplies large quantities of content 

Example: Rightmove 

Tips 

• Provide appropriate filtering
• Have tons of advanced filters? Rather than trying to cram them all on one page, provide a continuation “More filters” buttons at the bottom
• Add sliders for value ranges (e.g., dollar amounts for pricing)

Remember people’s recent searches 

Don’t recall what you did yesterday? There’s still hope: your search engine might be able to help you refresh your memory. 

Recent search history helps your users who may have gotten busy or distracted recall their searching activity and resume where they left off with the aim of getting them quickly to a search result the second time.

Useful for: Any website or app, especially those with a longer decision-making journey for the user, such as one that involves expensive purchases)

Example: Walmart, which displays a drop-down list of recent searches in the search bar

Tips 

• Don’t erase users’ earlier search queries
• List searches in order from most recent to oldest
• When displaying recent searches, correct typos to potentially save users time

Shorten suggestion lists

This usability-improvement technique builds on the idea of scoping and advanced search. Instead of requiring endless up and down scrolling by users, short suggestion lists cull autocomplete search suggestions, displaying only the most relevant and timely (according to factors like what’s trending for other users). 

Useful for: Making search suggestion lists more palatable

Example: Google, which limits the number of suggestion to 10

Tips 

• On a desktop computer app, limit search suggestions to about 10
• On a smaller device such as a mobile phone, which can accommodate fewer results, cap the list of suggestions at 4–8

Offer voice search

Voice search works through automatic speech recognition (ARS), translating spoken suggestions into text search. Is speaking ever going to replace typing? Perhaps. Voice search for websites and apps is certainly on the rise, particularly in ecommerce. And it’s especially handy for smart-device users who want to be able to search hands free.

Useful for: Folks on the go

Example: Google Maps

Tips 

• Create a mobile-friendly version of your website
• Optimize your site for question-based keywords (voice searchers are more likely than typers to ask questions)
• Use natural “spoken” language in your content (e.g., users are more likely to begin a phrase with “Show me” or “I need…”.

Autosuggest is best

Effective autosuggest functionality provides the right search experience to engage users during their discovery, consideration, or conversion phase (or all three).

Want to know more about autosuggest and start using this technology to enhance your site-search user experience? The world’s leading businesses trust Algolia’s search API to provide search optimization that delights their users and improves their bottom line. Get started free today!