Bitrix smart filter чпу

Есть проекты — интернет-магазины. Это сложные проекты и для продвижения, и для веб-разработки.

В них сотни и тысячи товаров. Десятки и сотни категорий.

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

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

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

Вывод: страницы выдачи фильтров интернет-магазина исключительно важны для SEO.

Статья о том, как их делать, оформлять, встраивать в навигацию и продвигать.

Что такое умный фильтр

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

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

Фильтр — это ваш актив. Работайте с ним!

Умный фильтр не только показывает товары, но обладает дополнительными удобствами:

• Знает, какие комбинации характеристик не дают результата, и запрещает их выбор. Например, бренд Braer не производит абрикосовый кирпич.
• Знает, в какой категории какие характеристики бывают. Для строительного кирпича не показывает характеристику «Цвет».

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

Знакомьтесь, Умный Фильтр.

Знакомьтесь, господин Уэф. Никакого отношения к статье не имеет, но созвучно 😉

В чем сложность и вопрос?

Фильтр — штука «чисто программерская». Ставишь галочки, сайт «вжух-вжух» и показывает результат.

Никакой ручной настройки не подразумевает — SELECT-запросы к базе данных в чистом виде.

Однако, есть 2 отрасли, о которых нужно подумать — поисковое продвижение и юзабилити. Первое важно для сеошника, второе — для пользователя. Ведь он покупает ваши товары! Пусть ему будет удобно!

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

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

Список требований к умному фильтру участников проекта оформили в виде mindmap (увеличивается при нажатии).

История исследования и разработки умного фильтра

Ранее мы касались темы в статьях:

• Рассказали, чем хорош умный фильтр и как он работает — Подбор по параметрам как на Ситилинке
• Немного раскрыли в статье технику реализации ЧПУ фильтра на портале недвижимости .
• Упомянули «быстрый фильтр» — младшего брата «умного фильтра», заточенного для SEO.

Почему нельзя использовать умный фильтр Битрикса «из коробки»?

Битрикс сделал хороший фильтр, но традиционно не подумал о SEO. У коробочного фильтра 1С-Битрикс (версия 16.5.4) несколько серьезных недостатков:

• Длинные избыточные адреса страниц. Также, если удалить последний /apply/ будет 404 ошибка.
  
• Отдельную страницу с результатами фильтра нельзя оптимизировать — разместить заголовок и текст. Приходится использовать дополнительные модули (например, наши « Инструменты SEO-специалиста »).
• Нельзя настроить канонический адрес автоматически.
• Сброшенный фильтр возвращает вас к оригинальному списку товаров, но меняет адрес страницы: /catalog/pants/filter/clear/apply/ вместо /catalog/pants/.
• Если у магазина товаров до 50 тысяч, а общее количество свойств не превышает 500, можно смело использовать умный фильтр битрикса. Он справится. Если товаров или свойств в разы больше, придется делать собственную разработку.

Ожидания покупателя от работы фильтра

1. Фильтр помогает найти товар.
2. Покупатель хочет, чтобы фильтр работал быстро. Выбрал галки, перезагрузил страницу, увидел результат.
3. Покупатель хочет, чтобы адреса страниц не менялись. Страницей фильтра можно поделиться, сохранить в закладки, выучить наизусть.
4. Поведение фильтра предсказуемо и понятно. Владельцы магазинов не всегда хотят тратить ресурсы на удобство работы пользователя с сайтом, оставляют задачи «на потом». Страдают, как правило, пользователи.

Пример страдания: Угадайте, за что отвечает флажок «Тип: Отвертка аккумуляторная» в категории «Отвертки аккумуляторные»? Правильно, ни за что;)

Для удовлетворения ожиданий покупатели (и увеличения конверсии в итоге) разработчик должен подумать и выполнить задачи:

1. Сделать удобный и понятный интерфейс фильтра.
2. В каждой категории магазина показывать важными несколько свойств, которые помогают покупателю совершить выбор. Остальные скрывать.
3. Продумать архитектуру фильтра так, чтобы запросов было минимальное количество и работал кеш. Влияет на скорость работы фильтра. Бонус — быстрые страницы хорошо влияют на пользовательские факторы сайта (важно для SEO).
4. Дополнительное требование про кеш: кэшированные страницы отдают правильный заголовок Last-Modified на дату кеширования.
5. Порядок сортировки и постраничная навигация должны передаваться в GET-параметрах. Вопрос про канонические страницы ниже в блоке про SEO.
6. Сделать минимум изменений в существующем программном коде. В идеале — небольшие надстройки «поверх» фильтра из коробки.

Какие флажки помещать в умный фильтр?

Как мы решали проблему сортировки характеристик / свойств фильтра в категориях.

Есть категории — Диваны и Люстры. У диванов есть свойства: двухместный, трехместный. У люстр — материал (сталь, стекло) и стиль (прованс, лофт). Какие флажки должны остаться в фильтре, в каком порядке? На основании чего принимать решение?

Для электроники, бытовой техники, инструментов, компьютеров можно подсмотреть флажки-свойства в Яндекс.Маркете. Как быть для других тематик?

Мы придумали следующий алгоритм:

• собираем ключевые фразы по названиям всех категорий каталога сайта (включая слова «купить», «цена»)
• группируем в соответствии с исходными категориями. В «Диваны» кладем «купить кожаный диван», «купить угловой диван», «диван аккордеон купить». В «Люстры» — «купить хрустальную люстру», «купить потолочную люстру».
• сортируем в каждой группе ключи по убыванию частотности, отсеиваем низкочастотные запросы.
• Получаем по 2-3 базовых характеристики, которые интересуют покупателей товаров конкретной категории. Для диванов важен тип и материал. Для люстр — материал на первом месте.

Требования SEO-специалистов к умному фильтру

Заметили, да? У всех ожидания, а у нас — требования. Отвечу от имени сеошников. Фильтр может оказаться бомбой замедленного действия, неповоротливой и инертной для поисковой машины. Лучше заранее все продумать и не совершать ошибок.

Фильтр может оказаться бомбой замедленного действия

Для внедрения SEO-требований подойдет «коробочный» фильтр Битрикса. Приблизительная оценка внедрения:

100 человеко-часов. Перечисляем в порядке важности приоритета. Если бюджета не хватает, отказывайтесь от нижних.

1. Уникальные title, keywords, description, h1 на страницах умного фильтра. Бонус — красивый и кликабельный сниппет в выдаче.
2. «Быстрые ссылки» — готовые результаты фильтра
3. Размещение текста на странице с фильтром
4. Правильные canonical и отсутствие дублей
5. Шаблоны правил для robots.txt
6. Автоматическое добавление в sitemap.xml
7. Генерация sitemap.xml с правильными ЧПУ одной кнопкой
8. Фильтр отдает правильные коды ответа.
9. SEO-специалист справится с настройкой без программиста.

Пояснения некоторых требований.

Уникальные title, keywords, description, h1.

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

«Быстрые ссылки» — готовые результаты фильтра

Мы неоднократно писали про удобство «Быстрых фильтров» для пользователя:

Быстрая ссылка (быстрый фильтр) — это страница с подборкой товаров под конкретный запрос. Например, «фрезеры бош». Быстрая ссылка имеет ЧПУ и находится в зоне видимости пользователя (заодно, и поисковика).

Как программировать быстрые фильтры:

1. В 1С создаем и загружаем на сайт пустые категории в соответствии с группами фраз из семантического ядра . Группы нельзя переименовывать, это важно.
2. На стороне сайта настраиваем привязки «Адрес категории – Адрес страницы фильтра».
3. Пишем код, который подставляет на страницу пустой категории список товаров с указанной страницы фильтра. Получается «ЧПУ над ЧПУ».

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

Некоторые SEO-специалисты считают, что в интернет-магазине вообще надо закрыть от индексации все страницы с результатами фильтра

Наша позиция — если вы настроите «Быстрые ссылки» и заведете необходимое количество по всему семантическому ядру, остальные страницы можно «спрятать». На продвигаемые запросы будут страницы (что хорошо). Не используемые — закрыты от поискового робота.

Размещение текста на странице с фильтром

В конкурентных тематиках на войне за поисковый трафик мы используем возможности сайта по-максимуму.

Размещение текстов на страницах категорий каталога помогает получить коммерческий трафик на сайт.

Чаще всего эту задачу делают вместе с предыдущей. Если есть категория — быстрая ссылка, значит можно разместить и опубликовать ее описание.

Правильные canonical и отсутствие дублей

На скриншоте ссылки «сортировка по цене», «алфавиту», «показывать по 20 – 40 – 60» не изменяют товары на странице, только их порядок. С точки зрения поисковика, никакой ценности эти страницы не представляют. SEO-специалисты используют специальный «канонический тег» для указания поисковой машине, какую страницу считать главной и оставить в выдаче.

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

1. По умолчанию по адресу категории без GET-параметров выводим страницу с сортировкой по цене по возрастанию и внешним видом «Плитка». Эту страницу назначаем канонической с помощью тега
2. 2-я, 3-я и все следующие страницы ссылаются на каноническую страницу по умолчанию. Для Google делаем дополнительно атрибуты
3. Все прочие направления сортировок и внешнего вида товаров (страницы с GET-параметрами, как правило) закрываем от индексации через robots.txt.

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

Обратите внимание, Google рекомендует сделать для категории каталога канонической страницу «Показать все товары». Если на сайте товаров так мало, что их можно вывести на одной странице без ущерба производительности, можно назначить ее канонической «по-умолчанию».

Шаблон правил для robots.txt

К сожалению, шаблона для настройки robots.txt в части фильтра нет. Каждый проект индивидуален, и задача по настройке файла лежит на плечах SEO-специалиста. Некоторые типовые инструкции:

Закрываем все страницы пагинации.

Работает для всех битриксов.

Закрываем все страницы сортировки.

Может отличаться в зависимости от проекта.

Запрещают индексацию страниц фильтра.

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

Для облегчения первичной настройки воспользуйтесь «Стартовым набором robots.txt» от битрикс.

Автоматическое добавление в sitemap.xml

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

Сейчас мы делаем карту сайта «по старинке» — автоматически генерируем средствами битрикса и полуавтоматически добавляем адреса страниц фильтра.

Умный фильтр и коды ответа

Мы рекомендуем дорабатывать механизм фильтра так, чтобы он умел отдавать следующие коды состояния.

Правило	Пояснение

Страница с результатами фильтра существует и содержит хотя бы 1 товар.

Для случая, когда вы настраиваете «быструю ссылку». Страница с оригинальным адресом должна отдавать 301 редирект на нее.

Если поисковик обращается к странице с заголовком If-Modified-Since и страница не изменилась, сервер должен вернуть 304 Not Modified. Ниже цитата из документации Google.

Убедитесь, что ваш веб-сервер поддерживает HTTP-заголовок If-Modified-Since. С его помощью Google может узнать, изменился ли контент сайта с момента последнего сканирования. Эта функция помогает сократить лишнюю нагрузку на сервер — https://support.google.com/webmasters/answer/35769

Для случая, когда адрес страницы неверный.

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

Фильтр не требует квалификации программиста для настройки

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

Пока, лучшее решение — все настройки выносить в отдельные инфоблоки (highload-блоки), которые можно редактировать в интерфейсе админки.

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

Пример файла настроек

Пример реализации механизма расстановки уникальных заголовков на страницах фильтра (сайт dg-home.ru).

1. Разработали техническое задания для программирования — описали, какие должны быть заголовки и мета-теги страниц рубрики, фильтра, карточки товара.
2. Используем бесплатную библиотеку морфологического анализа phpMorphy ( http://phpmorphy.sourceforge.net/dokuwiki/ ). phpMorphy умеет склонять слова русского языка — заголовки и мета-описания получаются фонетически грамотными и привлекательными для пользователей.
3. Готовим CSV-файлики с настройками для какой категории какое свойство в каком порядке выводить и как правильно склонять его название.
4. На странице каталога в component_epilog.php размещаем код, который проверяет настройки в CSV для данной категории и устанавливает в соответствии с ними Title, H1, мета-теги. При большом объеме настройки надо выносить в инфоблоки или highload-блоки.

Ожидания директора магазина

1. Минимум, а лучше отсутствие изменений в учетной системе (1С). Все решать на стороне сайта. Если в 1С установлен свежий модуль обмена данными, никаких доработок на стороне 1С не потребуется. Максимум — аккуратно создать свойства товаров и привязать товары к соответствующим категориям.
2. Подрядчик должен решить задачу комплексно и ничего не сломать. Подрядчик умеет проектировать интерфейсы и оптимизировать сайты. Желательно участие SEO-специалиста в процессе написания технического задания на фильтр.

Скажем честно — комплексные веб-интеграционные проекты — это ни разу не весело. Мы справляемся, но тяжко всем. Заказчикам в том числе.

Если вы решили поручить работу с умным фильтром своему разработчику — пусть сначала читает нашу статью.

Внедрение умного и готового к seo фильтра на ваш проект

Можно внедрять постепенно, можно сразу все. Трудоемкость разработки всех описанных задач — 80 – 100 часов для среднего интернет-магазина.

Для больших (50 тысяч товаров и больше) появятся проблемы с производительностью, время увеличится на 30-50%.

Мы рассмотрели решение задач, которые возникают перед веб-разработчиками и SEO-специалистами при настройке умного фильтра на проектах с 1С-Битрикс. Будем рады, если вы поделитесь статьей в социальных сетях и напишете в комментариях, если мы что-то забыли.

Статья появилась благодаря работе с нашими заказчиками и их проектами:

Задача

При синхронизации каталога товаров из 1С на сайт приходят свойства в виде типа “список”.

Как описано в документации “Для формирования URL фильтра в зависимости от настроек фильтра участвуют значения: для строковых свойств – само значение свойства для свойств типа Список – внешний код для свойств Элемент и Раздел – символьный код если есть, иначе название. Для Пользовательских свойств – результат метода GetExtendedValue или GetPublicViewHTML с “MODE” => “SIMPLE_TEXT”. (Зависит от автора свойства).”. пруф

Т.е. в нашей ситуации при отметке галок в url будет что-то подобное:

А хочется видеть так:

В итоге нам нужно реализовать ЧПУ умного фильтра на основе значений свойств типа “список”, вместо их внешних кодов.

Решение

Вариант 1

У битрикса есть механизм “Короткие ссылки”, если SEO-специалистов это устроит, то они могут набить нужные адреса на подготовленные параметры фильтрации.

Вариант 2

Добиться нужного результата формирования УРЛ можно кастомизацией стандартного компонента. Для этого копируем стандартный компонент в свое “пространство имен” и правим его код.

В файле “class.php” ищем код:

На эту тему создана идея

Данный подход быстр, но мы теряем возможность обновлений.

Вариант 3

Еще одним вариантом решения задачи является добавления обработчика события на окончание синхронизации с 1с.

• Выбрать все свойства с типом “список” в инфоблоке каталога
• Зеркально создать свойства с такими же названиями (или нужными вам по логике именования) и типом “строка”
• Зеркально заполнить значения свойств для всех элементов инфоблока
• В фильтр вывести свойства с типом “строка” вместо “списка”

Данный подход самый трудозатратный из всех, но он не требует кастомизации компонента.

Чтобы настроить ЧПУ для умного фильтра, измените параметры компонента каталога:

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

Перейдите в пункт «Управление адресами страниц» и найдите поле «Url раздела для умного фильтра».

По умолчанию код ЧПУ выглядит так:

#SECTION_CODE_PATH#/filter/#SMART_FILTER_PATH#/apply/

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

Код состояния	Условие