Блог IS ART / Разработка сайтов

Фильтры каталога: как согласовать данные и интерфейс до разработки

Обложка статьи «Фильтры каталога: как согласовать данные и интерфейс до разработки»

Фильтры часто рисуют до того, как собраны данные. На макете это выглядит убедительно, но при наполнении появляются пустые значения, разные названия одного свойства и сочетания без результатов. Мы рекомендуем начинать с образцов товарной базы. Интерфейс фильтрации должен отражать данные и способ выбора покупателя, иначе доработки перемещаются на поздний этап.

Опишите свойства и правила заполнения

Для каждого поля нужны название, тип значения, единицы измерения и источник. Цвет может быть справочником, размер — числом или диапазоном, назначение — несколькими вариантами. Если всё хранится произвольным текстом, одинаковые товары легко оказываются в разных группах.

Проверьте небольшой, но разнообразный набор товаров. Включите позиции с неполными данными, несколькими вариантами и нестандартными параметрами. Именно они показывают, насколько схема пригодна для реального каталога. Правила нормализации стоит утвердить до импорта и передать людям, которые будут добавлять новые позиции.

Пример решения: Stoneberi

В опубликованном проекте Stoneberi присутствуют критерии цвета, материала, толщины, текстуры и другие свойства камня. Такой интерфейс требует согласованного описания ассортимента: посетитель должен одинаково понимать критерий в фильтре и карточке образца.

На основе этого примера можно сформулировать практический тест: выбрать цвет и материал, открыть карточку и проверить соответствующие значения. Затем снять ограничение и убедиться, что пользователь понимает изменение подборки. Это сценарий приёмки, а не утверждение о внутренних механизмах хранения данных конкретного проекта.

Учитывайте отсутствие результата

Пустой список не должен становиться тупиком. Покажите, какие ограничения применены, и дайте возможность убрать отдельное условие или сбросить подбор. Не подставляйте произвольные товары под видом точного совпадения. Если доступна консультация, объясните, с каким вопросом можно обратиться.

Отдельно решите, что происходит с выбранными условиями после возврата из карточки. Потеря фильтра заставляет повторять работу. На телефоне проверьте доступность кнопки применения, количество выбранных условий и возможность закрыть панель. Вопросы таких интерфейсов полезно обсуждать вместе с маркетингом каталога, поскольку они влияют на путь к заявке.

Разделите удобство и поисковые страницы

Не каждую комбинацию фильтров нужно превращать в отдельную посадочную. Для SEO-продвижения отбирают содержательные группы с понятным спросом, достаточным ассортиментом и самостоятельным описанием. Технические адреса остальных подборок требуют отдельного решения по индексированию.

  • Проверьте заполнение обязательных свойств на реальных товарах.
  • Исключите дубли справочных значений и неоднозначные единицы.
  • Пройдите сценарий нулевой выдачи и сброса условий.
  • Сохраните понятный возврат из карточки к результатам.
  • Утвердите правила добавления новых товаров.

Хорошая фильтрация начинается с управляемых данных и проверяемых сценариев. Количество переключателей само по себе не говорит о качестве каталога.

Материал опубликованного кейса: Stoneberi — сайт-каталог камня и изделий для интерьера
Иллюстрация из опубликованного кейса «Stoneberi — сайт-каталог камня и изделий для интерьера». Показатели на презентационных экранах не используются как статистика результата.
Обсудим вашу задачу

У вас есть задача которую нужно обсудить с опытным специалистом?

Напишите ваш номер, мы расскажем вам как решить ее