Правильная пагинация в каталоге товаров. Что такое пагинация (pagination) и как оптимизировать разметку страниц

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

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

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

Бесконечный скроллинг

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

Достоинства:

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

Недостатки:

• Нет возможности добавить свое местоположение в закладки, если нужно вернуться позже;
• После закрытия сайта, чтобы попасть в эту точку снова, приходится проделать весь путь с самого начала;
• Невозможно определить свое положение и в результате испортится весь опыт взаимодействия с продуктом;
• Не отражает реального объема доступных данных;
• Тяжело (невозможно) добраться до футера.

Классическая пагинация

механизм, который делит контент на отдельные страницы.

Достоинства:

• Хорошо работает, когда пользователь ищет в списке что-то определенное, а не просто просматривает поток данных;
• Дает ощущение контроля. Видно общее количество результатов, соответственно проще оценить, сколько времени займут поиски нужного материала;
• Возможность держать в голове местоположение элемента. Естественно, пользователи не обязательно будут помнить точный номер страницы, но они будут примерно ориентироваться в списке результатов, а пронумерованные страницы помогут быстрее туда добраться;
• При прекращении поиска, всегда точно знаешь количество просмотренных результатов и можешь сделать вывод, где остановился и сколько результатов еще необходимо изучить.

Недостатки:

Прерывание состояния «потока» при поиске информации.

Новоизобретенная пагинация

Проанализировав достоинства и недостатки двух топовых видов, изобрела третий, который включает достоинства и выключает недостатки первых двух.

Надеюсь, на картинке все понятно, но, на всякий случай, даю пошаговый рецепт блюда:

1. Берем постраничную пагинацию и «клеим» ее к правому краю сайта;
2. Фиксируем. При прокрутке страниц пагинация остается, а страницы меняются. Как вариант, можно «клеить» внизу экрана.

Стрелки вниз/вверх - начало/конец страницы;
Высота, ширина, внешний вид - на свой вкус. Если страниц много - опять используем прием классической пагинации: 1 2 3 4 5… 10

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

Никакой магии, все просто. Но почему-то на сайтах я такого способа не видела.

Чтобы не летать в облаках и проверить в бою, новая пагинация была протестирована на пользователях (4 человека) при проектировании каталога товаров интернет-магазина.
При тестировании пользователи понимали, что это за штука и для чего предназначена, переключались/ возвращались на страницы, знали где они находятся и сколько страниц еще впереди.

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

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

P.s. при написании статьи был использован материал и картинки из

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

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

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

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

1 Оптимальный размер страницы

Не делайте страницу слишком короткой. Сайт или приложение - это не печатная книга. Размер страницы печатной книги ограничен размером книги и листа, а размер страницы сайта ограничен лишь вычислительной мощностью устройства и терпением пользователя. Приемлемым вариантом является отображение 20-80 записей на страницу, но это лишь приблизительное число, а реальное число зависит от категории сайта. На некоторых сайтах это число равно 10, а где-то и 100, ведь главное в этом деле - обеспечить удобство использования.

2 Размер ссылок

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

3 Указание текущего положения

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

4 Ограничьте количество страниц и пространство вокруг элементов

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

5 Ссылки на предыдущую и следующую страницы

6 Ссылки на первую и последнюю страницы

Зачастую можно увидеть пагинацию, содержащую ссылки на первую и последнюю страницы. Они не такие популярные, но, тем не менее, они нужны пользователям, которые решили начать чтение с самых ранних записей (если новые размещены вверху на первой странице, как часто делают для новостей).

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

Тем не менее, решение простое - обозначить первую и последнюю страницу цифрами, как и остальные ссылки.

7 Проверьте мобильную версию

Мобильные устройства имеют ограничения размера экрана, поэтому нужно разумно сократить количество элементов и увеличить их размер. Для мобильных устройств можно оставить номер текущей страницы и базовые элементы (первая страница, предыдущая страница, следующая страница, последняя страница).

8 Навигация с помощью клавиатуры

Дайте пользователям возможность использовать для навигации клавиатуру. Клавиша «Вправо» - следующая страница, клавиша «Влево» - предыдущая страница. Главное - предупредить пользователя о данной возможности. Для предупреждения хватит текста под пагинацией: «Используйте клавиши ← влево и вправо → для навигации по страницам».

Также хорошей практикой считается дать возможность пользователю переходить по ссылкам, используя клавишу «Tab». Когда ссылка выделена, нажатие на клавишу «Enter» должно инициировать переход на соответствующую страницу.

Номера страниц или «Далее/Назад»?

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

Вывод

Хорошая пагинация улучшает читабельность и уменьшает сложность.

Кристина Загорулько

Июн 30, 2015 | Время чтения: 6 мин

Все крупные интернет-магазины в обязательном порядке используют пагинацию – постраничную навигацию товаров. Делается это для удобства посетителей. Представьте себе, что какой-нибудь раздел содержит пару сотен единиц товара. Выводить их все на одну веб-страницу? В принципе, можно. В отличие от бумажной, интернет-страница безразмерна. Используй себе скроллинг и просматривай товар. Да, страница сайта безразмерна, но скорость-то соединения имеет конечную величину! И если каждая единица товара имеет изображения (а это сейчас делается практически всегда), то такая веб-страница может грузиться очень долго. Но если пагинация для юзабилити сайта – это всегда хорошо, то для SEO неправильная ее настройка сулит ухудшение позиций в поисковой выдаче и затрудняет индексацию:

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

Рассмотрим подробнее эти проблемы.

Лимит он и у поисковиков лимит

Робот поисковой системы на сайте находится отнюдь не столько времени, сколько необходимо, чтобы проиндексировать все его страницы. Это время лимитировано и определяется частотой обновления контента, трастом и массой других величин. А теперь представьте себе ситуацию: в интернет-магазине в каждом разделе по 20-30 страниц, отличающихся только названиями товаров. И каждую страницу робот будет индексировать, то есть считывать, ее содержимое. А до страницы конкретного товара он уже и не доберется, ведь она находится уровнем ниже. Но ведь владельцу интернет-магазина надо совершенно другое – индексация страниц с товаром!

Проблема дублированного контента

К одинаковому контенту даже в рамках одного сайта поисковики относятся плохо. Логика проста. На веб-странице сайта должен быть контент максимально релевантный запросу. А если на разных страницах он практически идентичный, то есть имеется список единиц товара (для разных страниц он разный, но очень похожий, так как товар однотипный) плюс ОДИНАКОВОЕ описание всей группы товаров, в котором и находятся ключевые слова. Как тогда определить из всех таких интернет-страниц наиболее релевантную? По сути, с точки зрения SEO, вес страниц распыляется. Главная страница раздела (каталога) теряется среди десятка ей подобных. А значит, в выдаче она неминуемо будет проседать, точнее, все веб-страницы будут проседать.

Варианты сео оптимизации страниц пагинации

Вначале определимся, чего мы хотим. Задача-минимум: так организовать пагинацию, чтобы она не навредила SEO, то есть не ухудшала показатели сайта в выдаче. Задача- максимум: способствовала улучшению показателей сайта в выдаче. А теперь рассмотрим имеющиеся варианты.

Вариант №1. Запрет индексации страниц пагинации

А. При помощи мета-тега noindex

Этот вариант сео оптимизации подразумевает, что в секцию КАЖДОЙ веб-страницы пагинации кроме первой добавляется строчка:

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

Несколько нюансов сео оптимизации:

• Исключите дублирования URL первой страницы при динамическом создании веб-страниц. Другими словами, если на сайте реализованы фильтры – контент страницы зависит от заданных условий: сортировка по цене – с большей, меньшей, по популярности, по брендам и т. д. Для этого ссылка на первую страницу каталога должна иметь вид: название домена/catalog. А со страницы: название домена/catalog?page=1 необходимо сделать 301 редирект на страницу: название домена/catalog.
• Обязательно создать XML карту сайта.

Плюсы:

• Этот вариант отлично понимает Яндекс.

Минусы:

• Тег noindex не воспринимает Гугл.
• При большом количестве фильтров и товаров в каталоге получается большое количество динамических страниц, на которых необходимо прописать мета-тег noindex.
• Полностью исключается контент со страниц пагинации, за исключением первой.

Б. При помощи файла robots.txt

Пусть у нас страницы пагинации имеют вид http://название домена/category/page/n, где n – номер страницы. В этом случае в файле robots.txt прописываем директиву: Disallow: /category/page.

В случае с динамическими веб-страницами, вида http://названиедомена/category?page/n директива будет иметь вид: Disallow: ?page=

Этот способ сео оптимизации более универсален, но не лишен главного недостатка – полностью исключается контент со страниц пагинации, за исключением первой.

Вариант №2. Использование тега canonical и страницы «Смотреть все»

Суть этого варианта сео оптимизации состоит в том, что создается веб-страница, на которой показывается весь товар каталога, и с помощью тега canonical (о нем мы писали в статье « ») вы указываете поисковым системам на нее как на каноническую веб-страницу. К примеру, у вас в интернет-магазине есть раздел «Абажуры». Тогда необходимо создать интернет-страницу со всеми абажурами, например, с таким URL: название домена/abajyru/?&show_all=yes. А на всех веб-страницах пагинации в секции прописать строку:

.

Нюансы сео оптимизации:

• Если товаров много, то такая интернет-страница может грузиться достаточно долго. Как выход – уменьшить разрешение изображений товаров.

Плюсы:

• Тег canonical понимает и Гугл и Яндекс. При этом для Гугл такой способ исключения страниц из индексации является приоритетным.
• Весь контент страниц пагинации будет индексирован через веб-страницу «Смотреть все».

Минусы:

• Накладывает определенные ограничения на качество картинок и общий объем контента.
• Для Яндекса тег canonical не является директивным. Он его может и проигнорировать. И эта вероятность возрастает, если контент на веб-страницах не будет идентичен. А такое обязательно будет, ведь список товаров будет отличаться.
• При большом количестве фильтров и товаров в каталоге получается большое количество динамических страниц, на которых необходимо прописать тег canonical.

Вариант №3. AJAX-пагинация

Суть этого варианта сео оптимизации состоит в том, что при прокрутке станицы вниз в нее подгружается новый контент. Достигается это при помощи технологии AJAX (Asynchronous Javascript and XML), которая позволяет обмен данными между сервером и браузером пользователя в фоновом режиме. С данной технологией многие прекрасно знакомы, ведь она реализована во «ВКонтакте» и «Одноклассниках». AJAX позволяет все время подгружать список товара и вторых и последующих веб-страниц каталога просто не существует.

Плюсы:

• Для поисковых систем каталог будет выглядеть, как одна веб-страница, поэтому будет проиндексировано все и никакого дублирования контента.
• Нет опасности долгой загрузки веб-страницы (как в случае со страницей «Показать все»).

Минусы:

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

Вариант №4. Пагинация при помощи тегов rel=»prev»и rel=»next»

Этот вариант сео оптимизации основан на том, что при помощи этих тегов Гуглу дается команда при индексировании объединить страницы, помеченные ими, в одно целое. Вот как это делается на практике.

Пусть у нас есть четыре веб-страницы каталога. Тогда в секцию страницы №1 помещаем строку:

Для страницы №2 это будет выглядеть уже так:

Для страницы №3:

И, наконец, для страницы №4:

Плюсы:

• Позволяет проиндексировать весь контент, как будто он размещен на одной странице, но без использования громоздкой веб-страницы «Смотреть все».

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

И так, что же такое пагинация

Страницы пагинации – это страницы каталога (вторая, третья и т.д., страница «показать все») на которых выводится список товаров (или статей, если речь идет о блоге), не поместившихся на первой странице категории или раздела ресурса. В большинстве случаев находится внизу сайта, но может быть расположена и вверху (иногда дублируется вверху и внизу). Выглядит следующим образом:

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

Почему важно правильно настроить пагинацию на сайте?

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

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

Устаревшие способы оптимизации страниц пагинации:

1 Способ. Закрыть страницы пагинации в robots.txt

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

Disallow: *page=

Конкретная директива зависит от способа реализации страниц пагинации на Вашего сайта.

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

2 Способ. Пагинация с тегом rel=«canonical» на первую страницу категории

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

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

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

Google включил настройку канонических ссылок на первую страницу категории в список самых распространенных ошибок при настройке rel=canonical.

Оптимальные методы оптимизации страниц пагинации:

3 Способ. Пагинация с тегом rel=«canonical» на страницу «Смотреть Все»

Таким способом настройки пагинации рекомендует пользоваться поисковая система «Google» .

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

Такой тег выглядит следующим образом:

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

Минусы

Такую настройку сложно внедрить на большинстве стандартных CMS-системах.

4 Способ. AJAX-пагинация

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

при переходе на вторую и последующие страницы каталога, страница сайта не перезагружается, но список выводимых товаров или статей изменяется при помощи AJAX, таким образом страниц с url-адресами вида http://site.com/page2 и т. д. просто не существует, они не могут быть проиндексированы поисковыми системами и никогда не попадут в индекс.

Минусы

Такую пагинацию не получится реализовать без привлечения программистов.

5 Способ. Пагинация с тегами rel="prev"/"next" и мета-тегом robots

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

разместив его в секцию .

Кроме этого на всех страницах пагинации размещаются теги "prev" и "next" , указывающие на предыдущую и следующую страницы соответственно. Это облегчает роботу понимание структуры нумерованных страниц и улучшает сканирование размещенных на них товаров или статей. Например,на сайте находится 4 страницы пагинации:

Тегами rel=prev/next необходимо создать цепочку из существующих страниц пагинации, началом которой будет первая страница, в которой нужно добавить:

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

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

Правильно размещенные теги на страницах пагинации сигнализируют поисковой системе о том, что страницы от page1 до page4 необходимо объединить в единый элемент в индексе. Релевантной же будет только первая страница.

Важно

Обратите внимание, что URL первой страницы http://site.com/page1.html не должен существовать в принципе, его дожна заменять основная страница http://site.com/page.html . То есть при клике пользователя на цифру 1 в списке страниц пагинации перех должен осуществляться именно на основную страницу вида http://site.com/page.html.
Также при размещении текста на странице категории, рекомендуется скрывать его на остальных страницах пагинации.

6 Способ. Пагинация с тегами rel="prev"/"next" и rel="canonical" сам на себя

Аналогично предыдущему способу на всех страницах пагинации размещаются теги rel="prev"/"next". Отличие от предыдущего подхода состоит в том, что вместо закрытия индексации нумерованных страниц с помощью мета-тега robots, на каждой странице пагинации размещается атрибут rel="canonical", указывающий каноническую ссылку на эту же страницу. То есть на странице пагинации http://site.com/page3.html в блоке будет размещена каноническая ссылка, ведущая на нее же:

При этом страницы пагинации не должны быть закрыты от индексирования ни одним из способов.

Как узнать, что пагинация для SEO настроена неправильно?

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

Самый простой способ для их определения - посмотреть проиндексированные страницы в Google через оператор site: , например site:example.com покажет все страницы для домена example.com. Но, если Ваш сайт имеет большое количество страниц, удобнее будет воспользоваться специализированными сервисами типа Screaming Frog Seo Spider . Находим страницы-дубликаты по title и обращаем внимание на их URL для обнаружения страниц пагинации (адреса содержат параметр типа page= ).

Также Вы можете найти дубликаты title с помощью панели вебмастера Google:

Откройте вкладку Вид в поиске > Оптимизация HTML

Переходим в раздел "Повторяющиеся заголовки (теги title)" и анализируем адреса страниц на схожесть со страницами пагинации.

Заключение

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

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

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

Типы пагинации

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

1. Разбивка статей

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

Соответственно, у каждой страницы будет свой URL-адрес, к примеру:

• vashsite.com/vasha_statya-1.html.
• vashsite.com/vasha_statya-2.html.

К каждой части вашей статьи может быть применено свое имя. Таким образом, к примеру, вместо vasha_statya-1.html вы легко можете использовать chast_name.html, в котором chast_name будет являться наименованием раздела. Однако, учтите, что это может вызвать некоторые трудности при поисковой оптимизации, поэтому, лучше всего, использовать метод 1,2,3.

1. Пагинация галерей

Для реализации пагинации галереи с картинками нужно, чтобы у каждого изображения в этой галереи была своя страничка. Тут так же, как и с разбивкой статей, вы можете указывать номер изображения после названия серии (1, 2, 3…). Опять же, можно дать каждой странице с изображением свое наименование, но, в таком случае, поисковик не будет видеть, что все иллюстрации принадлежат к одной галерее.

Чтобы организовать навигацию, можно снова использовать кнопки «Следующая» и «Предыдущая».

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

3. Деление на страницы комментариев в блогах или тем на форумах

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

4. Пагинация бесконечного прокручивания

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

Проблемы, которые могут возникнуть

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

Глубина сканирования

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

Поэтому, лучше создать отдельную страничку «Просмотреть все» и указать поисковому роботу, что индексировать нужно только ее, а остальные страницы из пагинации трогать не нужно. Это мы разберем далее.

Повторение контента

На поисковой оптимизации очень негативно сказывается дублированный контент. А при пагинации, такое явление может возникнуть, если вы применяете разбивку контента по отдельным страничкам и страницу «Просмотреть все». Поэтому, при реализации разбивки страниц рекомендуется применять rel=”nofollow”.

Это позволит вам без опасений использовать страницу «Просмотреть все».

Бедный контент

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

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

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

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

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

В каком месте применять пагинацию

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

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

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

Есть пользователи, которые больше предпочитают постоянное прокручивание страницы, нежели кликание по кнопке «Следующая». Поэтому, главное придерживаться правила – не больше 20 сообщений на странице, но и не меньше 10.
В случае с пагинацией категорий, лучше всего, будет создавать новую страницу, когда наберется порядка 50-70 ссылок. Можно также найти рекомендации по использованию 100 ссылок, однако это будет уже перебор. А если еще и с мобильного устройства просматривать, то и подавно.

Для разбитых на страницы статей нужно всегда создавать содержание

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

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

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

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

Для пользователей WordPress прекрасно подойдет дополнение WP Table of Paginated Contents. С его помощью можно выполнять все действия, касательно содержания и настраивать его, как вам угодно.
Данный плагин позволяет сделать содержание следующего типа:

Помните о страничке «Просмотреть все»

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

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

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

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

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

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

При необходимости применяйте rel=“next” и rel=“prev”

Бывает, что условия конкретного проекта не позволяют создать страницу «Просмотреть все». Это также попросту может не допускать используемый вами тип пагинации. В таком случае, чтобы заставить «Google» индексировать полностью все странички из данной серии, вы можете прибегать к использованию rel=“next” и rel=“prev”.

С помощью этих HTML-атрибутов вы сможете указывать «Google» на последовательность индексирования ваших страниц.

Однако, помните, что это указание может быть взято во внимание «Google», а может, и нет. Поэтому, нельзя быть уверенным, что будут проиндексированы все страницы.

Заключение

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