Filters and Faceted Search: When to Use Them and How to Show What Is Applied

Filters exclude results and faceted search combines several by category. When to use each one and how to show applied filters on desktop and mobile.

info Quick Definition

A filter is a criterion that excludes items from a list, such as “size M only” or “under 500.” Faceted search combines several filters grouped into categories, called facets, to describe a set of content precisely. Both help when a list is long, but each carries different design costs.

NN/g explains it with two simple definitions: a filter analyzes a set of content to exclude items, and faceted navigation is made up of several filters that together describe a set of content (NN/g: Filters vs. facets).

In practice, “color: blue” is a filter. “Color” is a facet, because it groups every possible color. Faceted search is the set of facets that can be combined: color, size, price, and material, for example. Facets are more flexible, but they also require well-organized data.

When is each one the right choice?

NN/g warns that faceted navigation is significantly more expensive to create and maintain, and that it adds interaction cost. A simple filter is often easier to understand and faster to use. Its advice is to confirm that people need facets before you build them.

Situation	Best fit
Few categories and clear attributes	A simple filter or a category list
Many attributes that people combine	Faceted search
Catalog with technical specifications	Facets with units visible, such as width or capacity
Visual catalog, such as clothing or furniture	Facets by color, material, or style, with visual swatches

If most people use only one or two options, a full faceted search can be noise. Look at what people actually combine before you decide.

What should you show about applied filters?

This is one of the most overlooked points. Baymard recommends an overview of applied filters on both desktop and mobile. Without it, people lack confirmation of which filters are active, lack a quick way to remove them, and lose the context of the list. In Baymard’s benchmark, 28% of sites show no overview (Baymard: How to design applied filters).

Some practices Baymard describes:

On desktop, the overview can sit above the list, above the filter sidebar, or below a horizontal filter bar. Baymard found the testing inconclusive on which placement is best.
On mobile, a horizontally scrolling list with the last filter cut off halfway (or faded at the edge) to signal that more exist, or stacked rows that truncate after one or two rows and offer a “See all applied filters” button. Baymard recommends combining cues: the visual cut-off, a count, and a text label such as “4 filters applied.”
A number alone is not enough. Baymard advises avoiding a display of only the number of applied filters: with “Filter (3),” people must open the filter interface to see or remove what they chose.
Include the filter type in catalogs with specifications, such as width or height. For visual catalogs, such as color or material, the name often adds nothing.
Keep the chosen option in place. Baymard reports that 97% of the sites in its benchmark keep the selected option in its original position within the filter list, and that the earlier problem of options disappearing did not recur.

Which filters should you promote?

On mobile, many filters are hidden until the person opens a separate screen. That forces repeated trips between the list and the filter screen. Baymard recommends promoting above the list the filters that help most people. It gives no fixed number: it says there is no one-size-fits-all set, and that typically only two or three fit on a single mobile line. In its benchmark, 61% of sites promote no filters at all (Baymard: Promoting product filters).

Promoted filters should appear twice: in the highlighted spot and in their regular place in the filter interface, because people expect to find them there. Baymard also suggests showing the number of matching products for each promoted filter and using them “intelligently and sparingly”: do not apply the most popular filter across the whole site, promote filters only on very large lists, and check that each one produces a useful filtered list rather than a siloed subcategory.

What happens with combinations that return nothing?

It is a frequent failure: a person applies five filters and the list is empty. The sources cited here do not cover this case, so what follows are common design practices, not findings from that research. They connect to recovery from searches with no results:

Disable, or mark as having no results, the options that produce no products with the current filters.
Show how many results remain when each option is chosen, so the person understands the effect before applying it.
Offer a way to remove one filter without losing the others.

When should you NOT build faceted search?

If the catalog has only a few dozen products, a sorted list is usually enough.
If the facet data is not clean, every filter will show inconsistent results. Clean the data before the interface.
If the team cannot maintain the facets, a list with simple search is more honest than a filter system that keeps breaking.

Illustrative example

Illustrative example: a bicycle store has 400 models with size, weight, brake type, color, and price. The earlier version used one dropdown with all the filters mixed together, and the important ones were hard to find. The redesign highlights three filters above the list: type, size, and price, each with its count. On desktop, the applied-filters overview sits above the list. On mobile, the applied filters are scrollable chips and the remaining facets live on a separate screen. When a combination returns no bikes, the options with no results appear dimmed with a note. The team measures how long people take to reach a model and how many empty lists appear, to check whether the change works.

If the list shows comparable specifications, review how they are organized in data tables. And to understand why people lose their thread when several options change at once, cognitive load explains the cost of deciding with too much information.

Common mistakes

Building faceted search without confirming that anyone needs it.
Showing only a count of applied filters without naming them.
Hiding the most-used filters behind a menu on mobile.
Leaving options that produce empty lists with no warning.
Changing the order of options every time a filter is applied.
Mixing filters and facets in a single list with no hierarchy.

What you can do tomorrow

Open the listing with the most filters and count how many clicks it takes to reach a result with three criteria.
Check whether the applied-filters overview exists on desktop and on mobile, and whether it lets you remove one filter without losing the others.
Pick three filters to highlight above the list based on what people actually use, not on what the team assumes they use.

Sources

Frequently asked questions

What is the difference between a filter and a facet?

A filter is an individual criterion that excludes items, such as ‘blue’ or ‘32 GB’. A facet is a category of filters, such as ‘color’ or ‘memory’. Faceted search combines several facets to describe a set of content.

When is faceted search worth it?

When content has many attributes that people need to combine. NN/g warns that facets are more expensive to create and maintain, and that a simple filter is often easier to understand. Confirm people need facets before building them.

Where should applied filters appear?

Baymard recommends an applied-filters overview on both desktop and mobile, because without it people lose confirmation and a quick way to remove filters. On desktop, Baymard did not conclude which placement is best.

How should filters appear on mobile?

As a horizontally scrolling list or stacked rows, with cues that more filters exist, such as a cut-off last item and a text label like ‘4 filters applied’. Baymard advises against showing only a number such as ‘Filter (3)’.