Хороши ли фильтры в вашем интернет-магазине? Давайте разберемся и прокачаем! 5 грубых ошибок

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

Наглядно картину проблем с фильтрами можно представить в виде следующей диаграммы (на основе исследований, проведенных в AskUsers).

Диаграмма с наиболее частыми ошибками по статистике системы.

Наиболее распространенные проблемы при работе с фильтрами

1. Неправильная настройка параметров навигации.

1.1. Посетитель, изучив карточку интересующего его товара, хочет ознакомиться теперь и с другими предложениями. Логика такова, что он пойдет по кнопке «Назад». Но тут сталкивается с проблемой, что кнопка неактивна в принципе. Что делать в такой ситуации? Возвращаться в каталог, или еще хуже, на главную страницу через логотип, чтобы настроить фильтр повторно? Многие посетители просто покинут сайт.

Как исправить: Проверить, что кнопка «Назад» активна и правильно работает, осуществляя пошаговый переход в обратном направлении.

1.2. Та же самая ситуация с возвратом и желанием вернутся к полученной по настройке выборке, но возможен сценарий, при котором кнопка «Назад» хотя и работает, но человек попадает на страницу листинга каталога, а фильтры выбора товаров все сброшены. Снова возникает необходимость повторного их заполнения.

Как исправить: Сделать проверку сохранения выбранных пользователем критериев фильтрации и при возврате не обнулять выбранные значения.

Результат применения настроек фильтра

Кнопка «Назад» возвращает в каталог с выбранными критериями фильтрации

1.3. Ссылка с результатом применения фильтра, открытая на другом устройстве, полностью восстанавливает его состояние

Что происходит и как исправить: После выбора интересующих параметров посетитель хочет узнать мнение и рекомендации друзей. Для этого он копирует из адресной строки интернет-магазина динамически измененный URL и отправляет другому человеку. Проверьте, так ли это в действительности у вас работает - открытая ссылка сайта интернет-магазина на другом устройстве в точности восстанавливает отфильтрованную выборку товаров.

Результат фильтрации.

Скопированная ссылка открыта в новом приватном окне — результат идентичен.

2. Согласование настроек мультивыбора.

Вопрос кроется в использовании логических операторов «ИЛИ» / «И». Необходимо проверить, как функционирует фильтр подбора товарных позиций в интернет-магазине при выборе посетителем одновременно «красных» футболок размера «S» — то ли будут показаны только все «красные» размера «S», то ли все «красные» всех размеров, то ли все размеры «S» любого цвета.

Что происходит и как исправить: В большинстве случаев предпочтительно выводить точный результат фильтрации товаров, что особенно актуально именно для интернет-магазинов с большим ассортиментом, то есть только «красные» размера «S». Этот вариант демонстрирует максимальный коэффициент удовлетворения покупателя. Но и использование второго варианта имеет место быть, если целесообразность такой логики работы фильтра товаров обусловлена спецификой продукции или другими особенностями сайта.

Пример использования оператора «И».

3. Нулевой результат фильтрации или появление сообщения «По вашему запросу ничего не найдено».

Что происходит и как исправить: Нет ничего хуже для посетителя, который выбирал и заполнял критерии подбора, чем получить нерелевантные или нулевые результаты. Поэтому, если по какому-либо критерию фильтрации будет возвращаться значение «0», то его следует исключить из перечня доступных для выбора характеристик товаров в фильтрах продающих сайтов или же визуализировать как неактивный в соответствии с дизайном.

Отсутствие требуемой посетителю продукции даже при разнообразном ассортименте интернет-магазина всегда негативно влияет на его степень удовлетворенности.

Сюда же можно добавить рекомендацию по проверке зависимых полей – если обновляется одно из зависимых полей фильтрации, то и остальные меняют возможный список данных и активность/доступность. Это позволит значительно сократить время посетителя на не целевые действия. На иллюстрации видно, что при выборе «визитниц и футляров» «коричневого» цвета параметр фильтрации «материал» сразу динамически обновляется и поле «натуральная кожа» становится неактивным. При такой настройке посетитель не может выбрать «натуральную кожу» и, следовательно, не получит сообщение об отсутствии подходящей продукции в интернет-магазине.

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

4. Кнопку «Применить фильтр» или «Сбросить» нужно искать на странице.

Что происходит и как исправить:Совершенно очевидно, что данная кнопка действия всегда должна быть в поле зрения посетителя. Это правило должно соблюдаться даже в том случае, когда сам фильтр содержит множество параметров и занимает больше места, чем один экран. Вообще все кнопки действия должны быть хорошо видны и максимально доступны, но об этом мы уже говорили ранее в этих статьях: Как сфокусировать внимание на Call-to-Action и О правилах оформления кнопок.

5. Возможность сброса некоторых параметров отдельно

Что происходит и как исправить: Часто разработчики забывают о необходимости предоставления посетителю возможности сброса только части критериев, размещая только кнопку «сбросить фильтр». В дизайне интернет-магазинов с большим предложением продукции и при использовании множественного фильтра подбора товаров следует для повышения удобства вынести выбранные посетителем критерии фильтрации на отдельную панель с характерным крестиком для отмены учета этого параметра.

Посетитель может в любой момент сбросить любой из выбранных критериев подбора товаров

Немного о технической стороне вопроса

Помимо удобства пользователей, при создании и функционировании фильтров на сайтах по продажам товаров будет полезно учитывать и технические моменты, а также нюансы поисковой оптимизации (SEO):

• При первичном переходе в раздел каталога, URL страниц товаров не должны содержать GET-параметров (стандартное ЧПУ без переменных в адресе).

• Если подгрузка товаров в каталог осуществляется с помощью AJAX, и вы хотите, чтобы такие страницы принимали участие в ранжировании, то проверьте наличие ссылки в исходном коде раздела на эту страницу, специально для Яндекса и Google.

• Несколько SEO-требований:

  1. Страницы фильтрации содержат ЧПУ.

  2. Открыты для индексации.

  3. Имеют уникальные теги h1, Title и meta-теги.

  4. Страницы с пустым содержимым или с малым числом товаров (до 3-5) запрещены к индексации и не имеют входящих ссылок, чтобы не создавать неявные дубли.

Выводы и роль фильтров

Конечно, необходимость в то, чтобы сделать фильтры по характеристикам в сфере e-commerce, а также нюансы их разработки, в первую очередь определяются концепцией сайта, его назначением, ассортиментом и дизайном.

Если же принято решение об их необходимости, следует обязательно учитывать показатели юзабилити и требования SEO. Для этого в сервисе AskUsers имеются типовые вопросы и задания. Правильная организация фильтров подбора продукции по заданным посетителем критериям значительно повысит удовлетворенность потенциальных покупателей и заметно сократит конверсионный путь.

Проверьте работу ваших фильтров прямо сейчас!