Filters and Facets: Enough to Narrow, Not Enough to Bury
Filters should match the decisions shoppers actually make, show only options that return products, and stay usable on a phone. More facets is not better; the right few, in shopper language, are.
The short answer
Good filters mirror decisions. If shoppers choose by size, fit, colour, material, price and compatibility, those are your facets, labelled in their words, in the order they decide them. Bad filters mirror the database: every attribute ever recorded, including options that return nothing, internal codes, and distinctions no shopper makes. Show counts only if they are accurate, keep selected filters visible and removable, never let a combination silently produce an empty page without a recovery route, and make the whole system work comfortably on mobile, where most filtering now happens under time pressure.
Choose facets from real decisions
Start with support questions, search refinements and returns. If buyers keep asking whether an item fits a specific model, compatibility is a facet. If returns happen because a material was misunderstood, material deserves prominence. Limit the visible set to the decisions that separate most products in that category; less common attributes can live on product pages. Different categories need different facets, so a single global list copied everywhere will be wrong somewhere. Review per category, using the category page as the map of what choosing means there.
Counts, empty options and dead combinations
Counts help when they are true, because they tell the visitor whether a route is worth taking. Hide or clearly disable options that return nothing in the current selection, rather than letting the visitor discover emptiness by tapping. When several filters combine to nothing, say so at once, show which filters are active, and offer to remove the most restrictive one. That recovery is the filter version of a good zero-results page. An empty filtered page with no explanation reads as a broken store, even when the logic underneath is working exactly as built.
Design filters for the phone first
On mobile, filters usually hide behind a button, which creates three duties. The button must be obvious and say how many filters are active. The panel must let the visitor apply, clear and close without losing their place in the list. And applying a filter must return them to updated results, not to the top of a page they must re-scan from nothing. Test with long lists, sticky panels and a real thumb. A filter set that works in a desktop sidebar can become the main reason mobile visitors abandon a large category.
Order and label like a shopper
Put the deciding facet first: size before colour where fit decides, compatibility before finish where fit is absolute. Label values in shopper units and words, not internal codes, and keep the same label on the filter, the product card and the product page. If a term needs explaining, explain it once, briefly, beside the facet. Inconsistent units are a quiet killer: a visitor filtering by one measurement system and reading another on the product page cannot trust either. Consistency across the cluster is what turns separate pages into one navigable store.
Prune filters as ranges change
Facets decay. A discontinued size stays listed, a new material never gets a value, a seasonal attribute lingers all year. Add filter review to the same seasonal pass as categories: run each major facet, check for empty options, missing values on new products and labels that no longer match the product pages. Fewer, accurate filters beat a complete-looking panel that lies in small ways. The standard to hold is simple enough to say to a customer: every option shown returns products, every label means the same thing everywhere, and clearing everything is always one obvious move.
Sources and evidence on the record
- Baymard Institute, research blog - published findings from its checkout and product-page usability studies.
- Baymard Institute, baymard.com - large-sample usability research on ecommerce product pages, carts and checkout.
- W3C, Web Content Accessibility Guidelines - the accessibility standard behind the form, error-message and mobile guidance.
Evidence basis: Method guide. Any figure quoted is attributed to a named published source listed below; worked examples are labelled illustrations with round numbers, not measurements. Applies when: A category or search result set is too large to scan comfortably without narrowing