Умный фильтр с ЧПУ для SEO — Делаем как надо

• Что такое умный фильтр
• В чем сложность и вопрос?
• История исследования и разработки умного фильтра
• Почему нельзя использовать умный фильтр Битрикса «из коробки»?
• Ожидания покупателя от работы фильтра
  • Какие флажки помещать в умный фильтр?
• Требования SEO-специалистов к умному фильтру
  • Уникальные title, keywords, description, h1.
  • «Быстрые ссылки» — готовые результаты фильтра
  • Размещение текста на странице с фильтром
  • Правильные canonical и отсутствие дублей
  • Шаблон правил для robots.txt
  • Автоматическое добавление в sitemap.xml
  • Умный фильтр и коды ответа
  • Фильтр не требует квалификации программиста для настройки
  • Пример реализации механизма расстановки уникальных заголовков на страницах фильтра (сайт dg-home.ru).
• Ожидания директора магазина
• Внедрение умного и готового к seo фильтра на ваш проект

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

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

Есть особый тип страниц — страницы фильтра. Их на порядок больше. Они собирают трафик по огромному количеству запросов и важны для 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.

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

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

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

• https://www.intervolga.ru/blog/marketing/fix-seo-problems-integration/#section9
• https://www.intervolga.ru/blog/projects/tipovye-pozhelaniya-seo-spetsialistov-dlya-internet-magazinov-na-1s-bitriks-i-sposoby-ikh-realizatsi/#section12

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

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

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

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

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

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

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

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

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

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

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

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

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

1. По умолчанию по адресу категории без GET-параметров выводим страницу с сортировкой по цене по возрастанию и внешним видом «Плитка». Эту страницу назначаем канонической с помощью тега

   <link rel="canonical" href="<адрес страницы>" />

2. 2-я, 3-я и все следующие страницы ссылаются на каноническую страницу по умолчанию. Для Google делаем дополнительно атрибуты

   rel="next" и rel="prev"

3. Все прочие направления сортировок и внешнего вида товаров (страницы с GET-параметрами, как правило) закрываем от индексации через robots.txt.

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

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

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

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

Disallow: /*PAGEN_
		

Disallow: /*ORDER_BY=
Disallow: /*desc=
Disallow: /*sort=
Disallow: *sort_by=*

Disallow: */filter/
Disallow: */apply/
Disallow: /?set_filter=

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

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

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

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

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

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

200 OK

301 Moved Permanently
		

304 Not Modified
		

404 Not Found
		

410 Gone
		

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

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

Пока, лучшее решение — все настройки выносить в отдельные инфоблоки (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С-Битрикс. Будем рады, если вы поделитесь статьей в социальных сетях и напишете в комментариях, если мы что-то забыли.

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

• ООО «КирпичРУ» (kirpich.ru);
• ООО «Декор и Дизайн» (dg-home.ru);
• ООО «ЛидерСтройИнструмент» (liderstroyinstrument.ru)
• ООО «Империя Садовода» (www.imperia-sadovoda.ru)