Что такое пагинация и как правильно её настроить
Мир веб-разработки — и поисковая оптимизация (Search Engines Optimization, SEO), в частности, — постоянно развивается, появляются новые методы и подходы для улучшения пользовательского опыта и видимости сайтов в поисковиках. Одной из важных техник при создании website с большим объемом контента является пагинация страниц (pagination). Пагинация — это разделение массива информации на небольшие части с их последовательным отображением для посетителя сайта. Проще говоря, нумерация страниц с однотипными данными, которую используют в различных каталогах. В статье мы рассказываем, для чего нужна пагинация, как она отражается на SEOs, и поделимся советами по ее правильной настройке.
Зачем нужна пагинация
Главной целью пагинации как способа организации данных на сайте является улучшение навигации — и для пользователей, и для поисковых роботов. Вместо загрузки одной огромной страницы посетитель может перемещаться между разными частями контента с помощью кнопок вида «Следующая страница» и «Предыдущая страница», что одновременно ускоряет работу ресурса и облегчает восприятие информации. Пагинация особенно актуальна для следующих websites:
- блогов с большим количеством постов;
- интернет-магазинов с объемными каталогами товаров;
- новостных порталов со статьями;
- словарей;
- фотобанков;
- других веб-проектов, где контент хранится огромными списками.
Даже сами поисковые системы используют пагинацию при отображении страницы результатов поиска (Search Engine Results Page или SERP). В большинстве случаев пользователь находит искомую информацию среди первых десяти ссылок — так зачем тратить ресурсы на загрузку остальных? Они откроются, только когда человек нажмет соответствующую кнопку. В этом и заключается смысл пагинации.
Изображение от storyset на Freepik.
Как пагинация влияет на оптимизацию для поисковых систем (SEO)
Как мы уже сказали, пагинация нужна для улучшения пользовательского опыта: повышения производительности и упрощения процесса перехода между частями сайта. Этими задачами определяется и ее влияние на поисковую оптимизацию. Растут поведенческие характеристики, а это ключевой фактор ранжирования в поиске. Однако из-за особенностей реализации эта техника может и негативно сказаться на SEO в плане индексации сайта краулерами (роботами поисковиков). Подробнее о двух точках влияния пагинации на сео расскажем ниже.
Удобство использования сайта
Когда большой массив информации разделен постранично, пользователям легче ее воспринимать, кроме того, они могут быстро переключаться между отдельными частями контента, чтобы найти нужные сведения. Не менее важна и скорость загрузки. Пагинация позволяет веб-сайту загружать только необходимый объем данных, что гораздо быстрее, чем ждать открытия всего имеющегося контента. Это крайне важно при медленных интернет-соединениях и использовании мобильных устройств.
Таким образом, пользователи видят, что сайт предлагает легкую навигацию и ускоренную загрузку, и вероятность отказа, т. е. того, что они покинут ресурс сразу после открытия, снижается. А снижение показателя отказов — важный сигнал для поисковых систем. Если люди остаются на сайте и исследуют его, значит, он им интересен и содержит качественный полезный контент. Соответственно, его нужно поднять на более высокие позиции на SERP.
Сканирование и индексация
Во-первых, несомненно, пагинация делает структуру веб-сайта более логичной и понятной для поисковых роботов. Благодаря уникальным URL они видят, что страницы пагинации являются отдельными единицами информации, а благодаря тегам — понимают, что они связаны последовательно. Однако эти же особенности способны ухудшить ранжирование, если настроить пагинацию неправильно. Поисковики могут счесть страницы каталога дублями, ведь их содержание зачастую повторяется при разных настройках фильтров. Неуникальный контент крайне негативно влияет на оптимизацию.
Другой важный нюанс пагинации заключается в появлении дополнительных страниц, не все из которых имеют значение для продвижения в поиске. В итоге индексирование бесполезного контента отнимает время и тратит краулинговый бюджет, предназначенный для более значимых страниц.
Настраиваем пагинацию правильно
Мы выяснили, что для извлечения максимальной пользы от внедрения пагинации необходимо уделить внимание ее грамотной оптимизации. Да, сам метод будет работать и без дополнительной настройки, но раз вы читаете эту статью, вас интересует, как добиться эффективности. Ниже рассказываем о трех манипуляциях, которые помогут вам сделать пагинацию более полезной.
Изображение от pch.vector на Freepik.
Настроить тег rel=«canonical»
Строго говоря, rel=«canonical» — это HTML-атрибут, который используется с тегом для указания ссылки на основную версию страницы среди всех дубликатов. При пагинации он сообщает поисковой системе, какой из «дублей» следует вносить в индекс и ранжировать. Обычно это первая страница категории в каталоге.
Чтобы способ сработал, добавьте внутрь тега конструкцию вида:
Где в значение атрибута href нужно подставить ссылку на вашу каноническую веб-страницу. При этом URL-адреса последующих страниц пагинации должны иметь вид:
https://site.ru/category/page/2https://site.ru/category/page/2 и т. д.
Вышеупомянутую конструкцию с атрибутом rel=«canonical» необходимо вставить на каждую из них.
Настроить теги rel=«next» и rel=«prev»
Два атрибута — rel=«next» и rel=«prev» — указывают краулерам на последовательность веб-страниц в наборе пагинации. Они также используются внутри тега , а тот, в свою очередь, — внутри . Начиная со второй страницы и до предпоследней включительно, весь каталог должен содержать в «хэде» две строки:
Где в строке с prev дается ссылка на предыдущую страницу, а в строке с next — на следующую. На первой и последней веб-страницах необходимо разместить только по одной строке того же вида — «next» с линком на вторую и «prev» с линком на предпоследнюю, соответственно.
Отметим, что оба атрибута несколько лет как перестали восприниматься поисковыми роботами и влиять на индексацию, но их все еще применяют с целью адаптации ресурса для людей с ограниченными возможностями.
Скрыть части пагинации от поисковых роботов
Не все части пагинации могут быть полезны для индексации. Например, страницы сортировки, фильтрации или с пустым контентом. Чтобы предотвратить индексирование таких веб-страниц, можно использовать файл robots.txt или мета-теги noindex, nofollow. Это позволит сосредоточить внимание поисковых роботов на важных частях контента.
Важно: не применяйте тег rel=«canonical» вместе с noindex на одной веб-странице. Если нужно указать на основной URL, но при этом нельзя индексировать страницу, лучше настройте 301 редирект.
Какие проблемы с SEO могут возникнуть при использовании пагинации
Частично мы уже разобрали, какие негативные последствия для поисковой оптимизации может вызвать неправильно настроенная пагинация. Чаще всего она приводит к двум проблемам:
- Дублирование контента. Содержание каталога зачастую повторяется: например, товары из одной категории могут содержать похожие описания и отличаться только брендом в названии. Если поисковик сочтет их дублями, то наложит санкции на весь сайт.
- Трата краулингового бюджета. За раз краулеры могут просканировать ограниченное количество страниц на одном веб-сайте, поэтому, если бот начнет изучать весь каталог, на другие разделы ресурса может не хватить лимита.
Чтобы избежать подобных ситуаций, воспользуйтесь рекомендациями, которые мы дали выше.
Заключение
Пагинация — это полезный инструмент для улучшения пользовательского опыта и оптимизации сайта для поисковых систем. Но его эффективность зависит от настроек, которые вы произвели. В статье мы рассказали о трех способах настроить пагинацию, учитывайте их при разработке и оптимизации веб-сайтов с большим объемом информации.
Пагинация для SEO: как сделать пагинацию
Пагинация на сайте — это разделение массива данных на несколько частей и вывод их на отдельных страницах. Чаще всего страницы пагинации встречаются в каталогах интернет-магазинов, списках статей или новостей информационных порталов, результатах поиска — словом, везде, где не обойтись без вывода большого количества однотипных элементов (товаров, статей и т. п.).
- Виды пагинации
- Номера страниц
- Пагинация Показать еще
- Бесконечный скролл
- Буквенная навигация
- Комбинированная пагинация
- Дубликаты страниц/некачественный контент
- Проблема индексации товаров
- Адреса страниц пагинации
- Индексация пагинации
- Ничего не делать
- Закрыть страницы пагинации
- Добавить на страницы пагинации rel=»canonical» со ссылкой на первую страницу
- Добавить на страницы пагинации rel=»canonical» со ссылкой на страницу со всеми товарами
- Добавить на страницы пагинации rel=»canonical» со ссылкой на самих себя
- Использовать атрибуты next и prev
- Уникализируем title
- Уникализируем description
- Не допускаем повторов текста
- Использование пагинации в продвижении
- Ускорить загрузку страницы — если на ней будет несколько десятков элементов, контент загрузится гораздо быстрее, чем если несколько тысяч.
- Повысить удобство поиска и просмотра элементов — это улучшит юзабилити и конверсию, т. е. сделает сайт более эффективным и прибыльным.
Казалось бы, ничего сложного, но нет. Одной из самых часто встречаемых технических ошибок на всех новых проектах является игнорирование требований SEO к пагинации, что в свою очередь негативно сказывается на позициях сайта в поиске.
Разберем, что такое страницы пагинации, рассмотрим самые частые примеры и узнаем как сделать пагинацию правильно.
Виды пагинации
Номера страниц
Самая распространенная навигация по страницам — это привычная нумерация с гиперссылками. Она подходит для большинства случаев и понятна пользователям.
Здесь важно не забывать о правильном и понятном интерфейсе:
- Текущую страницу выделяем среди остальных, чтобы посетителю сайта было ясно, на какой странице он находится.
- Выводим не сразу все ссылки, а только ближайшие к текущей — 10 оптимальное число.
- Добавляем ссылки типа Вперед и Назад для упрощения последовательного просмотра.
Пагинация Показать еще
Подгрузка новых элементов на текущую страницу по клику на кнопку создает эффект бесконечной прокрутки и усиливает вовлеченность пользователя. Ну а кнопка позволяет управлять этой прокруткой.
Бесконечный скролл
Можно отказаться от кнопки и автоматически подгружать элементы при достижении пользователем определенного положения на странице.
С точки зрения пользователя и реализации на мобильных устройствах — это самый удобный вариант. Не надо ничего кликать, просто листай, пока не устанешь.
Бесконечный скролл популярен в соцсетях и информационных порталах, чтобы максимально долго удерживать внимание пользователя, но на товарных сайтах не всегда может быть удобен.
Буквенная навигация
В случае поиска по алфавиту в качестве элементов навигации удобно использовать не цифры, а буквы.
Комбинированная пагинация
Популярный прием для организации навигации по страницам — это объединение нескольких способов. Например, номера страниц удобны в реализации и индексации, а бесконечная прокрутка показывает лучшую конверсию. Эти 2 способа можно использовать вместе:
Ошибки пагинации
Оптимизация страниц пагинации для интернет-магазинов и других сайтов крайне важна. Почему? Потому что неправильно настроенные страницы приводят к вероятности появления сразу 2х тяжелых «сео-грехов».
Дубликаты страниц/некачественный контент
Дубликаты страниц — весьма распространенная техническая ошибка сайта. Поисковики определяют дубли по браузерным заголовкам title, мета-описаниям description и, иногда, по содержимому страницы.
Пользователям не нужны тысячи копий одинаковых страниц, поэтому, как правило, в поиске остается только одна — не всегда та, что нужно: вместо первой страницы может ранжироваться 51-ая. Кроме того, если на вашем сайте множество дублирующих друг друга страниц, то значит вы — поставщик не очень качественного контента.
Как проверить:
1. Просканировать сайт с помощь Xenu, чтобы обнаружить дубликаты title и description, и изучить список проблемных страниц.
2. Зайти в панель Яндекс.Вебмастер — Индексирование — Страницы в поиске — Исключенные страницы и проверить те, которым присвоен статус Недостаточно качественная. Если там есть страницы пагинации, то скорее всего дело в дублировании заголовков.
Проблема индексации товаров
Краулинговый бюджет каждого сайта ограничен, потому что даже поисковики не обладают настолько мощными ресурсами, чтобы сканировать весь интернет каждый день. Вот пример трастового сайта с 44000+ страниц в индексе — средний показатель визитов ботов Google держится на уровне 12500. Если сайт меньше или на него никто не ссылается, то и посещений робота будет меньше.
При неправильно настроенной пагинации робот будет игнорировать большое число страниц листинга каталога, а значит не сможет просканировать размещенные на них товары.
Не рекомендуем полностью закрывать пагинацию от роботов — это только ухудшит ситуацию с индексацией товаров.
Как проверить:
Зайти в панель Яндекс. Вебмастер — Индексирование — Страницы в поиске — Все страницы и скачать список всех страниц из базы поиска Яндекса.
Отфильтровать строки в таблице по названию URL и проверить сколько карточек товаров попали в индекс. Если их меньше 90% от реально числа, то с индексацией есть существенные проблемы.
Настройка пагинации
Итак, без пагинации не обойтись, это действительно важные страницы сайта. Но как настроить SEO пагинацию правильно?
Адреса страниц пагинации
Адреса могут быть как статическими, так и динамическими.
Пример статического URL:
https://www.site-shop.ru/catalog/page-2/Пример динамического URL:
https://www.site-shop.ru/catalog?page=2Формат URLа не имеет решающего значения, его выбор, как правило, зависит от особенностей CMS.
Первая страница — это всегда начальная страница каталога, поэтому https://www.site-shop.ru/catalog/ и https://www.site-shop.ru/catalog/page-1/ будут по сути одной и той же страницей, дубликатами. Важно проследить, чтобы нигде в блоке навигации не формировалось ссылки на первую страницу с параметром. В любом случае обязательно проставьте 301 редирект с https://www.site-shop.ru/catalog/page-1/ на https://www.site-shop.ru/catalog/.
Помните, что нужно суметь обеспечить индексацию страниц навигации — то есть проставить на них ссылки на самом сайте. При выявлении плохой индексации добавьте ссылки также в sitemap.
Индексация пагинации
Есть несколько стратегий по управлению страницами пагинации, но сегодня ни про одну из них нельзя сказать, что она – та самая. Яндекс и Google молчат, вебмастера пробуют и ищут индивидуальный подход. Поэтому разберем все и выделим их особенности.
Ничего не делать
Этот путь всегда имеет место быть. Можно положиться на «умные алгоритмы» и никак не работать с пагинацией, однако результаты в таком случае непредсказуемы.
Закрыть страницы пагинации
Некоторые вебмастера советуют скрывать страницы пагинации, чтобы роботы не тратили время на обход неранжируемых страниц. Сделать это можно:
- размещением мета-тега в секции страниц пагинации;
- добавлением соответствующей директивы в файл с инструкциями для роботов robots.txt.
Почему не стоит выбирать такой подход, мы уже разобрали выше: этот метод приносит проблемы с индексацией товаров и их ранжированием в поиске. Но потенциально он может пригодиться тем сайтам, в поисковом индексе которых содержится огромное число страниц пагинации: для того, чтобы хоть как-то уменьшить их количество.
Здесь же стоит добавить и про второе значение атрибута content — follow/nofollow. Значение nofollow означает инструкцию для робота не выполнять переход по ссылкам на странице. Внутренние ссылки не стоит помечать nofollow в любом случае. Хорошо, если робот проигнорирует эти инструкции, но таким способом можно и прекратить сканирование, и нарушить передачу внутреннего веса другим страницам сайта.
Добавить на страницы пагинации rel=»canonical» со ссылкой на первую страницу
Несколько лет canonical-пагинация считалась оптимальной в Яндексе. Надо добавить тег с атрибутом rel=»canonical», указав первую страницу в качестве канонической. Например,
url: https://www.site-shop.ru/catalog/?page=3
В качестве преимущества данного подхода можно выделить:
- прохождение краулером по ссылкам на неканонических страницах — ведь их индексация не запрещена — а значит возможно и индексирование самих товаров;
- страницы пагинации не попадут в индекс и не будут создавать дублей;
- также они не будут мешать ранжированию основных страниц.
Однако Яндекс не так давно пересмотрел концепцию поиска и теперь неканонические страницы попадают в индекс по усмотрению робота. Поэтому если мы используем такой метод, делаем SEO для страниц пагинации.
Добавить на страницы пагинации rel=»canonical» со ссылкой на страницу со всеми товарами
Алгоритмы Google считают single-page content (чем больше товаров на странице, тем лучше) оптимальным выбором. Соответственно, если уж мы делаем какую-то страницу канонической для пагинации, то это должна быть страница со всеми товарами.
Например, мы создаем страницу с параметром page-all и устанавливаем ссылку на нее типа Смотреть все на других страницах каталога. Также прописываем canonical для страниц пагинации, где канонический адрес это страница page-all.
url: https://www.site-shop.ru/catalog/
Здесь есть сразу несколько подводных камней:
- не на всех CMS можно легко внедрить данный метод;
- страница со всеми товарами будет долго и тяжело загружаться, особенно если товаров очень много, либо сильно пострадает в качестве после того, как мы попытаемся эту загрузку ускорить.
Как вариант данного метода выступает решение назначить страницей со всеми товарами первую страницу каталога, но от этого пострадает и ее скорость загрузки, а следовательно поведенческие факторы.
Официальные рекомендации Google по работе с пагинацией были удалены в 2019 году и больше не публиковались. Возможно, это стоит рассматривать как намек, что поисковик сам разберется в пагинации, как бы вы ее не реализовали. Главная задача — обеспечить индексацию ссылок на страницах пагинации.
Добавить на страницы пагинации rel=»canonical» со ссылкой на самих себя
И, наконец, еще один вариант использования canonical – установить для каждой страницы пагинации в качестве канонической саму себя.
По сути этот метод похож на не делать ничего, но тут мы избегаем рисков дублирования среди страниц пагинации.
Использовать атрибуты next и prev
До марта 2019, когда ведущий аналитик и специалист по качеству поиска Google Джон Мюллер написал свой твит, эти теги также широко рекомендовались к использованию. Разметка prev-next указывает связь между страницами пагинации.
Для первой страницы мы указываем следующую за ней:
Для второй уже обозначаем и предыдущую страницу:
Для последней N-страницы указывается уже только предшествующая:
Но, как оказалось, Google уже несколько лет не использует эту разметку для сбора сигналов с группы страниц пагинации. И на поиске это никак не отразилось.
Так что если на вашем сайте есть эта разметка, то не надо ее удалять — она никак не влияет на ранжирование сайта и страниц пагинации. Кроме того, prev-next рекомендована W3C и используется другими поисковиками и браузерами.
SEO пагинация
Самая большая неприятность, которую создают страницы пагинации, это дублирование друг друга. Как следствие, сложность с выбором релевантной страницы, трудности в ранжировании.
Как настроить страницы пагинации, чтобы избежать данной проблемы:
Уникализируем title
Надо прописать собственные маски для title страниц пагинации, чтобы не возникало повторов с заголовком основной страницы и между собой.
Например, первая (основная) страница раздела:
url: https://www.site-shop.ru/catalog/udochki/ title: Удочки для рыбной ловли - купить удочку для рыбалки в интернет-магазинеСтраница пагинации #2:
url: https://www.site-shop.ru/catalog/udochki/?page=2 title: Удочки для рыбной ловли - купить удочку для рыбалки в интернет-магазине | Страница 2 или Удочки для рыбной ловли - Страница 2Короткий вариант более удобен и поместится на вкладке целиком.
Уникализируем description
Мета-описание description в том числе помогает поисковикам понять содержимое страницы. Если несколько страниц будут содержать одинаковое описание, то это как бы все про одно и то же. А если таких страниц много, то получается, что на нашем сайте мало информационной ценности. Поэтому все страницы, которые видит и обходит поисковик, должны иметь собственный уникальный description.
Уникализировать содержимое мета-тега можно опять же с помощью переменной “Страница #”.
Например, первая (основная) страница раздела:
url: https://www.site-shop.ru/catalog/udochki/ description: Купить удилища для рыбалки в интернет-магазине. Каталог и цены удочек на сайте. В наличии и на заказ 223 удочки от мировых производителей. Доставка по всей России.Страница пагинации #2:
url: https://www.site-shop.ru/catalog/udochki/?page=2 description: Купить удилища для рыбалки в интернет-магазине. Каталог и цены удочек на сайте - Страница 2.Не допускаем повторов текста
Оптимизированный текст должен быть размещен только на первой странице раздела и не повторяться на страницах пагинации.
Использование пагинации в продвижении
Еще одна возможность применить страницы пагинации в SEO — использовать их в качестве посадочных для запросов близких по смыслу, но «не садящихся» на одну страницу.
Например, у вас магазин детской мебели и вы не имеете возможности разбить в каталоге колыбели и кроватки, они выводятся вперемешку в одном разделе. Тогда первую страницу раздела оптимизируем под более частотную группу «детские кроватки», а вторую — под «колыбель». Title, description и текст должны быть настроены отдельно для каждой страницы.
Пример пагинации: чек-лист
На практике конкретное решение по пагинации обуславливается, прежде всего, техническими возможностями и системой управления. Но какой бы способ не был реализован на вашем сайте, обязательно сверьтесь с нашим чек-листом.
✔️ Каждая страница пагинации, начиная со второй, должна иметь собственный URL, динамический(/catalog/?page=2) или статический (/catalog/page2/). Выбор определяется оптимальностью технического решения.
✔️ Страницы пагинации, для которых не хватает товаров, например page=100000000, должны отдавать 404.
✔️ Первая страница в строке пагинации должна вести на основной урл, а не на page=1.
✔️ Страница пагинации #1 (/catalog/?page=1) должна возвращать код ответа сервера не 200, а 301 на основную страницу раздела (/catalog/).
✔️ Title каждой страницы пагинации отличается от title первой страницы и образуется по маске [Заголовок раздела — страница #], если не решено иное.
✔️ Description страниц пагинации формируется по маске с использованием переменных «Название раздела» и «Страница #».
✔️ Заголовок h1 на страницах пагинации не имеет критического значения. В зависимости от конкретной ситуации он может повторять заголовок на основной странице раздела или образовываться по маске «Страница # Название раздела».
✔️ Если в разделе есть текстовый контент, размещенный до или после листинга, то его можно выводить на страницах пагинации только в том случае, если он содержит важную информацию для пользователя — например, условия покупки или доставки.
✔️ При открытии какой-либо карточки товаров с любого места любой страницы пагинации при дальнейшем браузерном переходе Назад к каталогу пользователь должен вернуться именно к тому месту и к тем условиям выборки, из которых был совершен переход по ссылке.
✔️ Если присутствует функционал сортировки по цене, названию и т. д., отсортированная выборка должна сохранять порядок элементов при переключении страниц.
✔️ Если присутствует возможность сортировки выборки по цене, названию и т. д., она должна работать на всех страницах пагинации. При этом, если пользователь на момент сортировки находился не на первой странице, его должно перенести на первую с добавлением в урл параметров, соответствующим выбранным условиям сортировки.
Какой атрибут в представлении позволяет настроить пагинацию
Пагинация на сайте — это разделение массива данных на несколько частей и вывод их на отдельных страницах. Чаще всего страницы пагинации встречаются в каталогах интернет-магазинов, списках статей или новостей информационных порталов, результатах поиска — словом, везде, где не обойтись без вывода большого количества однотипных элементов (товаров, статей и т. п.).
Постраничная навигация нужна, чтобы:
- Ускорить загрузку страницы — если на ней будет несколько десятков элементов, контент загрузится гораздо быстрее, чем если несколько тысяч.
- Повысить удобство поиска и просмотра элементов — это улучшит юзабилити и конверсию, т. е. сделает сайт более эффективным и прибыльным.
Казалось бы, ничего сложного, но нет. Одной из самых часто встречаемых технических ошибок на всех новых проектах является игнорирование требований SEO к пагинации, что в свою очередь негативно сказывается на позициях сайта в поиске.
Разберем, что такое страницы пагинации, рассмотрим самые частые примеры и узнаем как сделать пагинацию правильно.
Виды пагинации
Номера страниц
Самая распространенная навигация по страницам — это привычная нумерация с гиперссылками. Она подходит для большинства случаев и понятна пользователям.
Постраничная навигация с номерами используется чаще всего
Здесь важно не забывать о правильном и понятном интерфейсе:
- Текущую страницу выделяем среди остальных, чтобы посетителю сайта было ясно, на какой странице он находится.
- Выводим не сразу все ссылки, а только ближайшие к текущей — 10 оптимальное число.
- Добавляем ссылки типа Вперед и Назад для упрощения последовательного просмотра.
Пагинация Показать еще
Подгрузка новых элементов на текущую страницу по клику на кнопку создает эффект бесконечной прокрутки и усиливает вовлеченность пользователя. Ну а кнопка позволяет управлять этой прокруткой.
Подгружайте достаточное количество товаров – от 30 до 50
Бесконечный скролл
Можно отказаться от кнопки и автоматически подгружать элементы при достижении пользователем определенного положения на странице.
С точки зрения пользователя и реализации на мобильных устройствах — это самый удобный вариант. Не надо ничего кликать, просто листай, пока не устанешь.
Пример бесконечной прокрутки в Pinterest
Бесконечный скролл популярен в соцсетях и информационных порталах, чтобы максимально долго удерживать внимание пользователя, но на товарных сайтах не всегда может быть удобен.
Буквенная навигация
В случае поиска по алфавиту в качестве элементов навигации удобно использовать не цифры, а буквы.
Буквенная пагинация на сайте интернет-магазина
Комбинированная пагинация
Популярный прием для организации навигации по страницам — это объединение нескольких способов. Например, номера страниц удобны в реализации и индексации, а бесконечная прокрутка показывает лучшую конверсию. Эти 2 способа можно использовать вместе:
Показать еще и постраничная нумерация часто используются вместе
Ошибки пагинации
Оптимизация страниц пагинации для интернет-магазинов и других сайтов крайне важна. Почему? Потому что неправильно настроенные страницы приводят к вероятности появления сразу 2х тяжелых «сео-грехов».
Дубликаты страниц/некачественный контент
Дубликаты страниц — весьма распространенная техническая ошибка сайта. Поисковики определяют дубли по браузерным заголовкам title, мета-описаниям description и, иногда, по содержимому страницы.
Пользователям не нужны тысячи копий одинаковых страниц, поэтому, как правило, в поиске остается только одна — не всегда та, что нужно: вместо первой страницы может ранжироваться 51-ая. Кроме того, если на вашем сайте множество дублирующих друг друга страниц, то значит вы — поставщик не очень качественного контента.
Как проверить:
1. Просканировать сайт с помощь Xenu, чтобы обнаружить дубликаты title и description, и изучить список проблемных страниц.
2. Зайти в панель Яндекс.Вебмастер — Индексирование — Страницы в поиске — Исключенные страницы и проверить те, которым присвоен статус Недостаточно качественная. Если там есть страницы пагинации, то скорее всего дело в дублировании заголовков.
Яндекс.Вебмастер: Исключенные страницы
Проблема индексации товаров
Краулинговый бюджет каждого сайта ограничен, потому что даже поисковики не обладают настолько мощными ресурсами, чтобы сканировать весь интернет каждый день. Вот пример трастового сайта с 44000+ страниц в индексе — средний показатель визитов ботов Google держится на уровне 12500. Если сайт меньше или на него никто не ссылается, то и посещений робота будет меньше.
Скрин графика сканирования из Google Search Console
При неправильно настроенной пагинации робот будет игнорировать большое число страниц листинга каталога, а значит не сможет просканировать размещенные на них товары.
Не рекомендуем полностью закрывать пагинацию от роботов — это только ухудшит ситуацию с индексацией товаров.
Как проверить:
Зайти в панель Яндекс. Вебмастер — Индексирование — Страницы в поиске — Все страницы и скачать список всех страниц из базы поиска Яндекса.
Яндекс.Вебмастер: Страницы в поиске
Отфильтровать строки в таблице по названию URL и проверить сколько карточек товаров попали в индекс. Если их меньше 90% от реально числа, то с индексацией есть существенные проблемы.
Настройка пагинации
Итак, без пагинации не обойтись, это действительно важные страницы сайта. Но как настроить SEO пагинацию правильно?
Адреса страниц пагинации
Адреса могут быть как статическими, так и динамическими.
Пример статического URL:
https://www.site-shop.ru/catalog/page-2/Пример динамического URL:
https://www.site-shop.ru/catalog?page=2Формат URLа не имеет решающего значения, его выбор, как правило, зависит от особенностей CMS.
Первая страница — это всегда начальная страница каталога, поэтому https://www.site-shop.ru/catalog/ и https://www.site-shop.ru/catalog/page-1/ будут по сути одной и той же страницей, дубликатами. Важно проследить, чтобы нигде в блоке навигации не формировалось ссылки на первую страницу с параметром. В любом случае обязательно проставьте 301 редирект с https://www.site-shop.ru/catalog/page-1/ на https://www.site-shop.ru/catalog/.
Помните, что нужно суметь обеспечить индексацию страниц навигации — то есть проставить на них ссылки на самом сайте. При выявлении плохой индексации добавьте ссылки также в sitemap.
Индексация пагинации
Есть несколько стратегий по управлению страницами пагинации, но сегодня ни про одну из них нельзя сказать, что она – та самая. Яндекс и Google молчат, вебмастера пробуют и ищут индивидуальный подход. Поэтому разберем все и выделим их особенности.
Ничего не делать
Этот путь всегда имеет место быть. Можно положиться на «умные алгоритмы» и никак не работать с пагинацией, однако результаты в таком случае непредсказуемы.
Закрыть страницы пагинации
Некоторые вебмастера советуют скрывать страницы пагинации, чтобы роботы не тратили время на обход неранжируемых страниц. Сделать это можно:
- размещением мета-тега в секции страниц пагинации;
- добавлением соответствующей директивы в файл с инструкциями для роботов robots.txt.
Почему не стоит выбирать такой подход, мы уже разобрали выше: этот метод приносит проблемы с индексацией товаров и их ранжированием в поиске. Но потенциально он может пригодиться тем сайтам, в поисковом индексе которых содержится огромное число страниц пагинации: для того, чтобы хоть как-то уменьшить их количество.
Страницы с мета noindex не будут проиндексированы роботом
Здесь же стоит добавить и про второе значение атрибута content — follow/nofollow. Значение nofollow означает инструкцию для робота не выполнять переход по ссылкам на странице. Внутренние ссылки не стоит помечать nofollow в любом случае. Хорошо, если робот проигнорирует эти инструкции, но таким способом можно и прекратить сканирование, и нарушить передачу внутреннего веса другим страницам сайта.
Добавить на страницы пагинации rel=»canonical» со ссылкой на первую страницу
Несколько лет canonical-пагинация считалась оптимальной в Яндексе. Надо добавить тег с атрибутом rel=»canonical», указав первую страницу в качестве канонической. Например,
Яндекс утверждает, что его робот проходит по ссылкам на неканонических страницах
В качестве преимущества данного подхода можно выделить:
- прохождение краулером по ссылкам на неканонических страницах — ведь их индексация не запрещена — а значит возможно и индексирование самих товаров;
- страницы пагинации не попадут в индекс и не будут создавать дублей;
- также они не будут мешать ранжированию основных страниц.
Однако Яндекс не так давно пересмотрел концепцию поиска и теперь неканонические страницы попадают в индекс по усмотрению робота. Поэтому если мы используем такой метод, делаем SEO для страниц пагинации.
Добавить на страницы пагинации rel=»canonical» со ссылкой на страницу со всеми товарами
Алгоритмы Google считают single-page content (чем больше товаров на странице, тем лучше) оптимальным выбором. Соответственно, если уж мы делаем какую-то страницу канонической для пагинации, то это должна быть страница со всеми товарами.
Например, мы создаем страницу с параметром page-all и устанавливаем ссылку на нее типа Смотреть все на других страницах каталога. Также прописываем canonical для страниц пагинации, где канонический адрес это страница page-all.
Появляется новая страница на сайте со всеми товарами
Здесь есть сразу несколько подводных камней:
- не на всех CMS можно легко внедрить данный метод;
- страница со всеми товарами будет долго и тяжело загружаться, особенно если товаров очень много, либо сильно пострадает в качестве после того, как мы попытаемся эту загрузку ускорить.
Как вариант данного метода выступает решение назначить страницей со всеми товарами первую страницу каталога, но от этого пострадает и ее скорость загрузки, а следовательно поведенческие факторы.
Официальные рекомендации Google по работе с пагинацией были удалены в 2019 году и больше не публиковались. Возможно, это стоит рассматривать как намек, что поисковик сам разберется в пагинации, как бы вы ее не реализовали. Главная задача — обеспечить индексацию ссылок на страницах пагинации.
Добавить на страницы пагинации rel=»canonical» со ссылкой на самих себя
И, наконец, еще один вариант использования canonical – установить для каждой страницы пагинации в качестве канонической саму себя.
Этот подход распространен в англоязычном SEO
По сути этот метод похож на не делать ничего, но тут мы избегаем рисков дублирования среди страниц пагинации.
Использовать атрибуты next и prev
До марта 2019, когда ведущий аналитик и специалист по качеству поиска Google Джон Мюллер написал свой твит, эти теги также широко рекомендовались к использованию. Разметка prev-next указывает связь между страницами пагинации.
Для первой страницы мы указываем следующую за ней:
Для второй уже обозначаем и предыдущую страницу:
Для последней N-страницы указывается уже только предшествующая:
Последовательная перелинковка страниц пагинации
Но, как оказалось, Google уже несколько лет не использует эту разметку для сбора сигналов с группы страниц пагинации. И на поиске это никак не отразилось.
Так что если на вашем сайте есть эта разметка, то не надо ее удалять — она никак не влияет на ранжирование сайта и страниц пагинации. Кроме того, prev-next рекомендована W3C и используется другими поисковиками и браузерами.
SEO пагинация
Самая большая неприятность, которую создают страницы пагинации, это дублирование друг друга. Как следствие, сложность с выбором релевантной страницы, трудности в ранжировании.
Как настроить страницы пагинации, чтобы избежать данной проблемы:
Уникализируем title
Надо прописать собственные маски для title страниц пагинации, чтобы не возникало повторов с заголовком основной страницы и между собой.
Например, первая (основная) страница раздела:
Страница пагинации #2:
Короткий вариант более удобен и поместится на вкладке целиком.
Уникализируем description
Мета-описание description в том числе помогает поисковикам понять содержимое страницы. Если несколько страниц будут содержать одинаковое описание, то это как бы все про одно и то же. А если таких страниц много, то получается, что на нашем сайте мало информационной ценности. Поэтому все страницы, которые видит и обходит поисковик, должны иметь собственный уникальный description.
Уникализировать содержимое мета-тега можно опять же с помощью переменной “Страница #”.
Например, первая (основная) страница раздела:
Страница пагинации #2:
Не допускаем повторов текста
Оптимизированный текст должен быть размещен только на первой странице раздела и не повторяться на страницах пагинации.
Использование пагинации в продвижении
Еще одна возможность применить страницы пагинации в SEO — использовать их в качестве посадочных для запросов близких по смыслу, но «не садящихся» на одну страницу.
Например, у вас магазин детской мебели и вы не имеете возможности разбить в каталоге колыбели и кроватки, они выводятся вперемешку в одном разделе. Тогда первую страницу раздела оптимизируем под более частотную группу «детские кроватки», а вторую — под «колыбель». Title, description и текст должны быть настроены отдельно для каждой страницы.
Пример пагинации: чек-лист
На практике конкретное решение по пагинации обуславливается, прежде всего, техническими возможностями и системой управления. Но какой бы способ не был реализован на вашем сайте, обязательно сверьтесь с нашим чек-листом.
✔️ Каждая страница пагинации, начиная со второй, должна иметь собственный URL, динамический(/catalog/?page=2) или статический (/catalog/page2/). Выбор определяется оптимальностью технического решения.
✔️ Страницы пагинации, для которых не хватает товаров, например page=100000000, должны отдавать 404.
✔️ Первая страница в строке пагинации должна вести на основной урл, а не на page=1.
✔️ Страница пагинации #1 (/catalog/?page=1) должна возвращать код ответа сервера не 200, а 301 на основную страницу раздела (/catalog/).
✔️ Title каждой страницы пагинации отличается от title первой страницы и образуется по маске [Заголовок раздела — страница #], если не решено иное.
✔️ Description страниц пагинации формируется по маске с использованием переменных «Название раздела» и «Страница #».
✔️ Заголовок h1 на страницах пагинации не имеет критического значения. В зависимости от конкретной ситуации он может повторять заголовок на основной странице раздела или образовываться по маске «Страница # Название раздела».
✔️ Если в разделе есть текстовый контент, размещенный до или после листинга, то его можно выводить на страницах пагинации только в том случае, если он содержит важную информацию для пользователя — например, условия покупки или доставки.
✔️ При открытии какой-либо карточки товаров с любого места любой страницы пагинации при дальнейшем браузерном переходе Назад к каталогу пользователь должен вернуться именно к тому месту и к тем условиям выборки, из которых был совершен переход по ссылке.
✔️ Если присутствует функционал сортировки по цене, названию и т. д., отсортированная выборка должна сохранять порядок элементов при переключении страниц.
✔️ Если присутствует возможность сортировки выборки по цене, названию и т. д., она должна работать на всех страницах пагинации. При этом, если пользователь на момент сортировки находился не на первой странице, его должно перенести на первую с добавлением в урл параметров, соответствующим выбранным условиям сортировки.
Какой атрибут в представлении позволяет настроить пагинацию
Данное руководство устарело. Актуальное руководство: Руководство по ASP.NET Core
Одной из распространенных задач при работе с данными является проблема пагинации или разделения данных на несколько блоков — страниц, которые выводятсяв представление по отдельности и которые сопровождаются удобной навигацией по страницам. Для создания пагинации мы можем воспользоваться готовыми плагинами. Но в данном случае мы сами создадим механизм для постраничного вывода.
Вначале опрелелим модель, данные которой будем выводить:
Также определим модель, которая будет описывать механизм пагинации, а также дополнительную модель для вывода данных в представление:
Так как вместе с данными моделей телефонов потребуется также использовать в представлении модель пагинации, то они инкапсулируются классом IndexViewModel .
Теперь определим контроллер и его метод для вывода данных:
Для простоты примера я создаю обычный список в конструкторе контроллера, однако это мог бы быть и вывод из базы данных.
Метод Index в качестве параметра принимает номер страницы. По умолчанию номер страницы будет равняться единице.
В самом методе с помощью комбинации методов Skip и Take происходит отбор нужной части данных: метод Skip() пропускает определенное количество данных, которое передается в параметре, а метод Take() извлекает определенное количество.
Для создания механизма пагинации в представлении удобно использовать хелперы. Создадим собственный хелпер. Для этого добавим в проект папку Helpers и затем добавим в нее следующий класс:
Данный хелпер просто создет блок ссылок, а также добавляет им классы для визуализации. Классы могут быть любыми, но в данном случае использовались стандартные классы bootstrap.
Мега-Учебник Flask, Часть 9: Пагинация
Это девятая статья в серии, где я описываю свой опыт написания веб-приложения на Python с использованием микрофреймворка Flask.
Цель данного руководства — разработать довольно функциональное приложение-микроблог, которое я за полным отсутствием оригинальности решил назвать microblog.
Краткое повторение
В предыдущей статье мы внесли все необходимые изменения в базу данных, для поддержки парадигмы «подписчики», в которой пользователи могут отслеживать посты других пользователей.
Сегодня мы, опираясь на то, что мы сделали в прошлый раз, доведем наше приложение до ума, чтобы оно принимало и доставляло настоящий контент для наших пользователей. Сегодня мы попрощаемся с последним из наших фейковых объектов!
Представление сообщений в блоге
Давайте начнем с чего-то простого. Домашняя страница должна иметь пользовательскую форму для новых постов.
Сначала мы определим объект формы с одним полем (файл app/forms.py) :
Далее, мы добавим форму в шаблоны (файл app/templates/index.html) :
Ничего сверхъестественного, как вы можете заметить. Мы просто добавляем еще одну форму, так же как мы делали раньше.
И напоследок функция представления, которая связывает все вместе (файл app/views.py) :
Давайте рассмотрим изменения которые мы сделали в этой функции, шаг за шагом:
- Сначала мы импортируем классы Post и PostForm
- Мы принимает POST-запросы с обоих маршутов, связаных с функцией представления index() , здесь мы будем принимать новые посты.
- Прежде чем пост сохранится в базу он попадает в эту функцию. Когда мы попадаем в эту функцию через GET, всё происходит как и раньше.
- Шаблон теперь получает дополнительный аргумент, форму, которую он рендерит в текстовые поля.
И напоследок, перед тем как мы продолжим. Обратите внимание, что перед записью нового поста в базу мы делаем это:
Мы можем с легкостью пропустить этот редирект и перейти к рендерингу. Возможно это даже будет эффективней. Потому что все что делает этот редирект, на самом деле, это возвращает нас в эту же самую функцию.
Итак, почему редирект? Рассмотрим что происходит, когда пользователь пишет пост в блог, публикует его и жмет кнопку «Обновить». Что делает команда «Обновить»? Браузер повторно отправляет предыдущий запрос.
Без редиректа, последний был POST-запрос, который отправил форму, поэтому действие «Обновить» повторно пошлет этот запрос, в результате чего мы получим второй пост, идентичный первому. Это плохо.
Но с редиректом мы заставим браузер выдает еще один запрос после отправки формы. Это простой GET-запрос, и теперь кнопка «Обновить» будет просто еще раз загружать страницу, вместо повторной отсылки формы.
Этот простой трюк позволяет избежать вставки дубликатов сообщения, если пользователь случайно обновляет страницу, после публикации поста.
Отображение сообщений в блоге
Переходим к самому интересному. Мы собираемся вытащить из базы посты и отобразить их.
Если вы помните, несколько статей назад, мы сделали пару фейковых постов и мы показывали их на нашей главной странице долгое время. Эти фейковые объекты были созданы явным образом в функции представления в виде списка Python:
Но в последней статье мы создали запрос, которых позволяет на получить все сообщения от людей на которых подписан пользователь, так что мы можем просто заменить вышеуказанные строки (файл app/views.py) :
Теперь, когда вы запустите приложение, вы увидите посты из базы данных!
Метод followed_post класса User возвращает объект query sqlalchemy который сконфигурирован чтобы вытащить интересущие нас сообщения. Вызвав метод all() на этом объекте мы получим все посты в виде листа, так что в конечном счете мы будем работать с привычной нам структурой. Они так похожи, что шаблон ничего не заметит.
Сейчас вы можете поиграть с нашим приложением. Не стесняйтесь. Вы можете создать несколько пользователей, подписать их на других пользователей, и, наконец, опубликовать несколько сообщений, чтобы видеть как каждый пользователь видит свою ленту.
Пагинация
Наше приложение выглядит лучше чем когда-либо, но есть проблема. Мы показывает все сообщения на домашней странице. Что случится, если пользователь окажется подписан на несколько тысяч человек? Или миллион? Как вы можете представить, выборка и обработка такого большого списка будет крайне неэффективна.
Вместо этого, мы будем показывать потенциально большое количество постов разбив на страницы.
Flask-SQLAlchemy поставляется с очень хорошей поддержкой пагинации. Если, например, мы хотим получить первые три поста от отслеживаемых пользователей, мы можем сделать так:
Метод paginate вызывается на любом объекте query . Он принимает три аргумента:
- Номер страницы, начиная с 1
- количество элементов на страницу,
- и флаг error. Если флаг выставлен в True, когда происходит выход за пределы списка, клиенту возвращается ошибка 404.
- В противном случает будет возвращен пустой список вместо ошибки.
Метод paginate возвращает объект Pagination. Члены этого объекта содержат список элементов запрошеной страницы. В объекте Pagination есть и другие полезные вещи, но их мы рассмотрим чуть позже.
Давайте подумаем, как мы можем реализовать пагинацию в нашей функции представления index(). Мы можем начать с добавления элемента конфигурации нашего приложения, который определяет сколько элементов на странице мы будем показывать.
Это хорошая идея, хранить глобальные настройки приложения, которые могут влиять на поведение, в одном месте.
В финальном приложении мы, конечно, будем использовать число больше 3, но для тестирования удобней работать с небольшим количеством.
Далее, давайте решим сейчас как будут выглядеть URL с запросом страницы. Мы видели раньше что Flask позволяет принимать аргументы в маршрутах, так что мы можем добавить суффикс, который укажет на нужную страницу:
Такой формат URL может быть легко реализован с помощью дополнительного маршрута в нашем представлении (файл app/views.py) :
Наш новый маршрут дергает аргумент с номером страницы и объявляет его как целое число. Нам также нужно добавить этот аргумент в функцию index() и выставить значение по уполчанию, потому что два из трех маршрутов не используют этот аргумент, и для них он будет использоваться со значением по умолчанию.
Сейчас, когда у нас есть номер страницы, мы можем его легко подключить к нашему запросу followed_posts , вместе с переменной POSTS_PER_PAGE , которую мы определили ранее.
Обратите внимание, как легко проходят эти изменения, и как мало изменяется код. Мы пытаемся писать каждую часть приложения, не пытаясь предполагать как работают другие части, что позволяет нам строить модульные и надежные приложения, которые легко тестировать.
Сейчас вы можете испытать пагинацию, вводя URL с разными номерами строк в адресную строку браузера. Убедитесь что доступно более трех постов, которые вы видите на странице.
Навигация по страницам
Теперь нам нужно добавить ссылки с помощью которых пользователь сможет перемещаться к следующей/предыдущей странице, и к счастью для нас Flask-SQLAlchemy сделает большую часть работы.
Мы собираемся начать внеся небольшие изменения в функцию представления. В нашей текущей версии мы используем пагинацию следующим образом:
Делая это, мы только сохраняем элементы объекта Pagination, возвращаемого методом paginate. Но этот объект предоставляет несколько очень полезных возможностей, так что мы будем хранить весь объект целиком (файл app/views.py) :
Чтобы копменсировать это изменение, мы должны изменить шаблон (файл app/templates/index.html) :
Что нам дает объект Paginate в шаблоне. Вот методы объекта, которые мы будем использовать:
- has_next: True есть есть хоть одна страница после текущей
- has_prev: True если есть хоть одна страница перед текущей
- next_num: номер следующей страницы
- prev_num: номер предыдущей страницы
С их помощью мы можем сделать следующее (файл app/templates/index.html) :
Теперь у нас есть две ссылки. Вначале мы покажем ссылку «Newer posts», которая отправит нас к предыдущей странице, к новым постам. С другой стороны «Older posts» отправит нас на следующую страницу, к более старым постам.
Но, когда мы находимся на первой странице, ссылка на предыдущую страницу нам не нужна. Такой случай легко отследить по методу posts.has_prev, который вернет False. В этом случае мы показываем текст ссылки, но без самой ссылки. Ссылка не следующую страницу обрабатывается таким же образом.
Реализация подшаблона Post
Ранее, в статье, в которой мы добавляли аватар, мы определим подшаблон с HTML кодом рендеринга одиночного поста. Мы сделали этот шаблон, чтобы избавиться от дублирования кода, если захотим рендерить посты на разных страницах.
Настало время реализации этого подшаблона на главной странице Это будет так же просто, как и большинство вещей, которые мы делаем сегодня (файл app/templates/index.html) :
Удивительно, да? Мы просто заменили старый код рендеринга на include нашего шаблона. Таким образом мы получим более хорошую версию рендеринга, с аватаром пользователя.
Вот скриншот главной страницы в текущем состоянии:
Страница с профилем пользователя
Сейчас мы закончили с главной страницей. Мы также включили сообщения в профиле пользователя, но не все, а только владельца профиля. Чтобы быть последовательными мы должны изменить страницу профиля, чтобы он соответствовал главной странице.
Изменения аналогичны тем, которые мы сделали на главной странице. Вот краткий список того, что нам нужно сделать:
- добавить дополнительный маршрут, который принимает номер страницы
- добавить аргумент с номером страницы в функцию представления и присвоить ему 1
- заменить фейковые посты настоящими из базы и разбить их на страницы
- обновить шаблон для использования объекта pagination
Это обновления функции представления (файл app/views.py) :
Обратите внимание, что эта функция уже имеет аргумент (никнейм пользователя), поэтому мы добавим номер страницы как второй аргумент.
Изменения в шаблоне тоже довольно просты (файл app/templates/user.html) :
Заключительные слова
Ниже я выкладываю обновленную версию приложения microblog во всеми изменениями, сделанными в этой статье.
Как всегда, базы данных нет, вы должны создать ее самостоятельно. Если вы следите за этой серией статей, вы знаете как это делать. Если же нет, то вернитесь к статье о базе данных, чтобы узнать.
Как всегда, я благодарю за то что следите за мной. Я надеюсь увидеть вас в следующей статье.
Похожие публикации:
- Какое действие не характеризует первоклассное выражение javascript
- Какое приложение позволяет открывать файлы обозначенные следующим значком
- Какой бензопилы подходит блок зажигания на макиту
- Какой картой можно платить за яндекс драйв
Что такое пагинация и как правильно ее настраивать
Пагинация — это нумерация страниц по возрастанию, которую используют на сайте для последовательного отображения контента. Поэтапная загрузка актуальна для сайтов с большим ассортиментом, например, интернет-магазинов и маркетплейсов, а также для новостных порталов, блогов и других ресурсов, где представлено множество материалов. Нумерация отображается вверху или внизу страницы и с ее помощью пользователи могут переходить от одной группы ссылок к другой.
Как пагинация влияет на SEO?
Разбивка информации по частям повышает его юзабилити. При этом важно корректно настроить пагинацию — от этого зависит попадание важного контента в индекс Google. И удобство сайта для пользователей, и индексирование ресурса непосредственно влияют на видимость сайта в поисковой выдаче. Рассмотрим эти факторы подробнее.
Юзабилити сайта
- Поведенческие факторы
Одним из косвенных признаков качества контента является время нахождения пользователей на сайте, которое увеличивается при просмотре страниц пагинации.
Пагинация позволяет упростить и сделать более комфортным просмотр и поиск содержимого ресурса. Пользователю сразу понятна структура сайта, и он с легкостью может попасть на желаемую страницу одим щелчком мыши.
Сканирование и индексация
Чтобы страницы пагинации попали в результаты выдачи, важно учитывать некоторые особенности индексации страниц роботами:
Для Google важно, чтобы все страницы сайта отличались содержимым — дублирование контента может привести к проблемам с индексацией. Страницы пагинации воспринимаются поисковыми роботами как отдельные URL-адреса. При этом они обычно похожи между собой и малополезны для пользователей.
У бота поисковой системы есть определенный лимит страниц, которые он может просканировать за одно посещение сайта. Когда Googlebot обходит крупные ресурсы с многочисленными страницами пагинации, бюджета может не хватить для других важных URL-адресов. В результате их содержимое может индексироваться позже или вовсе не проиндексироваться.
Подходы в настройке SEO-пагинации
Есть несколько стратегий, которые помогают сделать так, чтобы страницы пагинации не воспринимались поисковиками как дубли и смогли попасть в результаты поиска. Рассмотрим основные варианты правильной настройки пагинации.
Индексировать все страницы пагинации и их содержимое
В этом случае все пронумерованные страницы оптимизируют согласно рекомендациям поисковых систем — делают их содержимое уникальным и настраивают взаимосвязи между URL-адресами, чтобы проинструктировать роботов.
Особенности: страницы пагинации и URL-адреса, которые на них размещены, попадают в индекс и начинают участвовать в ранжировании. Это универсальный вариант, который подойдет как для небольших, так и для длинных цепочек пагинации.
Индексировать одну общую страницу со всеми результатами
Еще один подход — пагинация с тегом rel=canonical. Вам необходимо добавить на каждую страницу пагинации каноническую ссылку, которая ведет на View all (то есть общую страницу со всеми результатами). Каноническая ссылка будет указывать роботу на приоритетный для индексации контент среди копий, и в то же время карулер сможет пройти через все ссылки неканонических страниц (индексацию которых никто не запрещал). Таким образом вы указываете, что неосновные страницы типа page=2/3/4, не нужно индексировать.
Такой тег выглядит вот так:
Особенности: этот способ подойдет для небольших категорий сайта, например, при отображении результатов трех-четырех страниц пагинации. Если страниц больше, такой вариант не подойдет, поскольку загрузка большого объема информации на одной странице может негативно отражаться на ее скорости.
Закрыть страницы пагинации от индексирования
С помощью специальных команд роботам запрещают индексировать все страницы пагинации, кроме первой. Это позволяет сохранить краулинговый бюджет для обхода других важных URL-адресов. Также это простой способ скрыть дубли страниц.
Закрыть страницы пагинации можно директивой в файле robots.txt:
Disallow: *page=
Но так как файл robots.txt это всего лишь набор рекомендаций для краулера, которые он может и не выполнять, лучше закрыть страницы с помощью метатега robots.
Для этого добавьте в страницы.
Сам код будет выглядеть вот так:
(…) (…)
Особенности: вариант актуален для крупных сайтов с объемными разделами и категориями. Для такого метода обязательное наличие корректной XML-карты. Из минусов — велика вероятность получить проблемы с индексированием товарных страниц, размещенных на закрытых от Google-бота страницах пагинации.
Бесконечная прокрутка
Возможно, вы уже сталкивались с бесконечной прокруткой в интернет-магазинах, где при скролинге постоянно появляются новые элементы внизу экрана. Такой тип пагинации называется single-page content. Настраивается динамическая демонстрация содержимого с помощью Ajax-подгрузок в JavaScript.
Согласно рекомендациям Google, для реализации бесконечной прокрутки необходимо обеспечить постраничную загрузку контента. Таким образом вы дадите пользователям возможность возвращаться к уже просмотренным материалам и делиться ими. Как это реализовать? Просто предоставьте уникальные ссылки на каждый раздел, чтобы юзеры могли переходить по ним, копировать их и т.д. Поисковик рекомендует использовать History API для обновления URL во время динамической загрузки контента.
Особенности: автоматическая подгрузка контента задерживает посетителя на сайте. Но этот тип пагинации имеет несколько недостатков. Во-первых, нет возможности поставить в закладки определенную страницу, чтобы вернуться к ее изучению. Во-вторых, футер в таком случае будет неуловим. Втретьих, на полосе прокрутки не отображается реальный прогресс просмотра.
Ошибки SEO-пагинации и как их обнаружить
Теперь поговорим о проблемах пагинации на сайте, которые можно выявить, используя специальные инструменты.
1. Неправильная настройка канонических ссылок
Как мы уже говорили, канонические ссылки используют, чтобы перенаправлять роботов к приоритетным для индексации URL-адресам. На копиях или похожих страницах указывают атрибут rel=”canonical”, который ведет на основной (канонический) вариант. В некоторых случаях каноническая ссылка находится на той же странице, на которую она ведет, усиливая вероятность индексации этого URL-адреса.
Если канонические ссылки настроены неправильно, система может проигнорировать указания на приоритетный URL.
2. Одновременное использование canonical и noindex в метатеге robots
Никогда не смешивайте noindex и rel=canonical, так как они противоречат друг другу. В то время как rel=canonical указывает поисковику на приоритетный URL и пересылает все сигналы на основную страницу, noindex просто говорит краулеру не индексировать страницу. При этом noindex является более сильным сигналом для Google
Если вы хотите, чтобы адрес не индексировался и при этом указывал на каноничный, используйте редирект 301.
3. Одновременное использование запрета в robots.txt и canonical
Подобно описанной выше ошибке, некоторые специалисты настраивают на неканонические страницы запрет в robots.txt.
User-agent: * Disallow: /
Но так делать не стоит. Иначе бот просто не сможет просканировать страницу и не считает установленный canonical. А значит краулер просто не поймет, какая из страниц каноническая.
Инструменты для поиска проблем SEO-пагинации на сайте
С помощью сервисов для вебмастеров можно быстро обнаружить ошибки, связанные с оптимизацией сайта, включая пагинацию.
Google Search Console
Во вкладке «Исключено» раздела «Покрытие» отображаются непроиндексированныеа URL-адреса. Здесь можно увидеть, какие страницы сайта были определены поисковиком как копии без корректных директив от пользователя.
Стоит обратить внимание на отчеты «Страница является копией», поскольку здесь есть информация о проблемах в настройке канонических ссылок. Если ни одна из копий страниц не определена в качестве канонической, или приоритетный URL, выбранный вебмастером, не совпадает с URL-адресом, рекомендуемым Google.
SEO-сервисы для комплексного аудита сайта
При помощи специальных инструментов можно провести детальный аудит ресурса по всем техническим параметрам. «Аудит сайта» от SE Ranking проверяет более 120 параметров и дает рекомендации по исправлению ошибок. Инструмент помогает выявить все проблемы, связанные с пагинацией, — дублирующийся контент, проблемы с каноническими URL-адресами. Дополнительно «Аудит сайта» укажет на повторения title, description и H1, что часто является признаком страниц пагинации.
Как оптимизировать страницы пагинации?
Давайте пошагово разберем, как настроить SEO-пагинацию в зависимости от выбранного подхода.
Цель 1. Индексация всех страниц пагинации
Для успешной индексации поисковиками страницы нужно оптимизировать. Они должны отличаться адресами.
Настройка SEO-пагинации:
1. Создайте страницы пагинации с уникальными URL.
Чтобы поисковик воспринимал пагинацию в качестве отдельных страниц, используйте вложенность URL-адресов по принципу url/n или параметры запроса ?page=n, где n — номер страницы в последовательности.
Не стоит применять идентификаторы нумерации в виде #, поскольку Google их игнорирует и не распознает следующий за символом текст. Поисковик может определить URL как ранее обработанный и не заносить его в индекс.
2. Свяжите страницы пагинации друг с другом.
Добавьте в код каждой страницы ссылку на следующий по счету URL, используя тег . Также стоит указывать ссылку на первый URL пагинации. Это будет дополнительным сигналом о том, какую страницу цепочки выбирать целевой при ранжировании.
3. Обеспечьте индексацию страниц с помощью канонических ссылок.
Чтобы сделать каждую страницу пагинации канонической, в теге необходимо указать атрибут rel=”canonical” для каждой страницы и ссылку, ведущую на эту страницу.
Цель 2. Индексация одной общей страницы View all
Эта стратегия поможет эффективно оптимизировать общую страницу с результатами пагинации, чтобы она отображалась по запросам и занимала высокие позиции.
Настройка SEO-пагинации:
1. Создайте страницу, объединяющую все результаты страниц пагинации.
Таких страниц у сайта может быть несколько в зависимости от количества разделов и категорий сайта, для которых применена пагинация.
2. Укажите страницу «View all» в качестве канонической.
В теге каждой страницы пагинации должен быть атрибут rel=”canonical”, направляющий робота на общий URL — приоритетную для индексирования страницу.
3. Ускорьте загрузку страницы «View all».
Скорость отображения контента на экранах компьютеров и мобильных устройств влияет на позиции URL-адреса в выдаче. Определите причины, снижающие производительность страницы View all, например, с помощью онлайн-сервиса PageSpeed Insights. Затем сведите к минимуму все негативные для скорости факторы.
Цель 3. Ограничение индексации страниц пагинации
Проинструктировать краулеров нужно таким способом, чтобы запрет индексации касался только страниц пагинации. URL-адреса товаров и других результатов, разделенные на кластеры, должны остаться видимыми роботам.
Настройка SEO-пагинации:
1. Ограничьте индексацию всех страниц пагинации, кроме первой.
Не стоит для этого использовать файл robots.txt. Более предпочтительным будет следующий способ способов:
- Запрет индексации с помощью метатега robots.
В блок страниц пагинации от второй и выше нужно добавить метатег meta name=”robots” content=”noindex, follow”. Такая комбинация команд препятствует индексации страницы и при этом разрешает переходить по ссылкам, указанным на ней.
2. Оптимизируйте первую страницу пагинации.
Поскольку эта страница должна попасть в индекс, подготовьте ее к участию в ранжировании, уделяя внимание содержимому — контенту и тегам.
Заключение
Пагинация — это поэтапное отображение контента в виде пронумерованных страниц, улучшающее юзабилити сайта. В то же время от настройки страниц пагинации зависит индексация важного для ресурса контента.
Есть несколько способов реализовать SEO-пагинацию на сайте:
- индексация всех страниц пагинации;
- индексация одной общей страницы «View All»;
- запрет на индексацию всех страниц пагинации, кроме первой.
Выявлять проблемы пагинации и проверять корректность ее настройки помогают специальные инструменты. Например, раздел «Покрытие» в Google Search Console и комплексный «Аудит сайта» от SE Ranking.
