Filters are particularly important for stores with over about 50 products.
Advice for your filters:
- Provide category-specific filters in addition to site-wide filters (brand, price, ratings) (read more on this in this Baymard article)
- Have a filter for every product attribute displayed in the product list
- Avoid or offer explanations for industry-specific or ambiguous filters
- Have visual filters if the values are visually driven
- Allow users to combine multiple filtering values of the same type (read more on this on Baymard)
- Auto-update the results (the product list) when a filter value is selected.
- Have thematic filters (e.g. ‘Dress Occasion’ for dresses, with values such as ‘casual’, ‘party’, ‘night out’, and ‘formal’.
- Separate events in browser history for each filter change. Users rely heavily on the back button. They expect it to go back what they perceive as the previous page.
IKEA’s approach to sub-categories and filters in a category page is ‘in your face’. You can’t miss it, and it makes for a clean design for the product list.
However, it pushes down the list of products quite low and you only see two products without scrolling on desktop. It also doesn’t take advantage of larger resolutions. In this case, I’d recommend testing a standard left column (sticky) instead and see what converts better.
I would also test keeping this design but making the filters sticky as you scroll down – and possibly also the categories but in a ‘mini mega menu’ or dropdown like the other filters.