WordPress SEO: Внедрение расширенных сниппетов

Мануалы
Alexandra Metiza
9539
12 марта 2020
9Нравится
6Комментарии
Поделиться
WordPress SEO: Внедрение расширенных сниппетов

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

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

1. Суть микроразметки (структурированных данных)

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

Для чего вашему сайту нужна микроразметка:
  • Расширенный сниппет выглядит более информативным и привлекательным (в первую очередь — на странице результатов поиска, затем — в лентах социальных сетей). Именно благодаря микроразметке вы можете увидеть в сниппете номер телефона, адрес, рейтинг товара, строку для поиска внутри сайта, время работы, имя автора статьи и другие удобные атрибуты.
  • Грамотная разметка повышает релевантность страницы и её CTR. К примеру, выбирая из двух сайтов одинаковых сервисов, пользователь скорее выберет тот, где есть номер для быстрого набора с мобильного.
  • Микроразметка выступает в качестве дополнительного фактора ранжирования вашего сайта в поиске Google.

1.1. Глоссарий Schema.org

Определение микроразметки в справочных материалах Google гласит:

«Если страницы на вашем сайте размечены специальным образом, то в Google Поиске могут отображаться их расширенные описания и другая полезная информация. Например, расширенное описание для сайта ресторана может содержать сводный отзыв и информацию о ценах. Данные на странице структурируются с помощью глоссария schema.org или в таких форматах, как микроданные, RDF, микроформаты и т.д.».
Элементы сниппета

Открытая библиотека schema.org является своеобразным языком, который «понимают» поисковые системы Google, Яндекс, Bing, Yahoo. Она включает в себя сотни различных вариантов микроразметки, состоящих из специальных тегов. В их числе — не только варианты для разных типов контента (статья, видео, аудио), но и для разных типов организаций (корпорация, государственное учреждение, локальный бизнес, медиа-группа) с десятками уточняющих расширений. Они помогают показать поисковым роботам, к какому типу данных принадлежит тот или иной контент на данной странице.

Полный перечень существующих типов разметки Schema.org можно найти на сайте библиотеки.

1.2. Протокол OpenGraph

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

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

WordPress SEO: OpenGraph

Полный перечень элементов и синтаксис микроразметки OpenGraph подробно описаны на официальном сайте протокола.

2. Внедрение микроразметки с плагинами WordPress

2.1. Внедрение разметки Schema

Для самостоятельного внедрения микроразметки без помощи разработчика вы можете использовать бесплатный плагин «All In One Schema Rich Snippets». К сожалению, он позволяет внедрять только 9 базовых видов разметки Schema. Хорошая новость заключается в том, что остальные десятки видов вам попросту могут никогда не пригодиться. В числе базовых шаблонов разметки доступны следующие:

  • обзор продукта,
  • мероприятие,
  • персона,
  • продукт,
  • рецепт,
  • программное обеспечение (приложение),
  • видео,
  • статья,
  • сервис.
Чтобы внедрить микроразметку Schema для страницы или отдельной записи, нужно:
  1. Открыть консоль вашего сайта.
  2. В разделе «Плагины» установить и активировать плагин «All In One Schema Rich Snippets».
  3. Зайти в стандартный редактор страниц (записей) и перейти к панели «Configure Rich Snippet», которая расположена под окном с основным содержимым поста.
    4. WordPress SEO: микроразметка Shema
  1. Выбрать подходящий шаблон разметки.
  2. Заполнить все предлагаемые поля.
    3. WordPress SEO: шаблон сниппетов

Заполняя Title и Description, не забывайте о правилах, которые мы ранее озвучивали в статье об оптимизации контента.

Читайте также «Что такое тег title, и как его правильно составить».

2.2. Внедрение разметки OpenGraph

Для создания разметки OpenGraph можно использовать один из множества доступных бесплатных плагинов, но на деле с этой задачей отлично справляется дополнительный функционал плагина YOAST, который мы многократно упоминали в предыдущих статьях серии Wordpress SEO.

YOAST позволяет вам задавать 4 из 5 основных свойств объекта:
  • og:url (канонический URL данной страницы, который задаётся на вкладке «Дополнительно»),
  • og:title (заголовок статьи),
  • og:description (краткое описание, которое высвечивается в сниппете),
  • og:image (изображение, которое подтягивается в сниппет страницы или записи в соцсетях).

Другие теги, включая og:type, можно задавать с помощью плагина «Open Graph for Facebook, Google+ and Twitter Card Tags».

Чтобы внедрить микроразметку OpenGraph для страницы или отдельной записи с YOAST, выполните следующие действия:
  1. Откройте консоль сайта.
  2. Установите и активируйте плагин YOAST, если вы этого ещё не сделали.
  3. Зайдите в стандартный редактор страниц (записей), перейдите к панели «YOAST SEO» и откройте вкладку (слева) «Социальные сети».
  4. Укажите заголовок. Его длина должна составлять от 60 до 90 символов.
  5. Пропишите краткую версию текущего Description, учитывая, что Facebook корректно отображает описания длиной до 200 символов в среднем.
  6. Загрузите изображение-миниатюру для сниппета. Его габариты в идеале должны составлять 1200 x 627 пикселей (соотношение 1,91:1). Размер изображения не должен превышать 5 Мбайт, потому рекомендуем предварительно оптимизировать его при помощи сервиса TinyPNG.

    7. WordPress SEO: внедрение в Yoast

3. Внедрение «хлебных крошек»

Построение навигационной цепочки или «хлебных крошек» («breadcrumbs») также осуществляется с помощью словаря Schema.org.

Для чего сайту нужны «хлебные крошки»:
  • Навигационная цепочка улучшает юзабилити сайта и, как следствие, снижает показатель отказов (bounce rate).
  • Хлебные крошки могут стать частью сниппета и сделать его ещё более информативным и понятными (как для юзера, так и для поисковиков).

Для внедрения «хлебных крошек» можно использовать уже хорошо знакомый вам YOAST (базовая конфигурация) или Breadcrumb NavXT (расширенная конфигурация).

После установки и активации каждый из них потребует от вас внедрить определённый отрывок кода в файл header.php текущей темы. Вы можете найти его в папке вида wp-content/themes/ваша-тема/, используя FTP-клиент Filezilla.

Код для внедрения навигационной цепочки посредством YOAST выглядит так:
<?php if ( function_exists('yoast_breadcrumb') ) { yoast_breadcrumb(' <p id="breadcrumbs">','</p> '); } ?>
Если же вы остановили выбор на Breadcrumb NavXT, то вам понадобится внедрить в хедер следующий код:
<div class="breadcrumbs" typeof="BreadcrumbList" vocab="http://schema.org/"> <?php if(function_exists('bcn_display')) { bcn_display(); }?> </div>

Также на эту тему у нас есть более подробный отдельный пост «Что такое хлебные крошки, и как их внедрить на сайте».

4. Проверка микроразметки на ошибки

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

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

Подводим итоги

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

Для корректного внедрения структурированных данных вам понадобятся несколько инструментов:

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