Key insights
- Placeholder copy is your first onboarding. "Search" tells the user nothing; "Search by name, SKU, or brand" tells them everything they can look for.
- An empty field isn't empty. Load recent searches the moment the user focuses the bar so a single tap refills it and friction drops to zero.
- Rank autocomplete by clicks, not alphabet, and tag each suggestion with a category badge. Three sharp results beat ten noisy ones.
- Make the whole flow keyboard-driven: arrow keys move through results, Enter selects, Escape closes.
- Keep the focus ring visible at every step — invisible focus quietly breaks both keyboard navigation and accessibility.
- Zero results should never be a dead end. Offer popular searches, category jumps, or alternate spellings so users recover at the exact moment they'd otherwise bounce.
Do / Don't
- Do: Write descriptive placeholder text that hints at what's actually searchable
- Do: Surface recent searches on focus so returning users refill the bar in one tap
- Do: Turn zero-result screens into recovery paths with suggestions and category jumps
- Don't: Ship a bare "Search" as your only placeholder
- Don't: Sort autocomplete alphabetically instead of by popularity
- Don't: Leave a "No matches" screen as a dead end