Постраничная навигация как метод эффективного структурирования контента

Автор: Райан Хасер (Ryan Huser) – исполнительный директор агентства Ayima и SEO-консультатнт. Сын сотрудника ВВС США и дизайнера интерьеров, Райан Хасер сумел воплотить в своих онлайн-разработках идеальное сочетание качественного технического исполнения с безупречным дизайном и юзабилити сайтов.

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

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

Итак, что же такое постраничная навигация (pagination)? Если говорить в общем, так называют разбиение большого блока контента на множество более мелких, с последующим указанием взаимосвязей между отдельными URL. Так, разработчики торговых сайтов, как правило, разделяют на несколько страниц списки товаров в категориях, содержащих большое количество элементов. Создатели новостных и издательских сайтов обычно размещают на нескольких страницах длинные статьи. В блогах и форумах ветви обсуждений, как правило, разделяют на несколько последовательных URL-ов. При этом, особенность блогов и форумов заключается в «обратной нумерации» страниц – то есть пользователю на главной странице показываются более свежие обсуждения.

«Олично!» — возразите вы. – «И что же здесь такого сложного?». Главная проблема состоит в том, что для SEO постраничная навигация имеет особенное значение, ведь неграмотное разбиение контента на страницы может стать одной из основных причин плохой индексации ресурса в поисковых системах, в частности, в Google. В то время как идеально выполненная пагинация становится весьма эффективным инструментом для поискового продвижения ресурса.

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

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

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

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

Постраничная навигация с учетом поискового индекса

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

1. Увеличить число категорий – это позволит вам сократить количество страниц в каждом блоке контента.

2. Увеличить число позиций товаров, размещаемых на одной странице – это даст возможность сократить общее число страниц в серии пагинации;

3. Проставить ссылки на все связанные страницы внутри серии, начиная с первой страницы – это существенно облегчит процесс сканирования ресурса краулером.

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

Перечислим наиболее эффективные инструменты:

Вариант 1. Удалите ненужную часть пронумерованного контента из индекса.

Существует множество случаев, когда наилучшим вариантом для оптимизатора будет просто-напросто убрать весь лишний контент из индекса. Так, если на страницах нет никакого уникального контента, они не особенно важны для продвижения ресурса в выдаче, однако при этом их содержание проиндексировано и доступно для поиска – оптимальным решением будет добавить в раздел head каждой страницы серии тег <META NAME="ROBOTS" CONTENT="NOINDEX, FOLLOW">, за исключением первой страницы. Тег "FOLLOW" отвечает за управление поисковыми роботами при индексировании документа, а его применение гарантирует то, что каждой странице из серии будет передаваться показатель Page Authority, при этом в индекс не попадут нежелательные страницы серии.

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

Вариант 2. Создайте видимую страницу типа “View-all” («Показать все») и укажите ее в качестве канонической для всех страниц серии, используя тег rel=“canonical”.

После того, как вы создали страницу типа “View-all” и указали ее в качестве канонической, добавив атрибут rel="canonical" в раздел <head> каждой пронумерованной страницы серии, тем самым связав ее с канонической страницей. К примеру, так: <link rel="canonical" href="http://www.site.com/view-all-page"/>. При таком подходе поисковая система, в частности Google, будет рассматривать каждую страницу, серии, связанную со страницей «Показать все» как часть контента этой страницы. На практике это означает следующее: если поисковый запрос будет релевантен блоку контента, размещенному на одной из страниц серии, в выдаче будет появляться страница типа “View-all”.

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

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

Вариант 3. Применяйте атрибуты Rel=“prev”и Rel=“next”, чтобы обозначить связь между несколькими URL

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

Используя HTML-атрибуты rel="next" и rel="prev", вебмастер устанавливает взаимосвязь между отдельными URL. Благодаря применению данной разметки, Google может определить, что содержание данных страниц связано в логической последовательности.

Технически это выглядит следующим образом: начиная со Страницы 1 специалист добавляет тег, указывающий на следующую страницу в раздел <head> предшествующей страницы HTML. В результате получаем последовательность:

Страница 1:

<link rel="next" href="http://www.site.com/page2.html">

Это первый шаг работы – для начальной страницы, указывать атрибут rel="prev" не требуется. На второй и третьей страницах необходимо добавить ссылки, указывающие на предыдущий и следующий URL.

Для Cтраницы 2:

<link rel="prev" href="http://www.site.com/page1.html">

<link rel="next" href="http://www.site.com/page3.html>

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

<link rel="prev" href="http://www.site.com/page2.html">

<link rel="next" href="http://www.site.com/page4.html">

Для Cтраницы 4:

<link rel="prev" href=" http://www.site.com/page3.html">

Предположим, что страница 4 является последней в серии. В таком случае на нее следует добавить только ссылку, указывающую на предыдущий URL. А поскольку сама Страница 4 является последним URL в серии, то и добавлять атрибут rel="next" для нее не требуется.

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

Преимущества данного метода заключаются в том, что он позволяет избавиться от необходимости отображения всей категории на странице «Показать все», вариант может быть использован с минимальными изменениями HTML-кода. Недостатки заключаются в том, что последовательное применение атрибутов Rel=“prev”и Rel=“next” для каждой страницы серии – довольно кропотливый и тяжелый процесс, в ходе реализации которого не исключена вероятность возникновения ошибки.

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

Перспективные практики разбивки по страницам

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

Намечаем критические точки

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

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

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

Используем AJAX для создания «бесконечной» прокрутки

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

Более того, сегодня веб-разработчику важно использовать эффективные и современные подходы к построению интерактивных пользовательских интерфейсов. Именно таким подходом и является асинхронный JavaScript и XML (AJAX). Использование AJAX и JavaScript позволяет существенно повысить скорость работы сайта со сложным интерфейсом и значительно уменьшить нагрузку на сервер. В дальнейшем это позволит Googlebot правильно сканировать и индексировать содержимое сайта, в то время как разработчик сможет предоставить своим пользователям более совершенные возможности навигации по сайту.

Сигналы релевантности контента: страница «Показать все» vs. rel="next" и rel="prev"

Задумываясь над выбором способа разбиения на страницы, важно помнить одну существенную вещь: несмотря на то, что согласно заявлениям представителей Google, наиболее предпочтительным методом разбиения содержания сайта на страницы является создание канонической страницы типа «Показать все» – в ряде случаев более эффективным будет использование атрибутов rel="next" и rel="prev".

Представим на минуту ситуацию, при которой использование обоих перечисленных выше методов передает ссылочный вес страницам, которые в обязательном порядке будут проиндексированы Google. При этом на странице типа “View-all” будет накапливаться ссылочная масса, поскольку на нее будут ссылаться все неканонические страницы, в то же время использование атрибутов rel="next" и rel="prev" позволит передавать данный сигнал от страницы к странице. Аналогичная ситуация происходит и с другими сигналами, влияющими на ранжирование (уникальность URL, уникальные теги <title> и другие тэги мета-описаний и т.д.) Таким образом, можно сделать вывод о том, что указание в качестве канонической страницы типа «Показать все» может привести к «размытию» упомянутых в скобках сигналов, которые могут быть весьма существенными с точки зрения ранжирования отдельных страниц.

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

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

Использование rel="prev" и rel="next" при наличии параметров

Как известно, если на странице, являющейся частью последовательности, используются параметры, не влияющие на ее содержание (к примеру, идентификаторы сеансов), то значения атрибутов rel="prev" и rel="next" тоже должны содержать одинаковые параметры. При этом любой опытный оптимизатор скажет вам, что наличие на такой странице параметров, не влияющих на ее содержание – очень плохая новость с точки зрения поискового продвижения, ведь если вы не передаете алгоритмам Google никаких сигналов, касающихся контента, содержание страницы может быть признано дублированным. Напомню, что дублирующееся содержание, с точки зрения поисковой системы, часто появляется, когда на сайте одна и та же информация предоставляется по разным URL-адресам.

Конечно же вы всегда можете «попросить» робота Googlebot не сканировать ту или иную страницу, используя инструмент «Параметры URL» в «Инструментах для веб-мастеров». Но что же делать в случаях, если мы хотим сохранить авторитетность ссылок, передающуюся с этих URL-ов? В этом случае на помощь придет использование атрибутов rel="prev" и rel="next" в сочетании с каноническим тегом.

Однако прежде, чем приступать к действиям, убедитесь, что все страницы, использующие rel="prev" и rel="next" последовательно пронумерованы и используют один и тот же параметр. Во-вторых, каждый URL, на котором используются параметры, должен ссылаться на канонический URL, не содержащий подобных параметров.

Сочетание фильтров и тегов rel="prev" и rel="next"

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

Страница 1: http://www.site.com/page1.html?brand=nike

В подобной ситуации размещение контента на страницах будет зависеть от следующих переменных:

Страница 1: http://www.site.com/page1.html?brand=adidas

Страница 2: http://www.site.com/page2.html?brand=adidas

Аналогичным образом фильтр будет работать и для остальных видов продукции:

Страница 1: http://www.site.com/page1.html?brand=reebok

Страница 2: http://www.site.com/page2.html?brand=reebok

Таким образом, если вы считаете, что вам необходимо, чтобы в индекс Google попали абсолютно все виды продукции, для которых доступны указанные выше фильтры – наилучшим вариантом будет создание отдельных серий последовательно пронумерованных страниц с использованием атрибутов rel="prev" и rel="next". Создание канонической страницы в данном случае нецелесообразно.

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

Использование rel="prev" и rel="next". Сортировка контента

В заключение рассмотрим особенности применения атрибутов rel="prev" и rel="next в случаях, когда мы имеем дело с сортировкой контента. С данным типом параметра зачастую можно столкнуться при создании блога или сайта электронной коммерции.

Например, когда вы заходите на главную страницу ресурса — можете увидеть следующий URL:

Страница 1: http://www.news-site.com/page1.html?order=oldest

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

Страница 2: http://www.news-site.com/page1.html?order=newest

Данный вид разбиения серии на отдельные страницы вызывает наиболее жаркие споры в среде вебмастеров и оптимизаторов. Одни рекомендуют использовать атрибуты rel="prev" и rel="next" как для параметра “newest”, так и для параметра “oldest”. По мнению экспертов Ayima, данный подход может быть расценен Google, как предложение проиндексировать множественные серии пагинации страниц с идентичным контентом.

В свою очередь, представители Ayima рекомендуют использовать следующий сценарий разбиения на страницы при помощи атрибутов rel="prev" и rel="next":

При этом важно закрыть от индексации страницы с использованием указанного выше атрибута для параметра “newest”. Это очень легко сделать, используя «Параметры URL» в «Инструментах для веб-мастеров»:

Чтобы упростить процесс принятия решения о том, какие методы следует применять в каждом отдельно взятом случае разбиения серии контента ресурса на страницы, приведем оригинальную схему, разработанную консультантами Ayima:

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

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

Источник: Ayima.com

Перевод Анастасии Матвеевой

Журналист, новостной редактор, работает на сайте с 2009 года. Специализация: интернет-маркетинг, SEO, поисковые системы, обзоры профильных мероприятий, отраслевые новости рунета. Языки: румынский, испанский. Кредо: Арфы нет, возьмите бубен.