Consider ‘Promoting’ Important Product Filters (80% Don’t)

During usability testing of how users navigate e-commerce sites we found that users generally see categories, placed inline as part of the page content, as something the site suggests they select – whereas the traditional filtering sidebar options are perceived by most users as purely optional choices.

We observed that this user perception can cause issues when categories are too broad yet have a structure that makes them unsuitable as sub-categories. This typically results in users exploring product lists where the majority of products don’t match their purchase intentions, making it needlessly difficult for them to find the products they were looking for – often despite filters being available which would have produced much more relevant product lists. Most sites therefore have a number of categories where a select group of “highly important” filters or filter combinations should be “promoted” (i.e. highlighted in a way that encourages users to select them).

During testing a clear pattern emerged for how sites can effectively promote a single set of highly important product attributes. The tested sites that promoted a set of filters as center content, right at the top of the product list, were able to avoid the issue where users spend a large part of their time browsing product lists that are much too broad. For example, a broad category of “Jeans” could consider promoting a “Fit” filter (wide/regular/slim), or a “Laptops” category could promote “Chromebook/Touchscreen/Size” filters (as seen at Walmart above).

Yet, our Product List & Filtering usability study revealed that of the 50 largest US e-commerce sites 80% do not utilize this simple technique for promoting important filters. Instead, 56% of those sites end up over-categorizing and implementing these attributes as sub-categories – sometimes in an well-intentioned attempt to increase the exposure of these important product attributes.

In this article we’ll present our usability test findings on how sites can effectively promote particularly important filtering values, to avoid the tendency to over-categorize product lists. The article will be rounded off with 4 important implementation details to watch out for when promoting filtering values.

Promoting Important Filtering Values

Displaying filters in a traditional filtering sidebar runs the risk of users overlooking these options. For the most part this is not an issue as most filters truly are secondary and only need to be discoverable to users actively looking for them. However, for some categories, making an initial filter selection is very important to a user’s ability to further navigate the product list in a meaningful way.

For example, if a user navigates to a “Digital Cameras” category, a highly important filter type would be “Camera Type”, with filtering values such as “Point & Shoot”, “DSLR”, “Mirrorless”, and “Bridge”, as the camera type will be important to the majority of users’ product selection process. This makes the “Camera Type” an ideal candidate for a promoted filter because it represents a highly relevant selection to the user but, at the same time, shouldn’t be implemented as sub-categories (see prior article on over-categorization). It’s important to underscore that just because something is technically a filtering value doesn’t mean it can’t be “promoted” in the same way an important category would be promoted.

Other examples of highly important filters for broad product categories that one may consider promoting include:

• “Jackets” could promote a “Style” or “Seasons” filter
• “Jeans” could promote a “Fit” filter (wide/regular/slim)
• “TVs” could promote an “LED/LCD/Plasma” filter
• “Laptops” could promote a “Notebook/Chromebook/Ultrabook/Touch” filter

We observed during testing that for these types of categories, with highly important product attributes, nudging users to consider applying these as filters increased the overall success rate for locating their desired products. Promoting such filters at the top of the product list significantly reduced the number of test subjects who got off to a bad start, as the subjects generally avoided spending time exploring a product list where the majority of products didn’t match their purchase intentions, only to realize late in the process that filters would have to be applied to produce a meaningful list.

4 Implementation Details for “Promoting” Filters

During testing four design details proved particularly important to achieve a good performance with users when implementing promoted filters:

1) Keep the promoted filtering values in the filtering sidebar in addition to at the top of the product list. As more savvy users are generally trained to find filtering values in a left-hand sidebar, any “promoted” filtering values must always be represented in the sidebar as well, since the sidebar filtering list will otherwise be incomplete.

This is particularly important because the promoted filtering values may just be a subset of the full selection of filtering values. Also, note that sometimes the best filtering values to promote are a combination of different filtering types, allowing the user to apply multiple relevant filters with just a single selection.

2) Never promote filters using banner-like graphics. A few sites had promoted filters that were visually boxed. This caused some of the test subjects to completely overlook these promoted filters, even when they contained the very filter type the subjects were looking for – mainly due to “banner blindness”. Other subjects had difficulties understanding that these “banners” weren’t just one large hit area, but contained multiple smaller hit areas.

It’s therefore recommended to style promoted filters as buttons or links (possibly with a thumbnail), rather than as a banner, to indicate they are functioning as filters for the product list.

3) When promoting filters, it becomes even more important that any applied filtering values are displayed both in the original sidebar position and in an “applied filters overview” at the top of the product list (as seen above at Macy’s). This is important when promoting filters since users clicking a promoted filter atop the product list are now trained to apply filters here, and some will therefore naturally look in this area for deselecting the filter – therefore if the applied filtering value is only shown in a sidebar, which may be several viewports down the page, refinding and deselecting it becomes needlessly difficult.

In practice this often means displaying both any general/non-promoted filtering values which are already applied, and the promoted filtering values at separate sections at the top of the product list. If one of the promoted filtering value is selected, the entire promotion may be removed. Or for a simpler logic, consider removing the promoted filtering values once any filter is applied. (Tip: For a much deeper exploration on this topic, see our article on how to design ‘applied’ filters.)

4) Adjust the visual styling of the promoted filters to match the relative importance of applying them. For important-but-not-all-out-critical-filters, use a less visually dominant styling, such as text links. Then, as filter importance increases, gradually increase their visual dominance too, styling them as buttons, and possibly even including small thumbnails for absolutely vital filters. Having different degrees of visual styling for the promoted filters that correlate to the importance of selecting them helps provide the appropriate amount of “encouragement” for users to select one.

A Balancing Act

As promoting filters will encourage and persuade users to apply them, the technique should be used intelligently and sparingly, to avoid luring users into overly narrow filtered lists. In other words, filters should only be promoted when the product list is so extensive that the majority of users are better off applying a filter before devoting any significant attention to the actual product list.

The “return” of applying one of these filters has to justify the “cost” of bringing the majority of users to a stop when navigating the product list. For example, the filter promotion technique shouldn’t simply be used site-wide for whatever happens to be the most popular filters in each category, since not all categories will have “highly important” product attributes that must be defined for users to meaningfully browse the available products.

It will typically require manual human evaluation of each category to determine if it warrants promoted filters, and if so, to determine which specific filtering values should be promoted. Lastly, sites that have only a small number of filters (like apparel sites) may consider using a horizontal filtering toolbar as an alternative to promoted filters.

This article presents the research findings from just 1 of the 580+ UX guidelines in Baymard Premium – get full access to learn how to create a “State of the Art” e-commerce navigation experience.