Ecom Ideas
  • Homepages & nav
  • Category pages
  • Product pages
  • Cart pages
  • Checkout
  • Site search
  • Internationalization
  • Holiday ideas
  • Featured idea gallery
  • Topical articles
Subscribe
šŸ’”
Ecom Ideas
/Site search
Site search
/
āŒØļø
Autosuggestion
āŒØļø

Autosuggestion

Tap any tip to open toggle āš”Ā some gifs may take a moment to load

Featured ideas šŸ¦„Ā are rare ideas you may not have seen before ;-)

šŸ“¼Ā Videos

ā€£
Good Idea šŸ’” Bad Idea šŸ’£ Typeahead Edition Pt 1 (Widget behavior)
ā€£
Good Idea šŸ’” Bad Idea šŸ’£Ā  Typeahead Edition Pt 2 (Suggestion experience)

šŸ’”Ā Ideas and tips

Widget design and experience

ā€£
Consider disabling typeahead on mobile
ā€£
Place a ā€œView All Resultsā€ button below product suggestions
ā€£
Apply a visual hierarchy to suggestion ā€œtypesā€
ā€£
Label your product recommendations as Popular (for context)
ā€£
šŸ¦„Ā Show insta-results (bypass the page load)
ā€£
Consider mini descriptions with product suggestions
ā€£
šŸ¦„Ā Consider including price filters in the widget (where appropriate)
ā€£
Consider including price detail with product results (where appropriate)
ā€£
šŸ¦„Ā Consider department scopes in the widget
ā€£
Use large thumbnails for product results
ā€£
Nest category links under search suggestions
ā€£
Consider dropping product matches
ā€£
šŸ¦„Ā Consider showing variant swatches with product matches

Suggestion experience (matching logic)

ā€£
Show previously viewed searches on-click
ā€£
Trigger suggestions after minimum 3 characters
ā€£
Show hit counts
ā€£
šŸ¦„Ā Show instant feedback when no results match
ā€£
Highlight attributes, not character matches

šŸ«£Ā Cautions

ā€£
Donā€™t pre-merchandize before the user types
ā€£
Donā€™t trigger autosuggestions after the first character
ā€£
Be careful with the full-screen takeover pattern
ā€£
Avoid product thumbnails for category and search term suggestions
ā€£
Donā€™t show product titles without thumbnails
ā€£
Donā€™t show banners in typeahead widget
ā€£
Avoid showing categories instead of search terms
ā€£
Always include a ā€œView Allā€ link!
ā€£
Avoid pill-style chips for list items
ā€£
Donā€™t suggest everything BUT search terms
ā€£
Avoid displaying the search term on the submit button
ā€£
Donā€™t force your customer to select a suggestion (aka ā€œno Submit buttonā€)
ā€£
Avoid semi-opaque dropdowns

Back to Site search ideas

šŸ‘‰Ā Follow on LinkedIn for daily ideas šŸ’”

Get daily ideas

LinkedIn