Optimize ecommerce product filtering

Contributors

@andreea-macoveiciuc-content-expert


Business Benefits

Solve UX issues by making product filtering as useful as possible.


Display the number of products that fall under each filter.

For example, a 156 styles found text when selecting red, purple, and size 6 filtering options. Update filter counts each time that a new filter is applied.

Hide filtering options automatically if they yield no results.

For example, once striped summer dresses in size small is selected, only show the colors available for that size. Don’t even give the option of, for example, red and white or red and white if these are not available.

Use filters with multiple options available to allow customers to compare products.

This would allow filtering colors like red and white at the same time.

Use check marks or a greyed box, or display a list above the filtering options, to show what filters are currently applied.

Allow removing current filters with one or two clicks. Add icons to clarify options especially when jargon is used, for example, classic wayframe and browline for eyewear frame shapes.

Use large filter buttons on mobile to avoid zooming in and out and use nested subcategories to narrow down the filtering in steps.

Include an option See All Products to let the user opt out of the filtering process at any stage. Once they end up with a list of products, you can allow sorting by best match, price, or even apply more filters to narrow in on something further.

Display the less popular filters collapsed by default if there are too many of them, by not showing their filtering values.

This will make the filtering look less overwhelming.

Add filters specific to your audience or product catalog.

Compare and make more useful and helpful filters than your competitors. You can personalize filters for categories. Some filters are important for some categories, but not for others.

Display ten or fewer filtering values to avoid in-line scrollable areas.

Ask developers to build a URL for filtered results or have them add a canonical tag if there is already an URL for a category page.

It’s important to consider SEO implications when adding filters.

Optimize filtering for speed to return the content quickly as new filters are applied.

The time it takes for your products to load after a new filter is applied is crucial. If it’s slow, you’re just discouraging visitors from using the filters.

The image could be better

@Daniel Castro I also think the image is fine here and explains the purpose of the step well. Please feel free to suggest a better alternative.

Really? I thought they were pretty clear icons. I guess they could have been displayed larger and without the checkboxes? What did you have in mind?