{"id":82104,"date":"2021-09-06T10:09:00","date_gmt":"2021-09-06T17:09:00","guid":{"rendered":"https:\/\/thegood.com\/?post_type=insights&p=82104"},"modified":"2025-05-15T12:48:21","modified_gmt":"2025-05-15T19:48:21","slug":"ecommerce-product-filters","status":"publish","type":"insights","link":"https:\/\/thegood.com\/insights\/ecommerce-product-filters\/","title":{"rendered":"25 Ecommerce Product Filters With UX Design Strategies"},"content":{"rendered":"\n

Ecommerce product filters are key tools to help your visitors discover products that meet their needs. But poorly optimized filters can drive visitors away from your site instead of securing more sales. <\/p>\n\n\n\n

At The Good, we\u2019re often amazed to discover product filters working against the business, not for it. The incredible part is that while fixing the problem takes focus and planning, it\u2019s not all that difficult and can produce powerful results.<\/p>\n\n\n\n

In fact, when smart filter design is in place, the user experience (UX) is pleasant and helpful. And if you carry more than a few items or product categories, filtered navigation is essential to helping your visitors narrow their product search.<\/p>\n\n\n\n

In this article, we are going to explain the importance of using product filters, offer some filter design strategies, and show you how we helped one brand earn a 5.97% lift in conversions by optimizing their filters. If you\u2019re an ecommerce manager or similar, this topic is essential reading.<\/p>\n\n\n\n

Get more of our ecommerce growth and optimization insights by signing up for our weekly emails<\/a>.<\/p>\n\n\n\n

Why Use Product Filters? <\/h2>\n\n\n\n

Product filters help visitors quickly sort through your product collection to zone in on products they need. Think of filters like tightly-focused, super-helpful search engines that guide visitors deeper into your product catalog. If a customer wants a red T-shirt, for instance, a proper filter would let them view a collection of products that meet the attributes of \u201cT-shirt\u201d and \u201cred.\u201d<\/p>\n\n\n\n

But filters don\u2019t just help visitors find products they already know they want. Filters are a key component of product discoverability<\/em>, which is visitors\u2019 ability to browse, research, and choose products in a seamless, friction-less manner. This makes them an integral to marketing as well as to sales.<\/p>\n\n\n\n

Let\u2019s check out the definition of findability vs discoverability from Nielsen Norman Group<\/a>: <\/p>\n\n\n\n

“Findability: Users can easily find content or functionality that they assume is present in a website.<\/p>\n\n\n\n

Discoverability: Users encounter new content or functionality that they were not aware of previously.”<\/p>\n\n\n\n

So filters serve both of these key purposes. Users can both discover products they didn\u2019t know they were interested in AND find what they are looking for depending on how they hope to use the site.<\/p>\n\n\n\n

(The site search bar is another critical piece of product discoverability.)<\/p>\n\n\n\n

What happens if your product filters are poorly optimized? Some visitors will fail to find products that meet their needs and leave your store. Ultimately, this will reduce your conversion rate and disrupt your bottom line. <\/p>\n\n\n\n

Sadly, most ecommerce sites fail to use product filters well. According to research by the Baymard Institute<\/a>, only 16% of major ecommerce sites provide a good filtering experience. 42% of those sites don\u2019t have category-specific filter types for their main product categories and 20% lack thematic filters (season, style, etc.) despite selling products with obvious thematic qualities. <\/p>\n\n\n\n

Look at Apple\u2019s site, for instance. The homepage filtering at the bottom is rather plain and user-unfriendly. Would you say one of the world\u2019s premier tech firms fails with filters?<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Ecommerce Product Filter Types<\/h2>\n\n\n\n

How should you set up your product filters? It\u2019s important to keep in mind that product filtering is contextual. The right combination of filters depends on your product catalog, visitor preferences, and other factors. Your combination of filters will be unique to your store. <\/p>\n\n\n\n

For instance, if you sell lawnmowers, it makes sense to offer a filter for \u201cyard size.\u201d But that filter wouldn\u2019t be appropriate on an ecommerce site that only sells pool toys. So to a certain extent, you’ll need to decide which product filters are right for your store.<\/p>\n\n\n\n

That said, there are some common product filters that are appropriate on most e-commerce sites. These are the best filters for most stores:<\/p>\n\n\n\n

    \n
  1. Brand (but not if everything you sell is from the same brand)<\/li>\n\n\n\n
  2. Price<\/li>\n\n\n\n
  3. User ratings<\/li>\n\n\n\n
  4. Color<\/li>\n\n\n\n
  5. Material<\/li>\n\n\n\n
  6. Size<\/li>\n\n\n\n
  7. Theme (e.g. season or occasion)<\/li>\n\n\n\n
  8. Popularity<\/li>\n\n\n\n
  9. Promotion (e.g. new, featured, or on sale)<\/li>\n<\/ol>\n\n\n\n

    Note: Those are just filters examples. You may not need them all. <\/p>\n\n\n\n

    One quick side point: The terms \u201cfilter\u201d and \u201cfacet\u201d are often used interchangeably, but it\u2019s worth understanding the difference. \u201cFilter\u201d means to exclude items that don\u2019t meet a criteria. Technically, if you select the \u201cgaming PC\u201d filter, you\u2019re filtering out everything except<\/em> gaming PCs. <\/p>\n\n\n\n

    \u201cFacet\u201d extends the idea of filters into something more complex that describes aspects<\/em> of an object. Selecting several facets will return a list of results that meet all of those criteria. So if you select \u201cgaming PC,\u201d \u201c1 TB storage,\u201d and \u201cIntel processor,\u201d you\u2019ll get a list of computers that have those three qualities. <\/p>\n\n\n\n

    Epicurious.com uses faceted navigation to let visitors combine filters. This search will return recipes for healthy dinner salads. This type of filtering is common and provides the best user experience.<\/p>\n\n\n\n

    \"\"<\/figure>\n\n\n\n

    Learn more: <\/strong>See Filters vs. Facets: Definitions<\/a> by the Nielsen Norman Group.<\/p>\n\n\n\n

    Product Filter Design Strategies (With 25 Filter Examples)<\/h2>\n\n\n\n

    Whether prospects searching your ecommerce site know exactly what they\u2019re looking for or need some guidance, attention to these strategies will help make sure their experience on your site is geared towards helping them buy. We\u2019ll also provide UX filter examples to illustrate the points given.<\/p>\n\n\n\n

    1. Keep your product filters simple<\/h3>\n\n\n\n

    This is the number one rule for product filter design. The easier they are to identify and operate, the better your visitors will like them. Use filters that are reasonable and intuitive. Don\u2019t create extra filters just to have more. It\u2019s fine if you only need three or four.<\/p>\n\n\n\n

    \"ecommerce<\/figure>\n\n\n\n

    2. Think before you start<\/h3>\n\n\n\n

    Ecommerce filter design work can get complicated in a hurry. Plan yours carefully before you begin. Time invested here can pay off big in the development phase.<\/p>\n\n\n\n

    For instance, Zalora knows that sunglass buyers care about shape more than any other attribute, so they provide a filter to sort by shape and make it prominent in the filter menu. <\/p>\n\n\n\n

    \"Zalora<\/figure>\n\n\n\n

    3. Test as you develop <\/h3>\n\n\n\n

    A filtering system that makes sense to the design team may not play well in front of a live audience. Test early and test often. The sooner you catch problems, the easier they are to solve.<\/p>\n\n\n\n

    Learn more: <\/strong>Read our full guides on User Testing and A\/B<\/a> testing to learn how to measure the effects of your website and conversion rate changes. <\/p>\n\n\n\n

    4. Consider your products from the viewpoint of your customers <\/h3>\n\n\n\n

    What information do your customers need in order to make a wise purchasing decision? What do your customers desire? Do they favor certain colors over others? Do you see seasonal jumps in certain product attributes?<\/p>\n\n\n\n

    Solicit help from your staff, specifically customer service representatives, and your audience to prepare an exhaustive list of product attributes. Leverage your data as much as possible to discover what your customers care about. <\/p>\n\n\n\n

    5. Use the words your customers use to describe your products <\/h3>\n\n\n\n

    Avoid industry jargon and branding terms. Your ecommerce product filters should be absolutely practical and common sense. Don\u2019t make customers struggle to find exactly what they\u2019re looking for.<\/p>\n\n\n\n