Главная страница

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

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


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


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



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


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


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


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


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


Как исправить: Проверить сохранение выбранных пользователем критериев фильтрации и при возврате не обнулять выбранные значения.
rezultat primeneniya filtra.jpg Результат применения фильтра


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



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


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


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


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

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


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


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


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

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

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

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


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

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



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

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

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


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

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

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

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

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

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

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

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


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


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


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


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



Подпишитесь на обновления, чтобы быть в курсе!

Оцените статью:

( 3 оценок, средняя: 3.56 из 5 )

Новые кейсы и лайфхаки еще впереди. Подпишитесь на обновления, и узнавайте все первыми. Это бесплатно!

Адрес подписки уже существует. Пожалуйста укажите другой адрес.

Указать другой

На ваш почтовый адрес отправлено письмо для подтверждения подписки.

Если вы ещё не являетесь пользователем AskUsers,
но хотите улучшить свой сайт, то просто зарегистрируйтесь.

Хочу попробовать