Фільтри каталогу
Фільтри каталогу (фасетний пошук, faceted search) — це набір параметрів (ціна, бренд, колір, розмір тощо), за якими покупець звужує список товарів. Кожен фільтр складається з категорії (властивість, наприклад колір) і значень (червоний, синій).
Простими словами
Коли в категорії сотні товарів, без фільтрів покупець не знайде потрібне. Nielsen Norman Group пише, що сайти без фільтрів вже виняток, і користувачі скаржаться на їх відсутність (NN/g). У першому дослідженні NN/g 27% невдалих спроб були через те, що користувач не знайшов підходящого товару, хоч він був на сайті.
Яким має бути набір фільтрів
NN/g формулює критерії хороших фільтрів (NN/g):
- Доречні. Покриті аспекти, які справді важливі для вибору. Бренд, ціна й колір — лише початок; для взуття потрібен розмір, для пральних машин — місткість барабана.
- Передбачувані. Покупець розуміє, що в категорії. Розмиті назви на кшталт «Тип товару» плутають, конкретніші краще.
- Без жаргону. Внутрішні коди замінюйте простими словами, складні терміни пояснюйте підказкою.
- Впорядковані. Загальні фільтри — угорі, спеціальні — нижче; фільтр, який сильно впливає на вибір, можна підняти вище. Числа — за логікою, слова — за абеткою лише для відомих назв (бренди).
- Побудовані на даних. Основа — інтерв'ю, пошукові запити, питання менеджерів і підтримки, аналітика використання фільтрів, тести назв.
Що показує Baymard
За бенчмарком Baymard на 170+ сайтах (Baymard):
- 51% сайтів не мають усіх п'яти базових фільтрів: ціна, середній рейтинг, колір, розмір, бренд;
- 14% не дозволяють вибрати кілька значень одного фільтра;
- 20% не показують застосовані фільтри списком;
- 69% не мають усіх чотирьох базових сортувань: за ціною, рейтингом, популярністю й новизною;
- під час тестів деякі учасники застосовували 5–6 фільтрів, окремі — до 10.
На мобільних Baymard радить показувати огляд застосованих фільтрів над списком; 66% мобільних сайтів цього не роблять (Baymard).
Як на це дивляться різні джерела
NN/g радить не показувати фільтри, що дають порожню видачу, і зберігати однакову логіку сортування та фільтрації на всьому сайті (NN/g). Baymard додає, що горизонтальна панель фільтрів годиться лише при невеликій кількості типів (в одязі зазвичай близько 8 і менше). У підкатегорій NN/g своє місце: їх краще показувати окремо від фільтрів, над списком (NN/g).
Для українського магазину це приклад: у розділі «Взуття» розмір, сезон і матеріал важливіші за «тип товару»; у техніці — діагональ, обсяг пам'яті, потужність. Дивіться, за якими словами люди шукають на сайті: це готова підказка для назв фільтрів (пошук по сайту).
Типові помилки
- Відсутній фільтр за розміром чи іншою ключовою властивістю.
- Розмиті або «внутрішні» назви.
- Неможливо вибрати кілька значень.
- Застосовані фільтри не видно, зняти їх складно.
- Фото у списку не відповідають вибраному кольору.
FAQ
Що таке фільтри в інтернет-магазині? Параметри, за якими покупець звужує список товарів: ціна, бренд, колір, розмір.
Які фільтри обов'язкові? Baymard називає базовими п'ять: ціна, середній рейтинг, колір, розмір, бренд. Крім них потрібні властивості, специфічні для вашої категорії.
Скільки фільтрів показувати? Чіткої цифри джерела не дають. Загальні — вгору, спеціальні — нижче, перевірте за аналітикою, якими користуються.
Як зрозуміти, які фільтри потрібні? За пошуковими запитами на сайті, питаннями клієнтів до менеджерів і статистикою кліків по фільтрах (NN/g).
Пов'язані терміни
Джерела
- Nielsen Norman Group. Defining Helpful Filter Categories and Values for Better UX — nngroup.com/articles/filter-categories-values
- Nielsen Norman Group. The State of Ecommerce Search — nngroup.com/articles/state-ecommerce-search
- Nielsen Norman Group. UX Guidelines for Ecommerce Homepages, Category Pages, and Product Listing Pages — nngroup.com/articles/ecommerce-homepages-listing-pages
- Baymard Institute. Product List UX Best Practices 2025 — baymard.com/blog/current-state-product-list-and-filtering
- Baymard Institute. Mobile UX Trends 2026: 10 Best Practices — baymard.com/blog/mobile-ux-ecommerce
Читайте також
Фото й відео товару та AI-генерація
Фото товару — головний спосіб показати покупцеві річ, яку він не може потримати в руках. AI-генерація допомагає зробити фон, ракурс чи ілюстрацію, але має чіткі правила: у Google Merchant Center такі зображення треба маркувати, а в ЄС діють нові вимоги до…
Сигнали довіри
Сигнали довіри (trust signals) — це елементи сайту, які допомагають покупцеві повірити, що магазин реальний, чесний і безпечний для оплати: відгуки, контакти, умови доставки й повернення, візуальні ознаки захисту на формі картки, знайомі способи оплати.
Поріг безкоштовної доставки
Поріг безкоштовної доставки (threshold free shipping) — це правило: доставка безкоштовна, якщо сума замовлення не менша за визначену (наприклад, від 1 500 грн). Для магазину це спосіб підняти середній чек, для покупця — стимул докласти ще один товар.
Структура каталогу інтернет-магазину
Структура каталогу — це те, як товари розкладено по категоріях, підкатегоріях, фільтрах і адресах сторінок. Вона відповідає на два питання: чи знайде покупець потрібне за кілька кліків і чи розуміє пошуковик, які сторінки важливі.