Фильтр товаров на сайте работает сразу на двух фронтах: покупателю он должен за секунду сузить каталог, а поиску - не наплодить тысячи почти одинаковых адресов. Чаще всего проваливается либо одно, либо другое, и лечится это по-разному.
Магазин на 300 позиций живёт без фильтра нормально. На 3 000 позиций без него уже не купить: человек листает четвёртую страницу, не находит нужный размер и уходит. При этом тот же фильтр за пару месяцев сдаёт поисковику десятки тысяч адресов, отличающихся только порядком параметров.
Какими фильтрами пользуются, а какие висят для вида
По данным Метрики на магазинах, которые мы ведём, картина примерно одинаковая от ниши к нише.
| Фильтр | Доля сессий с фильтром | Что важно |
|---|---|---|
| Наличие на складе | 40-60% | Часто включён по умолчанию, и это правильно |
| Цена | 35-50% | Ползунок должен знать реальный минимум и максимум выборки |
| Бренд | 20-40% | Работает там, где марка сама по себе критерий выбора |
| Ключевое свойство ниши | 20-45% | Размер, диаметр, объём, мощность, совместимость |
| Прочие свойства | до 5% каждое | Держать под кнопкой, а не в открытом списке |
Вывод простой: 4-6 блоков решают почти всё. Остальные двадцать свойств из выгрузки 1С нужны единицам и открытыми только удлиняют колонку. Мы оставляем видимыми наличие, цену, бренд и одно-два свойства ниши, остальное прячем под "Все параметры".
Отдельная история - параметры, названные не так, как их называет покупатель. В магазине крепежа фильтр по классу прочности болтов нажимали 0,8% посетителей, зато в поиске по сайту тот же параметр вводили вручную регулярно. Как это ловить, разбирали в статье про поиск по сайту.
Правила интерфейса, которые снимают отказы
Показывать число товаров у каждого варианта. "Синий (14)" честно говорит, есть ли смысл нажимать. Без счётчиков человек тыкает наугад и половину нажатий получает пустую страницу.
Не давать пустых выдач. Варианты, которые в текущей выборке дают ноль товаров, гасим или прячем. Пустая страница с надписью "Ничего не найдено" - самая частая точка выхода из каталога.
Сохранять выбор. Покупатель открыл товар, нажал "назад" и должен вернуться в ту же отфильтрованную выдачу и на то же место списка. Сброс выбора на этом шаге раздражает сильнее, чем медленная загрузка.
Мобильный фильтр - отдельный экран. Боковая колонка на телефоне не работает. Нормальная схема: кнопка "Фильтр" в шапке каталога, полноэкранная панель, внизу липкая кнопка "Показать 34 товара" с живым счётчиком.
Видимый сброс. Выбранные значения показываем плашками над списком товаров, каждую с крестиком. Искать нажатый чекбокс в свёрнутом блоке никто не будет.
Ту же логику "не терять человека на полпути" мы применяем и дальше по воронке, в корзине интернет-магазина: там цена ошибки ещё выше.
Почему фильтр тормозит
Типичная картина на каталоге в 15-20 тысяч позиций: нажатие на чекбокс отрабатывает 3-4 секунды. Причины почти всегда из этого списка.
- Свойства товаров хранятся построчно, по записи на каждое значение, и запрос собирает выборку через несколько соединений таблиц.
- На поля, по которым идёт отбор, не заведены индексы, и база перебирает всю таблицу целиком.
- Количество товаров у каждого варианта считается отдельным запросом. Тридцать вариантов - тридцать запросов на одно нажатие.
- Фильтр отдаёт всю страницу заново вместо обновления списка товаров.
На магазине автозапчастей выборка по трём параметрам занимала 3,8 секунды, из них 2,9 уходило на подсчёт счётчиков. После переноса счётчиков в предрасчитанную таблицу время упало до 0,4 секунды, а код самого фильтра почти не менялся.
Что чинить в первую очередь
- Индексы в базе. Самый дешёвый шаг: посмотреть план запроса и закрыть индексами поля отбора. Часто этого хватает, чтобы уйти с секунд на десятые доли.
- Плоская таблица свойств. Для каталога, где свойства меняются редко, заводим денормализованную таблицу "товар - значения фильтруемых свойств" и обновляем её при импорте. Выборка идёт по ней, а не по общей структуре.
- Предрасчёт счётчиков. Количество товаров по каждому значению считаем заранее, а не в момент нажатия.
- Кэш популярных комбинаций. Первые 20-50 сочетаний обычно дают больше половины запросов к фильтру. Их результат держим готовым и обновляем при изменении остатков.
- Обновление без перезагрузки. Меняем только список товаров и счётчики, шапку и меню не трогаем.
Общие приёмы ускорения страниц каталога, от картинок до кэша, разбирали отдельно в материале про то, как ускорить сайт.
Откуда берутся десятки тысяч мусорных страниц
Каждое сочетание параметров даёт свой адрес. Пять фильтров по десять значений в каждом - это уже сотни тысяч теоретических комбинаций, и робот с удовольствием обойдёт все, до которых дотянется по ссылкам.
Реальный случай: магазин сантехники пришёл к нам с 41 тысячей страниц в индексе Яндекса при 6 тысячах товаров. Робот тратил обход на комбинации вида "цвет + производитель + сортировка по цене", а карточки новых товаров попадали в индекс через три-четыре недели.
Симптом виден в Вебмастере без всякой аналитики: загруженных страниц в разы больше, чем товаров, а в исключённых массово стоит пометка про дубли.
Какие комбинации превращать в посадочные страницы
Не всё, что генерирует фильтр, мусор. Часть сочетаний - это готовые запросы с реальной частотностью, и под них имеет смысл делать полноценные страницы. Критерии отбора у нас такие:
- Есть спрос. Запрос вида "японские кухонные ножи" собирается в Вордстате и имеет заметную частотность в регионе.
- Есть товары. В выборке не меньше 8-10 позиций, и они не исчезнут через месяц при смене остатков.
- Есть что написать. У страницы свой заголовок, описание на 700-1500 знаков и свои мета-теги, а не текст родительской категории.
- Глубина не больше двух параметров. Комбинации из трёх и более свойств почти никогда не имеют спроса.
Такие страницы получают человекопонятный адрес вида /katalog/nozhi/kuhonnye-yaponskie/, попадают в карту сайта и конкурируют в выдаче наравне с обычными разделами. По нашим магазинам 30-60 таких страниц дают заметную долю поискового трафика каталога: они закрывают запросы, под которые в структуре просто нет раздела.
Подробнее про приоритеты работ в каталоге писали в разборе SEO для интернет-магазина.
Что закрывать от индексации и чем
Всё, что не стало посадочной страницей, из индекса убираем.
Канонический адрес. На любой странице фильтра ставим ссылку на родительскую категорию. Исключение - те самые отобранные посадочные, у них канонический адрес указывает на себя.
Сортировки и режимы показа. Порядок вывода и переключатель "плиткой или списком" новой страницы не создают и всегда уходят под канонический адрес категории.
Служебные параметры в Яндексе. Метки рекламы, идентификаторы сессий и переключатели вида задаются в Вебмастере через директиву очистки параметров, чтобы робот считал такие адреса одной страницей.
Ссылки на комбинации. Проще всего не давать роботу дороги: варианты фильтра отдаём так, чтобы обычные ссылки для обхода из них не строились, а переходы шли запросом к серверу.
Чек-лист приёмки фильтра
Прогоняем перед сдачей магазина и при аудите чужого.
- Нажатие на любой фильтр отрабатывает быстрее секунды на каталоге целиком.
- У каждого варианта показано число товаров, и оно верное.
- Варианты с нулевым результатом погашены или скрыты.
- Пустая выдача невозможна, а если случилась - предлагает снять последний фильтр.
- Возврат из карточки товара сохраняет выбор и позицию прокрутки.
- На мобильном фильтр открывается отдельным экраном с липкой кнопкой применения.
- Ползунок цены знает реальные границы текущей выборки.
- Адрес страницы фильтра читаемый и не зависит от порядка нажатий.
- У всех непосадочных комбинаций канонический адрес ведёт на категорию.
- Сортировки и служебные параметры не создают отдельных страниц в индексе.
- Список посадочных страниц согласован с семантикой, у каждой свой текст и мета-теги.
- Число страниц в индексе сопоставимо с числом товаров плюс категории, а не больше в разы.
Итог для владельца магазина
Фильтр стоит проектировать с двух сторон сразу. Покупателю нужны счётчики, отсутствие пустых выдач, сохранение выбора и отдельная логика на телефоне. Технике - индексы, плоская таблица свойств и предрасчёт вместо счёта на лету. Поиску - несколько десятков отобранных комбинаций как посадочные страницы и закрытие всего остального каноническими адресами. Фильтр, сделанный только для покупателя, рано или поздно раздувает индекс, а сделанный только под поиск даёт каталог, из которого уходят.
Что входит в работы по каталогу и фильтрам, из каких этапов это складывается и сколько занимает, расписано на странице интернет-магазины.
