или заполните форму
UX/UI
Фильтрация и сортировка товаров: 18 решений для упрощения выбора и максимальной конверсии
Максим Жуков
Сооснователь ecommerce-агентства KISLOROD
Заходя в интернет-магазин, покупатель чаще всего действует по следующей схеме — сначала просматривает список товаров в интересующей категории, анализирует информацию и только потом делает выбор. Правильно выстроенная система фильтров положительно сказывается на конверсии. С одной стороны, помогает пользователям быстрее отыскать подходящую товарную позицию, с другой — влияет на ранжирование сайта в поиске. Рассмотрим, как можно осуществлять фильтрацию в интернет-магазине, чтобы она была удобной для посетителей и SEO-продвижения.
Фильтрация и сортировка товаров — определение понятий
Фильтрация товаров — систематизация ассортимента продукции по заданным критериям. Наибольший интерес для пользователя представляют такие значимые характеристики, как стоимость, бренд, размер, цвет, и так далее. Фильтрация в какой-то мере является аналогом продавца-консультанта, помогающим в интерактивном режиме подобрать тот или иной продукт по индивидуальному запросу. Перечень фильтров обычно располагается в сайдбаре — боковой панели, выделенной графически и располагающейся справа или слева от основного контента.
Фильтр на wildberries.ru
Если функция фильтров заключается в отсеивании определенных продуктов из общей выборки, то сортировка на сайте работает по другому принципу — она упорядочивает товары по заданным критериям. Разделение может осуществляться по возрастанию/убыванию цены, проценту скидки, рейтингам покупателей и дате обновления в каталоге. Параметры сортировки в каталоге размещаются над списком товаров.
Как выглядит сортировка на wildberries.ru
Почему фильтрация и сортировка товаров важна для UX
Чем проще и интуитивно понятней выстроен интерфейс, тем пользователю легче сориентироваться на сайте и совершить целевое действие. Благодаря фильтрам и сортировке ускоряется поиск нужных продуктов, что, в свою очередь, влияет на статистику глубины просмотра страниц, а также среднее время сессии.
Фильтрация позволяет быстро перейти на нужную страницу, где товары подобраны согласно индивидуальным запросам. По итогу риск отказа снижается, а вероятность повышения конверсии, наоборот, растет. Повысить конверсию также можно с помощью техник cross-sell, up-sell и down-sell.
После нажатия кнопки сортировки покупатель не переадресовывается на другую страницу, но продукция отображается уже в другом порядке, исходя из заданных параметров. Более удобная структура выдачи товарных позиций также влияет на скорость оформления заказа.
Фильтрация позволяет быстро перейти на нужную страницу, где товары подобраны согласно индивидуальным запросам. По итогу риск отказа снижается, а вероятность повышения конверсии, наоборот, растет. Повысить конверсию также можно с помощью техник cross-sell, up-sell и down-sell.
После нажатия кнопки сортировки покупатель не переадресовывается на другую страницу, но продукция отображается уже в другом порядке, исходя из заданных параметров. Более удобная структура выдачи товарных позиций также влияет на скорость оформления заказа.
Как сделать фильтрацию товаров удобной: 18 основных принципов
Одна из основных ошибок при настройке фильтрации товаров — выбор свойств фильтров, не несущих для покупателя значимой ценности. Усугубляет ситуацию неразумный подход к распределению товаров в категориях, а также неудобный интерфейс сайта. Разберем варианты оптимизации страниц фильтров.
1. Соблюдайте последовательность: сначала выбор категории, затем фильтра
При таком подходе удается избежать большого разброса ассортимента, появляющегося в выдаче, в том числе товаров из нерелевантных категорий. Для удобства зрительного восприятия список категорий рекомендуется размещать вверху блока с фильтром (смотрите пример выше) или над выдачей (смотрите пример ниже).
Пример выдачи на ozon.ru
2. Настройте функцию выбора в 2-х и более категориях
В зависимости от специализации интернет-магазина не исключено, что пользователю захочется искать искомый продукт одновременно в нескольких категориях. Чтобы не фильтровать в ручном режиме, делая письменные заметки или напрягая память, настройте эту опцию.
Выбор нескольких категорий поиска на shop-krastsvetmet.ru
3. Персонализируйте фильтры в категориях
Как правило, перечень фильтров, по которым ведется отбор товарных позиций, достаточно универсален — цена, размер, цвет, производитель и так далее. Чтобы у клиентов появится возможность еще более детально отсортировать ассортимент продукции, сократив время на поиски, есть смысл организовать фильтрацию по каким-то уникальным параметрам. При выборе телевизора это может быть ширина диагонали, зимней одежды — вид утеплителя, постельного белья — тип ткани.
Пример уникальных фильтров в категории «Ноутбуки», реализованный на ozon.ru
4. Откройте доступ к фильтрации по всем характеристикам из превью карточек
В некоторых случаях недостаточно предоставлять только общие сведения о товаре, поэтому его расширенные технические характеристики выводятся в превью. Соответственно, пользователь должен иметь возможность производить отбор по всем важным для него параметрам, а не уходить с сайта разочарованным. Ярким примером являются интернет-магазины электроники и мобильных телефонов, где изучение того или иного устройства перед покупкой максимально детализировано. Логичным будет провести оптимизацию фильтров по аналогии с сайтом ozon.ru, добавив следующие опции: тип матрицы, количество SIM-карт, назначение слотов, вид операционной системы.
Принцип составления карточки товара на ozon.ru
Под каждый параметр выведен фильтр:
Фильтры на основе превью карточки товара на ozon.ru
5. Применяйте тематическую разбивку фильтров
Фильтрация может осуществляться по тематическим характеристикам. Все зависит от вида реализуемой продукции и контекста ее использования. Для онлайн-маркетов одежды будет хорошо добавить разбивку по стилям (спортивный, офисный, городской, вечерний), сезонности (лето, весна, осень, зима), материалу изготовления (хлопок, шерсть, полиэстр, шелк). Если при покупке офлайн помочь с выбором могут продавцы-консультанты, то при заказе через интернет приходится полагаться именно на грамотный функционал фильтрации.
Варианты тематических фильтров на lamoda.ru
При отсутствии тематических фильтров поиск продуктов отнимает слишком много времени, и как показывает исследование Baymard Institude, большой процент потенциальных покупателей просто уходят с сайта, не в силах обрабатывать весь массив информации и попросту теряя нужную вещь в обилии предлагаемых вариантов.
Похожие результаты мы увидели и на примере собственного анализа покупки спальных матрасов, когда семейные пары не смогли разобраться в предложенном ассортименте и выбрать модели с разной нагрузкой по весу. Проблема быстро решилась бы добавлением в параметры поиска соответствующего фильтра.
Похожие результаты мы увидели и на примере собственного анализа покупки спальных матрасов, когда семейные пары не смогли разобраться в предложенном ассортименте и выбрать модели с разной нагрузкой по весу. Проблема быстро решилась бы добавлением в параметры поиска соответствующего фильтра.
6. Добавьте в систему фильтрации опцию совместимости товаров
Часто бывает, что главным критерием выбора для пользователя является совместимость товаров с уже имеющимися в использовании. Это может быть все что угодно: от рабочих инструментов и автозапчастей до пищевых добавок и постельных принадлежностей. Когда предмет поиска не подходит к исходному товару, то никакие отзывы, скидки и гарантии качества уже не влияют на принятие решения — заказ оформлен не будет. В таких случаях нужно обязательно предлагать покупателям варианты совместимых товаров, сделав акцент на значимые оценочные характеристики.
Фильтр-подсказка совместимости smart-часов с разными видами устройств на ozon.ru
Результат исследования Baymard Institute показал, что только 35% опрошенных смогли справиться с задачей и найти товарную позицию с оптимальными параметрами совместимости. Большинство сайтов использовало стандартную фильтрацию по брендам, чего явно недостаточно при выборе электроники. Далеко не все блоки питания подходят к разным моделям ноутбуков и планшетов даже в пределах одного производителя. Равно как и нет гарантии найти сопутствующие аксессуары, совместимые с определенным устройством той же торговой марки.
Реализация такого фильтра обязательна и в нише фото-, аудио-, бытовой техники. Простой пример — подбор объектива для профессионального фотоаппарата. Данных о названии и номере исходной модели будет недостаточно для оценки уровня совместимости, но если расширить критерии поиска, добавив показатели резкости, зума, фокусировки и другие технические нюансы, то риск возврата заказа в интернет-магазин будет минимальным.
Реализация такого фильтра обязательна и в нише фото-, аудио-, бытовой техники. Простой пример — подбор объектива для профессионального фотоаппарата. Данных о названии и номере исходной модели будет недостаточно для оценки уровня совместимости, но если расширить критерии поиска, добавив показатели резкости, зума, фокусировки и другие технические нюансы, то риск возврата заказа в интернет-магазин будет минимальным.
7. Учитывайте логику работы фильтра
Принцип фильтрации должен быть предельно прост и понятен для всех пользователей, даже не имеющих опыта с онлайн-покупками. Критерии отбора в категориях должны давать четкую картину поиска искомых товаров.
Ошибки в настройке фильтров можно увидеть на одном из сайтов по продаже спальных матрасов. На панели сайдбара отображено несколько вариантов жесткости сторон: низкая, средняя, высокая и разная. Чтобы сделать последнюю иконку активной, необходимо выбрать сразу два пункта из расположенных выше. Большинство испытуемых об этом условии не знали и посчитали, что матрасов с разным типом жесткости сторон в наличии просто нет.
Ошибки в настройке фильтров можно увидеть на одном из сайтов по продаже спальных матрасов. На панели сайдбара отображено несколько вариантов жесткости сторон: низкая, средняя, высокая и разная. Чтобы сделать последнюю иконку активной, необходимо выбрать сразу два пункта из расположенных выше. Большинство испытуемых об этом условии не знали и посчитали, что матрасов с разным типом жесткости сторон в наличии просто нет.
Структура фильтра жесткости на портале ormatek.com
Изучая систему фильтрации на примере данного ресурса, можно заметить, что часть фильтров отображается в виде ползунков. Предлагается самостоятельно двигать правый и левый ползунок и, тем самым, определять границы стоимости желаемого продукта. Как показывает практика, метод не находит должного отклика у покупателей — им удобнее вводить диапазон цен вручную в шаблонные окна. И даже если такая опция в фильтре присутствует, то стилизацию полей нужно делать по принципу «чем проще, тем эффективней».
Как не стоит оформлять поля для ввода на примере ormatek.com
На сайте anatomiyasna.ru этот шаблон продуман более тщательно, поэтому пользователям проще сориентироваться в правилах фильтрации.
Правильный подход к оформлению полей для ввода, реализованный на anatomiyasna.ru
Описания фильтров должны соответствовать литературным нормам русского языка, без содержания сленговых и жаргонных слов.
Важный момент: дизайн фильтров должен работать на привлечение покупателей, а не отпугивать своей сложность и невнятностью.
Важный момент: дизайн фильтров должен работать на привлечение покупателей, а не отпугивать своей сложность и невнятностью.
8. Ставьте популярные параметры фильтрации выше остальных
Для отдельных категорий товаров фильтрация лучше работает, если ее настраивать по определенным сочетаниям параметров фильтра — иначе говоря, тегировать. Тогда пользователям проще воспринимать информацию, а риск, что тот или иной параметр поиска (при условии выведения его в отдельный список) будет пропущен или не принят во внимание, сводится к минимуму.
Данный подход успешно реализован на сайте citilink.ru. Самые важные критерии оценки товара выведены в специальный блок над общим списком продуктов.
Данный подход успешно реализован на сайте citilink.ru. Самые важные критерии оценки товара выведены в специальный блок над общим списком продуктов.
Популярные фильтры, выведенные в отдельный блок на citilink.ru
На что еще обратить внимание:
- не используйте баннеры для оформления комбинации фильтров. Пользователи будут игнорировать информацию, воспринимая ее как рекламную (эффект баннерной слепоты).
- дублируйте перечень тегов и в блоках соответствующих фильтров, так как интуитивно покупатели будут смотреть именно туда.
- выводите список отмеченных значений фильтра в верхний блок — так легче сделать их отмену.
9. Делайте обрезку длинных списков из параметров фильтрации
Слишком длинные списки, даже если они логически оправданы (например, перечень моделей мобильных телефонов), зрительно воспринимаются тяжело. Их необходимо обрезать, чтобы блок выглядел компактно, но при этом был информационно полезен.
Как это реализовать:
1) Сделайте специальную ссылку или кнопку для того, чтобы мог открываться весь диапазон фильтра. Иначе будет казаться, что доступны только те параметры, которые видны на экране.
Как выглядит обрезанный список параметров фильтрации на ozon.ru
2) Расположение ссылки с надписью «Посмотреть все» должно быть графически выверено. Если она будет тесно примыкать к списку фильтрации, ее можно спутать с еще одним параметром, если же будет расположена слишком далеко от него — будет восприниматься отдельной ссылкой или частью уже следующего блока фильтров. Этот момент хорошо показан на скриншоте ниже.
3) Ссылка должна «схватываться» глазами, не сливаться по цвету и размеру шрифта с указанными параметрами поиска, но при этом органично вписываться в общую стилистику сайта. Хорошо работают такие приемы, как опция цветного подчеркивания, добавление стрелок/галочек/плюсов и других знаков, а также использование слов «Посмотреть больше» или «Развернуть». Еще один проверенный вариант — изменить визуальную яркость последнего пункта фильтрации, сфокусировав внимание пользователя на том, что список неполный, а затем ниже разместить ссылку на развернутый перечень фильтра.
4) Видимая часть обрезанного блока должна отображать самые популярные параметры, чтобы пользователь сразу же находил интересующий товар и не прибегал к расширенному поиску.
10. Подходите к встроенной прокрутке взвешенно
В качестве альтернативы обрезки длинных списков нередко используется опция скроллинга значений внутри фильтра.
Фильтр со встроенной прокруткой на портале на lamoda.ru
Вариант использования прокрутки имеет свои преимущества, но вместе с тем сопряжен и с некоторыми трудностями. Например:
- Отсутствие возможности видеть одновременно все параметры фильтрации. Получается, что убирая проблему обзора в масштабах всей страницы, возникают сложности обзора в рамках конкретного фильтра.
- Захватив прокрутку в одном списке, можно начать двигать всю страницу, и наоборот. Это нервирует и может стать причиной отказа от дальнейшего поиска товаров.
- Излишняя чувствительность скролла ведет к слишком быстрому прокручиванию параметров на экране, и подходящие варианты не успевают зафиксироваться зрением. В итоге покупатель решает, что искомых позиций продуктов просто нет в наличии.
- Попытка активировать область прокрутки приводит к захвату и открытию одного из значений фильтрации. Приходится делать возврат в исходное положение, что раздражает и отнимает время.
Если решено все же использовать прокрутку, то целесообразно добавить специальное поле, куда можно вручную вводить название нужного параметра из предложенного списка.
Фильтр со встроенной прокруткой на портале на lamoda.ru
11. Сделайте возможным комбинирование нескольких однотипных значений фильтра
Зачастую фильтрация реализована по принципу взаимоисключения. То есть в поле «Цвет» можно поставить отметку только напротив обозначения «зеленый» или, к примеру, «красный». Хотя фактически покупатель настроен рассматривать сразу несколько вариантов оттенков.
Комбинированный подход при выборе параметров цвета на lamoda.ru
Опрос Baymard Institute показал, что почти половина (45%) опрошенных хотели большей вариативности при фильтрации и были разочарованы отсутствием этой возможности.
12. Настройте функцию обновления списка продуктов по запросу пользователя
Суть функции заключается в том, что обновление страницы происходит не автоматически после отметки параметров в фильтре, а только после нажатия кнопки «Применить» в ручном режиме.
Мгновенная фильтрация зачастую неприемлема для пользователей, особенно когда сайт не может похвастаться высокой производительностью. Мало того, что картинка товаров постоянно обновляется, так еще и процесс этот крайне медленный.
Фильтрация по запросу ценна в работе со сложными каталогами, где ассортимент продукции исчисляется тысячами наименований товарных позиций. Единственный минус — это высокий риск получить нулевую выдачу при использовании большого числа ограничивающих параметров. Как этого избежать, читайте в следующем пункте.
13. Выводите отдельный блок с перечнем использованных фильтров
Если пользователю виден список примененных им фильтров, это помогает быстрее сориентироваться на сайте и при необходимости скорректировать параметры поиска. В ином случае он может испытывать дискомфорт по ряду моментов. К примеру:
- нет функции быстрой отмены параметров фильтрации;
- нет четкого понимания, что все выбранные значения были применены;
- теряется логика подбора товаров;
- трудно запомнить все отмеченные позиции, по которым фильтруется продукция в категории.
Помимо реестра выделенных параметров, рекомендуется выводить на экране и тип фильтра. Информационный блок можно разместить выше списка товаров либо выбрать другое положение: сверху боковой или ниже горизонтальной панели фильтрации.
Варианты отображения фильтров на сайте ozon.ru
Как показывает практика, покупателям удобно видеть примененные фильтры и сбоку, и сверху. Им не нужно искать промаркированные пункты, чтобы сделать отмену — достаточно снять лишние пометки над выдачей. Допустим, если поиск не показал наличие подходящих моделей телевизоров интересующего бренда, то можно убрать эту марку из фильтрации и получить нужную выборку из общего ассортимента товаров.
14. Не забудьте о кнопке сброса фильтров
Опция сброса параметров — обязательное условие при настройке функционала фильтрации. Чтобы не вводить пользователей в заблуждение, кнопки запуска и сброса фильтрации лучше «разбросать» по разным местам страницы. Оптимальный вариант — поместить иконку сброса над списком товаров, по аналогии с примером на скриншоте выше.
Если этот нюанс упустить, то посетители сайта будут вынуждены использовать функцию возврата на предыдущую страницу непосредственно в браузере. При этом будут уверены, что вернутся в исходное положение страницы, когда еще ничего не отфильтровано, а по факту получат совершенно новый контент.
15. Используйте подсказки
Часто потенциальные покупатели совсем не ориентируются в технических особенностях искомого товара либо имеют о нем поверхностное понятие. Провести виртуальный «ликбез» помогают всплывающие подсказки. Хорошо реализован этот подход на портале matras.ru. Почти возле каждого параметра фильтра указан вопросительный знак, активировав который можно получить краткую информацию выбранной характеристики изделия.
Как отображаются подсказки на matras.ru
16. Отслеживайте скорость фильтрации
Факт совершения покупки частично зависит и от скорости обработки вводимых фильтров. Если процесс фильтрации занимает слишком много времени, пользователь может выйти из интернет-магазина, отдав предпочтение более «шустрым» конкурентам с аналогичным ассортиментом товаров. Сайты с низкой производительностью имеют мало шансов быть востребованными, как со стороны покупателей, так и со стороны поисковых машин.
17. Указывайте суммарное количество товаров, отвечающих параметрам поиска
Пометка с количеством отфильтрованных товаров даст пользователю понимание, стоит ли ему менять заданные параметры поиска — сузить или, наоборот, расширить диапазон выборки.
Ссылка на количество подходящих моделей матрасов согласно заданным критериям на сайте 220-volt.ru
18. Избегайте пустых списков по результатам фильтрации
Покупателям тяжело реагировать на пустующее поле и фразу «Ничего не найдено», когда слишком жесткие ограничения в фильтре отсеивают все возможные варианты товаров. Вместо смены параметров выборки они просто покидают сайт разочарованные и уже не возвращаются.
Проблема решается разными путями — можно исключить из списка видимых значений те, которые могут привести к нулевой выдаче, или деактивировать их еще на стадии выбора. Вполне вероятно, что они не будут иметь определяющую роль в поиске, и страница отобразит достаточно товаров с подходящими свойствами.
Похожая тактика успешно реализуется на сайте ozon.ru. При выборе операционной системы iOS пользователь будет видеть лишь товары с совместимыми параметрами.
Отсеивание несовместимых параметров на ozon.ru
Сортировка товаров на сайте: 7 возможных вариантов
Рассмотрим наиболее распространенные способы сортировки товаров в интернет-маркетах.
1. Сортировка товаров по цене
Один из самых популярных методов сортировки. Часто оценочным фактором при выборе продукта является его стоимость. Сортировка товаров по цене должна быть доступна в формате «от дешевых к дорогим» и противоположным способом — «от дорогих к дешевым».
2. Сортировка товаров по рейтингам реальных покупателей
Еще один часто используемый вид сортировки согласно отчетам Baymard Institute. К рейтингам обычно обращаются тогда, когда есть сомнения относительно выбора, и хочется опереться на коллективное мнение людей, уже совершивших искомую покупку.
Однако нужно иметь ввиду, что товары часто сортируются по средней оценке, но увидеть общее число проголосовавших нет возможности. В идеале эти два показателя должны отображаться на странице совместно.
Результаты сортировки по рейтингу с количеством голосов на ozon.ru
3. Сортировка товаров по популярности
Данный тип сортировки будет полезен покупателям, подбирающим вещи по уровню трендовости и актуальности в мире моды. Либо тем, кто незнаком с тематикой или не совсем доверяющим своему вкусу. Поэтому они хотят ознакомиться с тем, что заказывают другие. Уровень популярности рассчитывается по количеству оформленных заказов.
4. Сортировка товаров по новинкам
Посетители интернет-магазинов часто хотят видеть сначала последние новинки, а затем остальной товарный ассортимент. В основном это касается ниш, связанных с темой моды и красоты: одежда, обувь, аксессуары, косметика и так далее.
5. Сортировка товаров по размеру скидки
К фильтру по размеру скидки прибегают те, кому важно сделать заказ по максимально выгодной цене. В эту категорию попадают все акционные товары, доступные на текущий момент.
6. Сортировка товаров по наличию
Товары, выставленные в каталоге, не всегда могут быть на складе. Часть из них может либо временно отсутствовать, либо доставляться под заказ. Необходимо предусмотреть опцию сортировки товаров по наличию, то есть доступных к покупке сразу.
7. Сортировка товаров по категориям
Сортировка выполняется по любым параметрам, но в пределах какой-то одной категории. Например, подбор телевизоров по ширине диагонали, ноутбуков по объему оперативной памяти, одеял по типу наполнителя — как это сделано в ИКЕА. Алгоритм прекрасно работает, когда нет цели жестко регламентировать поиск посредством фильтрации. По непонятной причине этот метод используется интернет-магазинами достаточно редко.
Как сортируются столы по параметрам на сайте ikea.com
Чтобы определить, по каким критериям лучше всего сортировать товары, нужно отобрать из каждой категории фильтрации 2-5 популярных параметров и добавить их в список.
О чем еще важно помнить:
- При сортировке страница не обновляется.
- Параметры сортировки по умолчанию должны соответствовать основным потребностям покупателей. Для этого проводят опрос клиентов либо опираются на данные Google Analytics.
Горизонтальное расположение фильтра на сайте: плюсы и минусы
В большинстве интернет-магазинов фильтры выносятся в сайдбары, что часто приводит к снижению конверсии. Боковые блоки воспринимаются посетителями сайта как рекламные баннеры и попросту игнорируются. Для работы с товарным ассортиментом остается только сортировка, что вызывает у многих пользователей неудобства. Как результат — покупка не совершается.
Исправить ситуацию помогает смена графического расположения фильтров с вертикальной в горизонтальную плоскость. Обновленная раскладка может совмещать в себе одновременно функции сортировки и фильтрации, что очень удобно — внимание направляется в одно место, а не распыляется по всей странице. Также удаление фильтра из сайдбара позволяет визуально расширить список товаров и сделать дополнительную колонку в листинге на сайте.
Горизонтальная раскладка параметров сортировки и фильтрации на lamoda.ru
Из минусов горизонтальных фильтров можно выделить следующие:
- Необходимость использования выпадающих списков. Если значений поиска много (от 10 и больше), то список параметров может выходить за границы экрана, а излишне чувствительный скролл будет раздражать пользователей.
- Лимит по количеству размещаемых фильтров ввиду ограниченности объема экрана.
Горизонтальная фильтрация и сортировка — отличное решение для ниш, где отсутствует необходимость применять к товарам расширенную фильтрацию. Поэтому вариант однозначно подойдет для магазинов одежды, обуви и аксессуаров, но будет малоэффективным для направлений электроники, спортивного инвентаря, детских игрушек, бытовой техники.
Какие еще рекомендации по горизонтальной раскладке фильтров можем дать:
- сделайте доступной опцию выбора сразу нескольких значений в списке;
- параметры фильтров и сортировки не должны перекрываться выпадающими списками, чтобы покупатель имел право на выбор;
- указывайте количество товаров, отвечающих выбранному значению фильтра;
- выдача результатов поиска должна обновляться в реальном времени;
- не перегружайте страницу — откажитесь от идеи выпадающих списков из выпадающих списков;
- не меняйте в фильтре очередность расположения параметров поиска.
Значение фильтрации и сортировки товаров для SEO
Грамотная оптимизация фильтра положительно влияет на ранжирование сайта. После фильтрации создается новая посадочная страница с уникальным URL, мета-тегами и заголовком H1. Это обеспечивает:
- расширение семантического ядра сайта;
- рост объема поискового трафика;
- увеличение видимости и позиций сайта за счет продвижения по средне- и низкочастотным запросам, возможность конкурировать в поиске с крупными интернет-магазинами;
- высокое качество трафика — по узким точным запросам приходят покупатели, которые скорее всего совершат покупку.
К сожалению, этого не всегда можно добиться при стандартном функционале фильтрации популярных CMS. Но если ваш интернет-магазин разработан на Битрикс, можно подключить специализированный модуль. Как это сделать, читать здесь.
В одном из клиентских проектов мы внедрили модуль seo-умного фильтра. Это привело к существенному росту поискового трафика.
Рост поискового трафика после внедрения seo-умного фильтра
Страницы сортировки товаров реализованы только для удобства пользователя, напрямую на ранжирование сайта не влияют.
16 шагов к эффективной SEO-оптимизации страниц фильтров
Идеальный вариант оптимизации фильтров — сделать все правильно на этапе разработки сайта. Как оптимизировать страницы фильтров:
1. Соберите среднечастотные и низкочастотные запросы
Чтобы понять, какие страницы фильтров будут максимально востребованы, нужно разобраться в самом подходе к поиску товаров из конкретной ниши. Есть два варианта собрать целевые запросы — использовать Google Analytics, проанализировав статистику из внутреннего поиска, или отобрать данные из семантического ядра.
Важно всегда отображать фильтры, связанные с ценовыми характеристиками товара. Покупатели часто выбирают продукты по принципу «недорогие» или «дешевые».
2. Определите посадочные страницы фильтров
Семантическое ядро нужно распределить по посадочным страницам. Выберите страницы, которые нужно оптимизировать. Составьте перечень возможных комбинаций по формуле:
- категория товаров + параметр фильтра,
- категория товаров + параметр первого фильтра + параметр второго фильтра,
- и так далее.
3. Распределите ключевые слова по страницам
Соберите информацию и семантику по текущим характеристикам товара. Например, производитель, цвет, материал. Разделите отобранные поисковые запросы на кластеры и вынесите в фильтр те, которые не используются на сайте.
4. Настройте генерацию метатегов
Чтобы не вводить мтгатеги (Description) заголовки (Title, H1) вручную, что особенно проблематично для крупных интернет-магазинов, целесообразно настроить автоматическую генерацию метаданных. Упор делается на страницы первого уровня с возможностью применения одновременно нескольких фильтров.
При этом технический ресурс административной панели должен позволять:
- формировать хлебные крошки (навигационные строки) двумя способами: вручную и посредством шаблонов;
- отображать тексты на страницах фильтров;
- ручной формат прописывания метатегов;
- составлять шаблоны формирования метатегов.
Если же вышеперечисленных возможностей нет, то оптимизация ссылок будет не результативной, равно как не получится грамотно управлять индексацией. Решить проблему поможет установка SEO-умного фильтра.
5. Оформите канонические ссылки
Страница фильтров, содержащая параметры в URL, должна ссылаться не на саму себя, а на страницу категорий — содержать атрибут rel="canonical". Настройте канонические ссылки со страниц фильтрации на основную категорию.
Тегирование страниц фильтра
6. Сформируйте ЧПУ-ссылки для страниц
Для каждого параметра нужно указать свое ЧПУ, чтобы получался понятный для пользователя URL. Тогда и поисковая система легче распознает страницу, поднимет ее в результатах поиска. Формула формирования ЧПУ: имя сайта — категория — фильтр. Например, ссылка на комбинезон в категории для малышей, отфильтрованный по размеру (104 см) может выглядеть так: site.ru/futbolki-dlya-detey/razmer-104-sm.
7. Настройте порядок следования параметров в URL
Если используется два фильтра и более, они перечисляются не в порядке выбора пользователем, а в порядке очередности в столбце фильтров: имя сайта — категория — фильтр 1 — фильтр 2. Тот же комбинезон, отфильтрованный еще и по цвету:
site.ru/futbolki-dlya-detey/razmer-104-sm-krasnye.
site.ru/futbolki-dlya-detey/razmer-104-sm-krasnye.
8. Ограничьте глубину генерации
Если этого не сделать, получится очень много вложенных страниц с параметрами.
9. Определите логику работы при выборе нескольких свойств одного фильтра
Нужно задать приоритет для свойств, например, по алфавиту, и формировать ЧПУ-адрес только по одному параметру.
10. Создайте шаблоны для тегирования и текстов
Теги используются для перелинковки между страницами фильтра, например:
Каноническая ссылка на wildberries.ru
Шаблоном тега может быть название раздела или подраздела со значениями характеристик товара. В шаблон нужно включать столько значений, сколько обеспечит каждому разделу фильтра уникальность. Например, для рюкзака может быть сформирован тег, включающий: название категории — рюкзак, подкатегории — городской, бренд — Nike, цвет — красный, объем — 5 литров. Получаем тег «рюкзак городской Nike красный 5 литров».
Чтобы уникализировать контент на странице фильтра, добавьте описания на 250-500 символов — это положительно скажется на ранжировании.
11. Используйте «хлебные крошки»
Хлебные крошки при просмотре товара должны формироваться с учетом параметров фильтрации по определенной структуре. Например, категория — подкатегория — бренд — цвет — объем, как в примере выше. Чтобы пользователь понимал, где находится, и у него была возможность по хлебным крошкам вернуться к отфильтрованному списку.
12. Настройте обновление страницы через Ajax
При работе с фильтрами страница обновляется — должен изменяться URL, тег Н1, Title, Description. Чтобы пользователь не заметил перезагрузки страницы, важно организовать обновление через Ajax.
Бывает, что для пользователя не всегда целесообразно менять значение, к примеру, тега H1, но для поисковых систем на сайте должна присутствовать полностью персонализированная страница под узкий поисковый запрос.
Персонализация для пользователя на ozon.ru
Персонализация для поисковых систем на ozon.ru
13. Разместите ссылки в самом фильтре
Ссылки, сгенерированные фильтром, размещаются в исходном коде страницы с этими фильтрами. Это своеобразный «проходной балл» для попадания страницы в индекс. Также будут заметно улучшаться поведенческие метрики.
14. Определите содержимое страниц при малом количестве товаров после фильтрации
Иногда после применения нескольких фильтров на странице выводится мало товаров (один-два) или не выводится ни один. Система выкидывает такие страницы из индекса. Чтобы этого избежать, нужно заранее задать правила:
- если в выдаче 1-2 товара — дополнительно выводить блоки с альтернативными товарами;
- если получается нулевая выдача — не генерировать страницу, поставить редирект на уровень выше;
- если товары резко закончились, но планируется поступление, можно генерировать страницу, выведя сообщение о временном отсутствии товара вместе с альтернативными блоками. Так страница останется в индексе и будет продолжать привлекать трафик.
15. Добавьте seo-страницы фильтра в sitemap.xml
Все страницы свойств фильтра, под которые созданы ЧПУ-ссылки, необходимо добавлять в карту сайта — для быстрой индексации поисковыми системами. Обновлять sitemap.xml лучше ежедневно.
16. Откройте оптимизированные страницы для индексации
Страницы фильтров первого уровня, равно как и страницы пересечений двух фильтров из разных блоков необходимо открыть для индексации. Страницы свойств фильтра, не оптимизированные под seo, скрываются от индексации в файле robots.txt или тегом robots и атрибутами noindex, nofollow.
Заключение
Настроив фильтрацию с учетом всех рекомендаций, можно не только облегчить пользователям поиск интересующих товаров, но улучшить в целом UX сайта.
Получайте полезный контент от KISLOROD в любой из мессенджеров
При переходе в одну из указанных социальных сетей, вы автоматически соглашаетесь с политикой конфиденциальности
Спасибо, что дочитали до конца.
Если информация была полезна, поделитесь статьёй. Вам не сложно, нам приятно ;)
Рекомендованные статьи
Скачайте 17 точек роста и 100 + чекеров для роста конверсии и прибыли интернет-магазина
При переходе в одну из указанных социальных сетей, вы автоматически соглашаетесь с политикой конфиденциальности
Мы проанализировали ведущие интернет-магазины, результаты исследований, свой опыт и собрали важные моменты в одно руководство. Делаем e-commerce лучше, поэтому не только пользуемся сами, но и делимся с вами.
Выберите удобный мессенджер и получите чек-лист прямо сейчас:
