(или как ее еще называют — постраничная навигация). От того как она реализована, зависит сколько посетитель увидит товаров, а это глубина просмотров, а главное, для интернет-магазина, что у товара, который увидел покупатель больше шансов быть купленным.
Этому элементу интерфейса часто уделяют незаслуженно мало внимания. Он проходной, стандартный, делается за 10 минут, так же как «хлебные крошки».
В статье не пойдет речь о технической реализации средствами php, css, ajax и jquery, зато расскажу о том, какой должна быть правильная постраничная навигация, чтобы была не только красивой, но и помогала магазину продавать и не мешала поисковой оптимизации.
Важно чтобы постраничная навигация в каталоге товаров, да и любом другом списке, если вы хотите чтобы его смотрели дальше первой страницы была заметной и понятной. По обоим этим пунктам безбожно грешат многие, в том числе крупные интернет-магазины.
Например, вот так сделана постраничная навигация в новой версии магазина Wildberries.ru
Мелко, блекло, незаметно.
Пагинация страниц бывает разной. Способов, как ее можно сделать — десятки. Перечислю для наглядности несколько.
Цифры с номерами страниц. Самый привычный пагинатор, с цифровой нумерацией страниц и кнопками «вперед—назад». Появился такой пагинатор одновременно с интернетом и во многих реализациях, даже на современных сайтах так и не изменился. Посмотрите скриншот постраничной навигации в магазине lamoda.ru. Не иначе основная целевая аудитория такого инструмента — поисковые роботы.
Так выглядит пагинация в интернет-магазине lamoda.ru.
К такой пагинации все привыкли и задача по разбиванию раздела на страницы им нормально выполняется. Такая реализация постраничной навигации вполне подходит для раздела с новостями компании, или другими материалами, которые в устаревшем виде ценности не имеют, поэтому редко кем кроме поисковика просматривается вторая страница списка новостей. Для каталога товаров вариант подходит плохо. Плохо заметный, не мотивирует кликать на ссылку «2» чтобы посмотреть вторую страницу.
«Показать еще». Встречаются разные варианты улучшения этого пагинатора. Например, кроме списка страниц и традиционных ссылок «вперед» и «назад» делают большую, заметную кнопку «Показать еще», по которой загружается новая порция контента. Это уже лучше, чем простой предыдущий вариант.
Пример из новостного сайта, но как иллюстрация вполне подойдет.
Похожим образом сделано в поиске по картинкам Яндекса.
Для интернет-магазина хорошо работает вариант, когда на странице списка товаров, вместо последнего товара выводится ссылка «Еще», а под ним традиционная пагинация.
Чтобы кликнуть на «2» или «Следующая страница» в традиционной пагинации, пользователь должен этого хотеть, иначе он вообще не заметит блока с постраничной навигацией. В данной же реализации он в любом случае заметит ссылку, поскольку она занимает место одного из товаров, которые он смотрит. А если вместо безликого «Следующая страница» написать что-то мотивирующее, например «Еще 80 бесподобных вечерних платьев», то шансы увеличатся еще сильнее.
И, конечно, есть самый модерновый вариант, как сделать пагинацию — бесконечный скролл . Станет сразу понятно, о чем речь, если вы вспомните, как выглядит просмотр новостей на вашей странице Вконтакте. Там нет pagination-блока. Вы скроллите страницу мышкой и контент подгружается автоматически. Отличный вариант для интернет-магазина, но тоже имеет определенные недостатки. Не нужно забывать про пользователей с устаревшими браузерами и не слишком быстрыми компами. В целом, этот вариант почти идеален, особенно если учесть интересы поискового робота и сделать для него старую — добрую номерованную постраничную навигацию.
Страницы 2, 3 и т. д. мало чем отличаются от первой страницы раздела со списком товаров. Поэтому при правильном подходе, страницы пагинации вполне могут хорошо находиться в поисковых системах. Я перечислю ряд SEO-ошибок, которые встречаются наиболее часто и мешают им хорошо искаться.
Одинаковый Title (заголовок в окне браузера) — частая ошибка, которая приводит к выпадению из выдачи поисковика части страниц пагинатора. Возникает из-за генерации по шаблону первой страницы каталога всех последующих страниц (2, 3 и т. д.).
Название у страниц пагинации должно быть разным. Как минимум добавляйте автоматически к названию раздела текст «Страница 1», «Страница 2» и т. п. Неплохой вариант, когда заранее придумываются названия и выводятся на соответствующих страницах. Конечно, названия должны быть неслучайными, взятыми с потолка, а в тему соответствующего раздела. Выводиться они должны тоже не каждый раз рандомно.
То же самое что с предыдущей ошибкой. Часто на всех страницах пагинации используют одно и то же описание в теге description. Это неправильно, дублирование description быть не должно. Также в description не нужно дублировать содержимое тега title. Для всех страниц пагинатора, кроме первой, description лучше или совсем убирать или заполнять заранее подготовленным описанием.
Не путать с description. :-) Есть старый, но и сейчас вполне работающий и законный способ улучшить релевантность страниц - разделов с товарами по определенным поисковым запросам. Это добавление небольшого текстового описания раздела в самом конце страницы, сразу под списком товаров.
Так вот, ошибка состоит в том, что этот текст выводят на всех страницах пагинации. Это неверно. Текст с описанием раздела должен выводиться только на первой странице. На других дублировать тот же текст не нужно.
Когда на сайте везде кроме поиска используются ЧПУ , то в robots.txt часто закрывают от индексирования все страницы, содержащие в URL параметры. Это правильный подход (подробнее я писал об этом в статье про базовые вещи для внутренней оптимизации сайта), но важно не забывать про постраничную навигацию, страницы которой должны оставаться видимыми для поисковиков. Обязательно проверьте, чтобы они были доступны для индексации.
Даже такой простой и привычный элемент страницы как пагинатор, может и должен выглядеть по-разному, в зависимости от задач сайта. Если задача показывать посетителю товары, чтобы он мог из них выбирать и покупать, то просто воткнуть в макет дизайна пагинатор из набора UI-элементов — не лучшее решение. Да, работать будет, но чуток подумав можно сделать лучше.
В заключение несколько простых советов:
Мы выпустили новую книгу «Контент-маркетинг в социальных сетях: Как засесть в голову подписчиков и влюбить их в свой бренд».
Различается несколько видов:
Да, не только людям свойственна нехватка такого тягучего и вечно ускользающего вещества как время. Пребывание бота на страницах сайта строго лимитировано. Количество проведённого времени определяется за счёт соотношения частоты обновления контента, траста и некоторых других показателей. Естественно, что отведённого временного интервала на индексацию всех необходимых страниц ресурса боту не хватит. Особенно если он потратит его на проверку огромного количества вкладок пагинации (товаров, статей, видео и т. д.).
К идентичному контенту даже в рамках одного сайта поисковики относятся крайне негативно. В зависимости от той или иной структуры вашего листинга, велика вероятность того, что некоторые страницы могут иметь одинаковое содержание (текст, мета-теги). , скорее всего, вызовут недовольство у поисковых систем, что приведёт к проседанию страниц в выдаче.
Большинство пользователей обычно просматривают не более 2−3 страниц из предложенного списка. Следовательно, с позиции ниже 10-той - трафика можно не ждать.
Использование числового списка становится крайне неудобным, по причине того, что многие веб-дизайнеры, исходя из принципа экономии места на сайте, делают «циферки» помельче.
Для продвижения, как правило, страницы пагинации дальше первой не нужны, но для получения ссылок на новости или товары их необходимо проиндексировать.
Рэнд Фишкин (гений, плейбой, стиляга, сооснователь MOZ, SEO специалист и маркетолог с мировым именем) в одном из своих видеоуроков советует пересмотреть стратегию сайта. А именно - заменить постраничный пейджинг, созданием каталогов второго и третьего уровня.
Плюсы:
Минусы:
Главная цель данного варианта - удаление из видимости поисковых роботов всех страниц листинга, кроме первой (главной), при этом обеспечиваем индексацию всех товаров/страниц, принадлежащих данному каталогу.
Данная процедура осуществляется посредством добавления в
мета-тега:
Советы:
Просто прописываем директиву: Disallow: /category/pagе
Минус: Исключает контент со всех страниц листинга, кроме первой.
Плюсы:
Минусы:
Этот вариант сео оптимизации подразумевает под собой создание одной веб-страницы, на которую будет выводиться весь ассортимент каталога, и при помощи тега canonical поисковым системам указывается на данную страницу, как на каноничесную.
Достаточно прописать в
следующую строку:
Совет:
Плюсы:
Главная идея данного варианта SEO оптимизации - при прокрутке страницы вниз, автоматически подгружается новый контент. Достигнуть такого результата можно при помощи AJAX (Asynchronous Javascript and XML), позволяющей осуществлять обмен данными между сервером и браузером в фоновом режиме.
Плюсы:
Минусы:
Принцип достаточно лёгок: при помощи тегов Google получает команду при индексировании объединить все страницы, на которых прописан данный код, в одно целое.
Пример для трёх страниц каталога:
Всем привет. Избитая тема: закрывать ли страницы пагинации от индексации поисковиком. Саппрот Яндекса пишет, что нет необходимости закрывать от индексации т.к. контент разный и нет смысла уникализировать тайтл, дескрипшены и т.п., так же нет смысла в конструкции meta robots noindex, follow. В то же время в Google в панели Вебмастера мы видим дубли метаданных страниц пагинации, т.е. Google как бы намекает, что это плохо.
Где истина?
Разрешать индексацию этих страниц роботу Яндекса и запрещать роботу Google meta name googlebot noindex, follow? Так же Яндекс предлагает поставить рел каноникал на первую страницу, то есть саму на себя. Жду интересного и развернутого ответа. Спасибо.
15.04.2014
Приветствую, Дима. Хороший вопрос, он часто вызывает много споров. Давайте разбираться и искать универсальное решение, как с точки зрения логики человека, так и с точки зрения поисковых систем.
С точки зрения ранжирования для поисковых систем это есть и всегда будут две различные страницы с двумя различными URL-адресами. Скажем /catalog/ и /catalog/?page=2. Таким образом:
С точки зрения обычного человека, всё примерно также:
Полезные приёмы:
Да, тег основного текстового заголовка h1 может дублироваться, в этом нет большой проблемы (если он отражает содержание текста страницы). В последнее время мы также рекомендуем не раздувать его содержимое и ограничиваться 1-4 словами.
Здравствуйте, уважаемые читатели сайта сайт. Еще один инструмент управления индексации, который необходимо использовать практически на любом сайте - это разметка страниц pagination. Что такое страница pagination? Это страница вашего каталога или перечень каких-то статей в блоге. То есть, обычно мы заходим на первую страницу каталога, а снизу еще какие-то: 1 2 3 4 и стрелочки перелистывания страниц. Все эти страницы называются страницами пагинации.
Проблема в том, что все они дублируют содержание друг друга (), даже не столько содержание, сколько смысл. То есть, если у нас раздел кроссовок adidas, то у нас 5-10 страниц, которые содержат кроссовки adidas. Хотя на них разные кроссовки, но релевантность этих страниц приблизительно одна и та же.
Сейчас поисковые системы неплохо справляются с пагинацией сами по себе, они понимают какая страница главная, какая 2, 3 или 4 - они это понимают. Но мы же все-таки занимаемся оптимизацией, мы должны подсказать поисковой системе как правильно эту последовательность страниц .
И для этого у нас служат специальные атрибуты:
Rel="next" rel="prev"
Это атрибуты, которыми мы должны пометить эти ссылочки перелистывания, либо же мы можем эти атрибуты указать в блоке head нашей html страницы. Если не понимаете о чем речь - .
Таким образом мы должны указать, какая страница является следующей страницей в нашем перечне, какая предыдущей. Если мы это сделаем, то поисковая система как бы поймет, что это не на набор независимых страниц, а последовательность страниц, которые являются в общем одним и тем же, просто это страницы той самой pagination. И поисковик будет воспринимать главную страницу, как основную страницу этой последовательности, то есть как страницу, у которой нет этих атрибутов.
Нам это выгодно, потому что поисковик проиндексирует все эти страницы, добавит все эти страницы в индекс, но в поиске будет отображать именно первую страницу каталога. Не 3, 4 или 5, а первую.
Мы сможем на страницы пагинации работать с текстовыми факторами и добиваться каких-то позиций.
Вот пример с этого сайта. Обратите внимание, что на первом скрине код главной страницы и там указан атрибут "next", но нет атрибута "prev", так как это главная страница и предыдущей быть не может. Также указан со ссылкой на главную.
А вот вторая страница пагинации и тут уже есть атрибут "prev".
Иногда бывает, что без разметки поисковая система начинает считать более важной 3, 4 или 5 страницу пагинации, хотя все усилия вкладываются в продвижение первой страницы. Это может вызвать серьезные проблемы с позициями сайта по соответствующим запросам.
При работе с страницами pagination на важно понимать, что если вы можете обойтись без того, чтобы разбивать страницы каталога на несколько страничек, то постарайтесь ограничиться минимальным количеством таких страниц.
Если у вас в каждой рубрике находится по 30 товаров, то чаще всего можно просто показывать сразу в рубрике 30 товаров на одной странице и тогда вам не придется делать какие-то дополнительные разметки и у вас точно не будет вот этих страниц pagination, потому что их просто не будет.
Также неплохая идея использовать динамическую подгрузку товаров с помощью java script, когда при скроле страницы вниз у вас постепенно появляются новые товары. Здесь очень важно единственная проверить индексируются ли все эти товары, есть ли на них ссылки со страниц сайта. Потому что если у вас ссылки страниц сайта идут только на первых 30 товаров, то до остальных товаров поисковик просто может не добраться.
Важно, чтобы на эти товары, которые подгружаются динамически, были ссылки с других карточек товаров ну и обязательно все эти товары были добавлены в sitemap. Про sitemap мы разговаривали на прошлом занятии. Если вы добавите их в sitemap - это даст вам уверенность в том, что эти товары будут проиндексированы поисковой системой.
В большинстве случаев, проставлением конструкции пагинации занимается либо сама cms либо плагины. Вручную сейчас это не делается. В данном деле может помочь плагин
Важным является корректная настройка пагинации, поскольку присутствие на сайте неканонических страниц может серьезно мешать как продвижению, так и привести к проблемам с индексацией ресурса в целом. Страницы пагинации могут быть расценены поисковыми системами как несущие сомнительную ценность, ведь в большинстве случаев - это полные или частичные дубли страниц категорий Вашего сайта.
В этой статье я предлагаю подробно рассмотреть основные проблемы и найти эффективные решения настройки пагинации на Вашем сайте.
И так, что же такое пагинация
Страницы пагинации – это страницы каталога (вторая, третья и т.д., страница «показать все») на которых выводится список товаров (или статей, если речь идет о блоге), не поместившихся на первой странице категории или раздела ресурса. В большинстве случаев находится внизу сайта, но может быть расположена и вверху (иногда дублируется вверху и внизу). Выглядит следующим образом:
Поскольку такой функционал присутствует на большинстве сайтов, проблема с его настройкой – актуальна для веб-мастеров и SEO-оптимизаторов, ведь по сути неканонические страницы являются частичными дублями основной страницы категории, так как на них дублируется все содержание первой страницы за исключением списка товаров. Поэтому давайте рассмотрим основные нюансы и правильные методики настройки пагинации.
Почему важно правильно настроить пагинацию на сайте?
Кроме частичного дублирования контента на страницах пагинации также могут повторяться мета-теги и текствое наполнение. Это существенно снижает уровень внутренней оптимизации сайта и релевантности основных посадочных страниц поисковым запросам пользователей. А значит, такие сайты хуже ранжируются в поисковой выдаче.
Давайте рассмотрим еще одну не менее важную проблему. Когда роботы поисковых систем попадают на сайт, глубина и количество страниц, просмотренное ними, ограничено и зависит от трастовости ресурса и частоты обновления контента. Допустим ресурс имеет большое количество открытых страниц пагинации. Вероятность того, что робот проиндексирует нужные страницы значительно снижается, поскольку количество переходов по страницам будет израсходовано на частичные дубли.
На сегодняшний день существует довольно много подходов к оптимизации таких страниц. Каждый из них должен рассматриваться Вами как с точки зрения сложности внедрения, так и в разрезе потенциальных плюсов и минусов от их реализации.
Устаревшие способы оптимизации страниц пагинации:
Такой способ является быстро реализуемым, поскольку не требует вмешательств в код самого сайта.
Закрыть страницы пагинации в файле robots.txt можно по маске директивой типа
Disallow: *page=
Конкретная директива зависит от способа реализации страниц пагинации на Вашего сайта.
Минусы
Таким способом Вы действительно сможете избавиться от дублей страниц пагинации в индексе поисковых систем. Обратите внимание, что если такие страницы уже попали в индекс, то закрыв их в файле robots.txt, можно довольно долго ждать их исчезновения из индекса. Ведь поисковый робот будет видеть запрещающую директиву в файле и просто не будет заходить на эту страницу. К тому же велика вероятность получить проблемы с индексированием товарных страниц, размещенных на закрытых в robots.txt страницах пагинации.
Наиболее распространенный способ на просторах рунета для борьбы с дублями страниц пагинации в индексе. Со своей задачей данный метод в принципе справляется, но затрудняет индексирование поисковым ботом товаров, расположенных на страницах пагинации.
Представьте ситуацию, при которой ваши товары распространяют другие сайты, например, получая информацию через xml-фид. Если для робота процесс индексирования Ваших товарных страниц затруднен, вполне вероятно, что он проиндексирует их на другом сайте и именно он будет признан первоисточником.
С точки зрения поисковой системы на Вашем сайте будет размещен неуникальный контент, что негативно повлияет на ранжирование в органическом поиске.
Google включил настройку канонических ссылок на первую страницу категории в список самых распространенных ошибок при настройке rel=canonical.
Оптимальные методы оптимизации страниц пагинации:
Таким способом настройки пагинации рекомендует пользоваться поисковая система «Google» .
Тег rel=«canonical» указывает поисковой системе каноническую страницу, на которой выведены все товары и помогает определить страницы пагинации. При использовании такого тега поисковая система не учитывает неканонические страницы и дублирующийся на них контент.
Такой тег выглядит следующим образом:
Хоть мнению Google этот вариант и является оптимальным, на практике Вы редко встретите подобную реализацию. Все дело в том, что для большинства магазинов количество запросов в базу данных с такой страницы существенно возрастает, что приводит к увеличению времени загрузки страницы, на которой выведены все товары категории по сравнению с первой страницей пагинации. Поэтому в большинстве случаев подобный подход требует немалых усилий по оптимизации самого движка сайта для получения адекватных показателей по быстродействию такой страницы.
Минусы
Такую настройку сложно внедрить на большинстве стандартных CMS-системах.
AJAX-пагинация найболее оптимальная и выгодная для SEO функция, поскольку работает она следующим образом:
при переходе на вторую и последующие страницы каталога, страница сайта не перезагружается, но список выводимых товаров или статей изменяется при помощи AJAX, таким образом страниц с url-адресами вида http://site.com/page2 и т. д. просто не существует, они не могут быть проиндексированы поисковыми системами и никогда не попадут в индекс.
Минусы
Такую пагинацию не получится реализовать без привлечения программистов.
На всех страницах пагинации размещается директива для роботов поисковых систем в виде мета-тега. Данная директива указывает, что страницу не нужно добавлять в индекс поисковых систем, но позволяет роботу переходить по всем ссылкам, размещенным на странице.
разместив его в секцию
.Кроме этого на всех страницах пагинации размещаются теги "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.
Также при размещении текста на странице категории, рекомендуется скрывать его на остальных страницах пагинации.
Аналогично предыдущему способу на всех страницах пагинации размещаются теги rel="prev"/"next". Отличие от предыдущего подхода состоит в том, что вместо закрытия индексации нумерованных страниц с помощью мета-тега robots, на каждой странице пагинации размещается атрибут rel="canonical", указывающий каноническую ссылку на эту же страницу. То есть на странице пагинации http://site.com/page3.html в блоке
будет размещена каноническая ссылка, ведущая на нее же:
При этом страницы пагинации не должны быть закрыты от индексирования ни одним из способов.
Основным признаком неправильно настроенной пагинации являются дубли метаданных среди проиндексированных поисковиками страниц.
Самый простой способ для их определения - посмотреть проиндексированные страницы в Google через оператор site: , например site:example.com покажет все страницы для домена example.com. Но, если Ваш сайт имеет большое количество страниц, удобнее будет воспользоваться специализированными сервисами типа Screaming Frog Seo Spider . Находим страницы-дубликаты по title и обращаем внимание на их URL для обнаружения страниц пагинации (адреса содержат параметр типа page= ).
Также Вы можете найти дубликаты title с помощью панели вебмастера Google:
Откройте вкладку Вид в поиске > Оптимизация HTML
Переходим в раздел "Повторяющиеся заголовки (теги title)" и анализируем адреса страниц на схожесть со страницами пагинации.
В заключении можно сказать, что единого мнения по поводу оптимизации страниц пагинации в среде seo-специалистов не существует. Поэтому , подмечайте тактики, которые эффективно работают именно для Вашей ниши и внедряйте их в жизнь. Желаем успехов и роста позиций Ваших проектов!