VOL. III · CH. 3.22 · COMPONENT
Filters
Letting the user narrow a large set down to exactly what matters to them.
1 min read · 120 words
3.22.1Definition & Anatomy
Filters narrow a list or dataset by user-selected criteria — category, range, status — typically paired with data tables (3.12) or search (3.21) results.
3.22.2Common Mistakes
- No indication of active filter count or an easy way to clear them all at once.
- Filters that silently return zero results with no explanation of which combination caused it.
3.22.3Best Practices
- Always show active filters as visible, removable chips/tags, with a clear "reset all" option.
- Show result counts per filter option where feasible, so users can predict outcomes before applying.
ExampleE-commerce filter sidebars show a live count next to each option ("Blue (14)") so users can gauge impact before clicking, rather than filtering blind and hoping.