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

Если на веб-сайте содержится большое количество товаров (а на веб-сайтах продающий товары это почти всегда), необходима система фильтрации.

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

Пример корректно реализованной структуры фильтрации на коммерческом проекте:

Что дает Sео-оптимизация страниц фильтров?

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

повышение видимости сайта по группам среднечастотных и низкочастотных запросов за счет оптимизации страниц фильтров под данные запросы;
улучшение поведенческих факторов сайта (увеличение средней длительности пребывания пользователя на сайте, уменьшение показателя отказов и т.д.);
улучшение usability (удобства пользования) сайта (пользователям гораздо легче определиться с выбором товара за счет отобранных характеристик);
повышение конверсии (посетители, пришедшие по низкочастотным запросам, как правило, знают, что им необходимо, а, следовательно, и более настроены на покупку).

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

Пример структурированного каталога:

Фильтры продуктов должны быть работоспособными. Это не значит, что они существуют для того, чтобы сокращать явный избыток предложения как таковой. Они нужны для повышения актуальности результатов. Это то, что нужно пользователю. Фильтры и фасетная навигация в интернет-магазине — это два способа помочь пользователям уточнить свой запрос и узнать больше о предложениях вашего сайта. Позволяя пользователям быстро сужать варианты и достигать того, что они ищут, вы можете повысить коэффициент конверсии и улучшить взаимодействие с пользователем.

Фильтры и фасеты для поиска по сайту

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

Разница между фильтрами и фасетами в поиске

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

При наведении курсора на категорию «Женщины» вы увидите несколько различных вариантов, например «Одежда» или «Свадьба». Каждый из них представляет собой фильтр, который позволяет пользователю быстро сузить весь каталог до одного из этих параметров. Вы можете думать об этом как об онлайн-эквиваленте карты в универмаге, которая говорит вам, на какой этаж идти, чтобы найти женскую обувь.
Фильтры используются в поиске для создания меньшего, более релевантного набора данных на основе крупных категорий на сайте. Фильтр анализирует набор данных, например весь ваш каталог продуктов, и удаляет те, которые не соответствуют выбранным критериям.
Фильтры также могут отображаться на самой странице результатов поиска. Например, если вы ищете определенную тему на веб-сайте Блога RegisTeam, вы можете отфильтровать по определенным датам или тематикам,то что исключает все статьи за пределами этого периода времени или темы.

Фасеты и фасетный поиск

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

Фасеты и фасетный поиск являются частью оптимизированного пользовательского интерфейса. Контекстные аспекты, которые могут меняться в зависимости от элемента или категории, обеспечивают удобство использования, направляя пользователя по кратчайшему пути к наилучшему результату.

Скажем, например, мы должны были продолжить наш шоппинг с сайтом и выбрать женские брюки:

Теперь у нас есть возможность еще больше усовершенствовать наши продукты. В данном случае мы выбираем цвета, размер от 40 до 48. Таким образом, мы можем провести широкий поиск и уточнить его до именно того типа продукта, который мы ищем. Если продолжить метафору универмага, то это эквивалент торгового представителя в отделе женской обуви, который говорит нам, где именно найти повседневные синие и черные туфли 40-го размера.

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

Где можно применять фасетную навигацию?

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

Цена
Бренд
Размер
Вес
Цвет
Вкус
И прочее.

Несколько типов товаров, для которых можно сделать фасетную навигацию:

Электроника (по цене, по бренду, по размеру, по весу, по экрану, по функциям и т.д.)
Автомобили (по цене, по бренду, по типу кузова, по объему двигателя и т.д.)
Стройматериалы (по цене, по бренду, по типу поверхности, по долговечности и т.д.)
Тренажеры (по цене, по бренду, для мужчин / для женщин и т.д.)
И прочее.

Обзор фильтров и фасетов

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

Следует ли на вашем сайте использовать фильтры и фасетный поиск?

Фильтры и фасеты — особенно полезные инструменты для веб-сайтов с большими коллекциями контента, который в противном случае было бы трудно исследовать по отдельности. Например, на многих новостных веб-сайтах есть тысячи статей, блогов, изображений и обзоров, на просмотр которых потребуется много времени. Точно так же на многих сайтах электронной коммерции и медиа есть много контента, который фильтрует, а фасетный поиск может помочь пользователям ориентироваться. Аспекты также полезны для каталогов с продуктами или контентом, которые имеют несколько спецификаций, например, для каталогов продуктов B2B.
Поскольку фасеты позволяют выполнять более сложное и детальное уточнение поиска, их следует использовать, когда более широкой фильтрации недостаточно, чтобы помочь пользователям быстро найти контент, который они ищут. А после поиска фасеты являются обязательными, чтобы быстро помочь пользователям уточнить результаты.
Например, если ваш веб-сайт предлагает всего несколько десятков страниц контента, нескольких широких фильтров может быть достаточно. Однако, если в вашем каталоге много фильтров и сотни или тысячи страниц, фасеты очень помогут вашим пользователям. Пользователям нужны способы одновременного поиска по нескольким параметрам, чтобы они могли легко находить продукты, контент и услуги и не разочаровываться в процессе поиска.

Как оптимизируются страницы фильтров на сайте онлайн-магазина?

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

формирование статических человеко-понятных URL-адресов для страниц фильтров первого уровня и пересечений двух и/или трех фильтров;
настройку генерации мета-тегов (title, description, keywords) и заголовков H1 для страниц фильтров первого уровня и пересечений двух и/или трех фильтров;
добавление уникальных текстов, содержащих релевантные ключевые фразы на страницы фильтров;
организацию грамотной внутренней перелинковки с целью постоянной переиндексации страниц фильтров и наполнения их ссылочным статическим весом.

Оптимизация фильтров в интернет-магазине: пошаговое руководство

ШАГ 1: Формирование статических человеко-понятных URL-адресов для страниц фильтров

URL-адреса страниц фильтров первого уровня (без пересечений)

URL фильтров первого уровня (без пересечений) должен состоять из:

путь к разделу/категории/подкатегории;
название блока фильтров+название фильтра.

http://site.com/razdel/blokfiltrov-nazvaniefiltra/
http://site.com/razdel/categoriya/blokfiltrov-nazvaniefiltra/
http://site.com/razdel/categoriya/podcategoriya/blokfiltrov-nazvaniefiltra/

Например, в разделе “Мужская верхняя одежда” товары можно будет отфильтровать по параметру (фильтру) “цвет”. Следовательно, элемент URL-адреса blokfiltrov = color=color

Или на примере другого сайта, где применяется фильтр — “бежевый”.

Следовательно, элемент URL-адреса nazvaniefiltra = color_bezhevyi

Таким образом, верхняя одежда для мужчинбежевого цвета будут доступна по URL:

/catalog/muzhchiny/odezhda/verkhnyaya-odezhda?color=color_bezhevyi

Важно, чтобы при этом не возникло проблем с формированием URL-адресов для других категорий сайта с аналогичным фильтром. То есть, если пользователь отфильтрует в категории /shop/pidzhaki/ (Пиджаки) цвет — “желтый”, то URL должен быть /shop/pidzhaki/zheltyy/

Сервер должен возвращать для данной страницы код ответа 200, страница должна быть открыта для индексации поисковыми роботами.

URL-адреса страниц пересечений двух фильтров из разных блоков фильтров

Для страниц пересечений двух фильтров из разных блоков фильтров (например, “цвет”, “размер”) также необходимо сформировать шаблон генерации URL-адресов.

URL-адрес страницы пересечений двух фильтров должен состоять из следующих элементов:

путь к разделу/категории/подкатегории;
название первого блока фильтров+название фильтра из первого блока фильтров;
название второго блока фильтров+название фильтра из второго блока фильтров

http://site.com/razdel/blokfiltrov1-nazvaniefiltra1/blokfiltrov2-nazvaniefiltra2/

http://site.com/razdel/categoriya/blokfiltrov1-nazvaniefiltra1/blokfiltrov2-nazvaniefiltra2/

http://site.com/razdel/categoriya/podcategoriya/blokfiltrov1-nazvaniefiltra1/blokfiltrov2-nazvaniefiltra2/

Например, в разделе “Платья” товары можно будет отфильтровать по параметру (фильтру) “цвет”, а также “вырез”. Следовательно, элементы

URL-адреса blokfiltrov1 = tsvet, blokfiltrov2 = vyrez.

Название фильтра по цвету — “желтый”.

Название фильтра по типу выреза — “водопад”.

Следовательно, элементы URL-адреса nazvaniefiltra1 = zheltyy; nazvaniefiltra2 = vodopad.

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

/shop/platya/tsvet-zheltyy/vyrez-vodopad/

Возможен вариант формирования URL-адреса страницы фильтра первого уровня без элемента blokfiltrov. То есть URL будет вида:

http://site.com/razdel/categoriya/podcategoriya/nazvaniefiltra1/nazvaniefiltra2//shop/platya/tsvet-zheltyy/vyrez-vodopad/

Важно! Необходимо настроить порядок формирования URl для страниц пересечений фильтров.

То есть в URL страницы фильтра на месте “nazvaniefiltra1” должен быть вначале фильтр по цвету, затем — размеру, затем — материалу и т. п.

То есть, если пользователь выбрал фильтр по материалу — “атлас”, а цвет — “синий”, то URL должен быть вида

http://site.com/razdel/categoriya/tsvet-siniy/material-atlas/

но не наоборот, то есть не:

http://site.com/razdel/categoriya/material-atlas/tsvet-siniy/

ШАГ 2: Настройка генерации мета-тегов (title, description, keywords) и заголовков H1 для страниц фильтров

Для страниц фильтров первого уровня, а также пересечений двух фильтров из разных блоков фильтров (например, “цвет”, “размер”) также необходимо настроить генерацию мета-тегов title, description, keywords и заголовков H1 на основе шаблона:

Title: Купить [название категории] [название блока фильтров1] — [название фильтра1], [название блока фильтров2] — [название фильтра2] в городе в магазине MY SITE

Description: ➯ [Название категории] [название блока фильтров1] — [название фильтра1], [название блока фильтров2] — [название фильтра2] в интернет-магазине одежды ❤MY SITE ❤ Быстрая ✈️ доставка по всей СТРАНЕ. ⚡ Низкие цены!

Keywords: [название категории] [название блока фильтров1] — [название фильтра1], [название блока фильтров2] — [название фильтра2], купить, цена, недорого

H1: [Название категории] [название блока фильтров1] — [название фильтра1], [название блока фильтров2] — [название фильтра2]

Пример пример реализации шаблона мета данных на страницах фильтрации:

Фильтр: категория “Платья”, цвет — “Желтый”, материал — “шифон”

URL /shop/platya/tsvet-zheltyy/material-shifon/

Title: Купить платья цвет — желтый, материал — шифон в Москве в магазине магазине MY SITE

Description: ➯ Платья цвет — желтый, материал — шифон в интернет-магазине ❤MY SITE ❤ Быстрая ✈️ доставка по всей РФ. ⚡ Низкие цены!

Keywords: платья цвет — желтый, материал — шифон, купить, цена, недорого

H1: Платья цвет — желтый, материал — шифон

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

Дополнительные рекомендации, которые нужно учесть при оптимизации страниц фильтров:

Текст на страницах фильтров не должен дублировать текст с основной категории
После реализации технического задания на оптимизацию страниц фильтров необходимо открыть страницы для индекса, удалив с технического файла robots.txt строчку — Disallow: */?*
Оптимизированные страницы фильтров должны быть добавлены в технический файл – sitemap.xml
Формирование URL фильтров при выборе 2 и более фильтров:

Не оптимизируем страницы более 2 параметров в фильтре, на таких страницах оставляем все без изменений и реализуем на них атрибут rel=canonical

ШАГ 3: SEO оптимизация текстов на страницах сортировки

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

Тексты должны располагаться под списком выводимых товаров на странице, быть уникальными в рамках всего сайта и за его пределами и не дублировать текст с основной категории.

ШАГ 4: Организация перелинковки и индексации страниц фильтров

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

Страницы пересечений двух и более фильтров из одного блока фильтра (например, цвет — “синий”, цвет — “красный”) должны быть скрыты от индексации при помощи тега

Страницы пересечений трех и более фильтров (включая фильтров из различных блоков фильтров) должны быть также скрыты от индексации при помощи тега

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

На страницах фильтров первого уровня должны быть видны ссылки на страницы пересечений фильтров.

Следовательно, необходимо реализовать фильтры, не используя технологию JavaScript, ajax.

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

С чего начать seo-оптимизацию страниц фильтров

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

Анализ конкурентов. Предполагает аудит выдачи ПС по основным направлениям вашего интернет-сайта;
Анализ структуры нишевых сайтов;
Сбор семантики различными способами.

На примере сервиса Serpstat и простого бесплатныго редактор текстовых файлов Notepad++ мы продемонстрируем как быстро собрать возможные фильтры на сайт, на примере основного запроса — Женские платья.

Итак, заходим в Serpstat, вводим по нужному региону ( у нас Москва) основной запрос:

Как видно из скриншота выше у нас 4.58К результатов. Сними мы и будем работать.

Лайфак от seo-специалиста: Если результатов недостаточно Вы можете переключится между различными ПС и регионами, или выполнять поиск не по ключевой фразе, а спарсить самых крупных игроков (сайтов) в вашей нише.

Скачиваем файл с запросами:

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

Копируем фразы из файла и вставляем их в Notepad++, тут у вас должно быть установлено расширение — TextFx. Сортируем фразы с его помощью:

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

Удаляем мусор. Вот пример мусорных запросов:

Выделяем фразу, потом — Поиск — Пометки:

Выделенное слово можно легко определить и после удалить:

Удаляем: Поиск — Закладки — Удалить все строки с закладкой.

Похожим способом мы выделяем и кластера запросов для фильтров (тегирования). Например нас устраивает запрос — вечерние платья

Выделяем, потом Поиск — Закладки — Вырезать все с закладкой

Получаем результат — фильтр — Вечерние платья:

Тут также может быть мусор, который легко удаляется одним щелчком, и так же данный кластер можно еще поделить дальше на фильтр — например ВЕЧЕРНИЕ ПЛАТЬЯ БОЛЬШИХ РАЗМЕРОВ.

В Notepad++ можно сразу сделать себе что-то подобное минус словам — бесплатно, фото, опт,алиекспресс и тд. чтобы в вкладке запросов было меньше нерелевантных запросов.

Дизайн блока фильтров

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

Приблизительно так будет выглядеть вывод фильтров на страницах категорий, подкатегорий:

Как выбрать лучшее место для фильтров на сайте

Около 80% интернет-магазинов используют боковую панель для фильтрации, поэтому большинство пользователей привыкли видеть ее там:

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

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

Фильтры могут показаться маленькой и незначительной частью веб-сайта. Но на самом деле это фильтры, которые обеспечивают беспроблемный процесс покупок. Фильтры и категории — необходимый стандарт, позволяющий исключать ненужные элементы из результатов массового поиска. Все, что улучшает UX веб-сайта, хорошо для бизнеса. Каждое улучшение означает увеличение продаж.

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

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

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

Реализация фильтров на сайте: инструкция и фишки