Online Store Search and Filters: UX Best Practices
Practice4 minInnovialabs editorial team
In short
Good site search understands a query in any form, with typos, the wrong keyboard layout or a synonym, and never shows an empty screen, while filters mirror the criteria people actually use to choose products.
The essentials of search and filters
A shopper who uses search usually already knows what they want. The store's job is not to lose them at this step. Search must forgive mistakes and understand different wording, and filters must help narrow the choice down to a few suitable products quickly.
The search bar should be prominent: an open field in the header on desktop, a field or large icon visible right away on mobile.
Autocomplete
Suggestions appear after the first few characters and save shoppers time.
- Show several types of suggestions: popular queries, categories and specific products with a photo and price.
- Highlight the matching part of the text.
- Support arrow-key navigation and Enter on desktop.
- Include the user's recent searches, which are handy to repeat.
- Suggestions need to appear fast, otherwise nobody uses them.
Typos, synonyms and transliteration
People type in different ways, and search should understand all of them.
| Situation | Example | What to do |
|---|---|---|
| Typo | "refridgerator" | Fuzzy matching |
| Wrong keyboard layout | Cyrillic typed on a Latin layout | Layout conversion |
| Transliteration | "noutbuk", "iphone" vs "айфон" | Transliteration dictionary and rules |
| Synonym | "smartphone" and "phone" | Synonym dictionary |
| Units and formats | "1 tb", "1tb", "1000 gb" | Value normalization |
| Languages | a query in Uzbek, Russian or English | Index names in several languages |
In Uzbekistan transliteration matters a lot: shoppers mix Cyrillic and Latin, and Uzbek itself is written in both scripts. Grow the synonym dictionary from your search query log, the best source of real wording.
This work is usually done with dedicated engines (Elasticsearch, OpenSearch, Meilisearch, Typesense and others); a plain database search rarely handles typos and relevance well.
Zero-result queries
A "Nothing found" screen is a lost shopper. What to do instead:
- Correct the query and show results: "Showing results for 'laptop'".
- If nothing matches, show similar products, best sellers or categories.
- Suggest loosening filters if they caused the empty result.
- Offer a way to get help: chat or a "Can't find it? We'll help" form.
Export zero-result queries regularly. They reveal missing synonyms and sometimes the products customers are waiting for.
Filters that match how people choose
Filters should not be built from every database field, but from how people actually choose products in that category.
- Clothing: size, color, season, material. Electronics: storage, screen size, brand. Furniture: dimensions, material, color.
- Put the most important filters on top and collapse the rare ones.
- Price as a range with input fields, not just a slider.
- Show the product count next to each value and hide or disable values that would return nothing.
- Display active filters as chips above results, each removable in one click, plus a "Clear all" button.
- Keep attribute values consistent: "blue", "Blue" and "navy" should not become three colors by accident.
Filters on mobile
- Filters open in a full-screen panel with a "Show N products" button at the bottom.
- Sorting is separate from filters and always within reach.
- Selecting a filter should not reload the page or reset the scroll position.
- Filter state is preserved when the shopper returns from a product page.
SEO and filters
Filter combinations create a huge number of URLs. Decide upfront which filter pages are useful for search (for example, "Nike sneakers") and make them indexable with a unique title. Block the other combinations from indexing or set a canonical URL to avoid duplicates.
Common mistakes
- Search only matches the exact product name.
- The same filters for every category.
- An empty result page with no suggestions.
- Attributes are missing on some products, so the filter "loses" part of the catalog.
- Nobody looks at search analytics.