Поисковые системы используют огромное количество пунктов при оценке ранжирования каждого сайта в сети, и значение каждого из них трудно переоценить. Одним из важнейших показателей оценки сайта являются поведенческие факторы, которые можно улучшить, используя микроразметку. Благодаря разметке можно индивидуально настроить представление сайта в результатах поиска, социальных сетях и, тем самым, увеличить вероятность того, что пользователь заметит именно Ваш сайт и перейдет именно на него – то есть, повысится кликабельность и количество переходов, а значит – улучшатся и поведенческие факторы. Кроме того, с помощью разметок Вы конкретно показывайте поисковой машине или социальной сети, что именно размещено на странице сайта.
Далее рассмотрим несколько наиболее популярных видов микроразметки.
1. Schema.org
Этот стандарт микроразметки появился в 2011 году и используется как в поисковой системе Яндекс, так и в поисковой системе Google. Её отличием является то, что она настраивается для конкретных элементов страницы сайта (то есть прямо в имеющемся контенте страниц), а не для всей страницы целиком, кроме того – ее настройка влияет именно на представление сайта в результатах поиска – можно добавить новую информацию в сниппеты, улучшить представление уже имеющихся блоков.
Важные моменты по настройке микроразметки schema.org:
- Микроразметка начинается с указания нужного формата в отдельном теге, например:
<div itemscope itemtype="https://schema.org/Organization">
- Ссылки на форматы нужно указывать обязательно с протоколом, например, должна быть полная ссылка вида «https://schema.org/Offer», так как Яндекс может не пропустить ссылки вида «//schema.org/Offer»;
- Обычно разметка «текстовых элементов» добавляется с помощью отдельных тегов <span>, например:
<span itemprop="streetAddress">Советская, д. 1</span>
Но можно добавлять параметры и к уже существующим тегам, если их значение точно описывает параметр разметки (например, можно добавить параметры прямо к заголовку H1, так как не рекомендуется добавление внутренних тегов в теги <h1></h1>).
Отдельно отметим формат data-vocabulary.org – это уже несколько устаревший формат, который разрабатывался Google еще до schema.org, его разработка остановлена, поэтому в статье мы не будем его касаться.
Что же можно разметить, используя schema.org? На «типичном сайте» в основном размечают следующие элементы:
- Хлебные крошки;
- Отзывы (в настоящий момент, не поддерживается Яндексом, но поддерживается Google);
- Видео контент;
- Изображения;
- Товары;
- Контакты и информация о компании;
- Новости и статьи;
- Вопросы и ответы.
Рассмотрим более подробно разметку каждого из приведенных выше элементов. Сразу необходимо отметить, что ниже будут описаны не все возможные схемы и параметры разметок, а те, указание которых позволит добиться валидации как в Яндекс, так и в Google, описав все основные и важные свойства объекта.
1.1 Разметка Schema.org для хлебных крошек
Разметив хлебные, крошки можно добиться улучшения читаемости навигационной цепочки в сниппете сайта в поисковой системе. Элементы навигации будут написаны так, как Вы укажете их в разметке, в результате чего цепочка примет более «приятный» вид, например:
Для разметки хлебных крошек используется специальный формат https://schema.org/BreadcrumbList.
Пример микроразметки хлебных крошек по данному формату, который проходит валидацию и в Яндекс и в Google:
<ul itemscope itemtype="https://schema.org/BreadcrumbList">
<li itemprop="itemListElement" itemscope itemtype=https://schema.org/ListItem>
<a itemscope itemtype="https://schema.org/Thing" itemprop="item" href="/" itemid="https://site.ru/">
<span itemprop="name">Главная</span>
</a>
<meta itemprop="position" content="1" />
</li>
<li itemprop="itemListElement" itemscope itemtype=https://schema.org/ListItem>
<a itemscope itemtype="https://schema.org/Thing" itemprop="item" href="second_page"
itemid="second_page">
<span itemprop="name">Вторая страница</span>
</a><meta itemprop="position" content="2" />
</li>
<li itemprop="itemListElement" itemscope itemtype=https://schema.org/ListItem>
<meta itemscope itemtype="https://schema.org/Thing" itemprop="item" itemid="third_page">
<span itemprop="name">Третья страница</span>
<meta itemprop="position" content="3" />
</li>
</ul>
Важно: Как правило, в хлебных крошках последний элемент является названием самой открытой страницы и поэтому не является ссылкой, поэтому в примере заключительный элемент хлебных крошек также не является ссылкой. При необходимости Вы можете настроить и последний фрагмент хлебных крошек в виде ссылки, например, если навигационная цепочка на Вашем сайте не включает в себя название открытой страницы и заканчивается ссылкой на родительский раздел.
Таким образом, для прохождения валидации и в Яндекс и в Google, необходимо указание в разметке хлебных крошек параметров:
- itemListElement – указание разметки https://schema.org/ListItem;
- item – указание разметки https://schema.org/Thing и конкретных ссылок на страницы;
- name – конкретный анкор ссылки;
- position – позиция ссылки в хлебных крошках.
В целом, Вы можете настраивать микроразметку хлебных крошек по приведенному Выше примеру, подставляя свои ссылки, анкоры и при необходимости стили оформления хлебных крошек Вашего сайта.
1.2 Разметка Schema.org для картинок
Для разметки изображений используется специальный формат https://schema.org/ImageObject.
Эта микроразметка позволит улучшить представление сайта в сервисе Яндекс Картинки или Google Картинки.
Пример микроразметки изображений по данному формату, который проходит валидацию и в Яндекс и в Google:
<div itemscope itemtype="https://schema.org/ImageObject">
<img src="image.jpg" itemprop="contentUrl" />
<span itemprop="description">Описание картинки</span>
</div>
Таким образом, в разметке изображений указывается путь к Вашему фото и описание этой картинки, причем описание (параметр «description») не является обязательным для прохождения валидации как в Яндекс, так и в Google, то есть валидацию пройдет и разметка вообще без описания:
<div itemscope itemtype="https://schema.org/ImageObject">
<img src="image.jpg" itemprop="contentUrl" />
</div>
Но нужно отметить, описание поможет немного улучшить представление картинки.
1.3 Разметка Schema.org для видео материалов
Этот вид микроразметки позволит добавить к сниппетам Вашего сайта элемент видео, который будет ссылкой на плеер для его просмотра, таким образом, значительно улучшиться заметность сайта в выдаче по некоторым запросам.
Пример сниппета с размеченным видео:
Для разметки видео контента используется схема https://schema.org/VideoObject.
Пример микроразметки видео ролика, который проходит валидацию и в Яндекс и в Google:
<div>
<iframe src="https://www.youtube.com/embed/W4XrivKvhHI" width="560" height="315" allowfullscreen name="su-youtube">
</iframe>
</div>
<div itemscope="itemscope" itemtype="https://schema.org/VideoObject" style="display: none;">
<a itemprop="url" href="https://www.youtube.com/watch?v=W4XrivKvhHI&feature=youtu.be">
<span itemprop="name">Название ролика</span>
</a>
<p itemprop="description">Описание о чем ролик</p>
<p itemprop="duration" content="T4M12S"> </p>
<p itemprop="isFamilyFriendly" content="true"> </p>
<p>Дата загрузки:<span itemprop="uploadDate">2017-11-13T00:00:00</span></p>
<span itemprop="thumbnail" itemscope="itemscope" itemtype="https://schema.org/ImageObject">
<img itemprop="contentUrl" src="https://i.ytimg.com/vi/5jMQRCopN4I/hqdefault.jpg" />
</span>
<link itemprop="thumbnailUrl" href="https://i.ytimg.com/vi/5jMQRCopN4I/hqdefault.jpg" />
</div>
Используемые параметры:
- iframe src - ссылка на видео;
- name – название ролика;
- description – описание ролика;
- duration – длительность ролика, именно в формате типа «T4M12S» - TминутыМсекундыS;
- isFamilyFriendly – указание, можно ли смотреть, по сути, детям – либо true (можно), либо false (только для взрослых);
- uploadDate – дата и время загрузки в формате 2017-11-13T00:00:00;
- contentUrl и thumbnail – указание схемы разметки https://schema.org/ImageObject для превью видео;
- thumbnailUrl – это ссылка на картинку-превью видео, для youtube ее можно получить, используя ссылку типа https://i.ytimg.com/vi/5jMQRCopN4I/hqdefault.jpg, в которой вместо выделенного красным фрагмента нужно поставить идентификатор Вашего видео, как правило, это последний фрагмент в URL видео на youtube.
1.4 Разметка Schema.org для вопросов и ответов
Благодаря этой разметке можно получить более качественное описание, которое будет давать прямо в выдаче ответ на конкретный вопрос, указанный в запросе.
Пример:
Для настройки разметки используются схемы https://schema.org/Question, https://schema.org/Answer.
Пример разметки вопроса и ответа на него, который проходит валидацию и в Яндекс и в Google:
<div itemscope="itemscope" itemtype="https://schema.org/Question">
<p><span itemprop="name">Вопрос</span></p>
<div itemprop="acceptedAnswer" itemscope="itemscope" itemtype="https://schema.org/Answer">
<div itemprop="text">
<p>Ответ.</p>
</div>
</div>
</div>
Для этого вида разметки нет большого количества параметров, вопрос оформляется в параметр «name», ответ - в «text».
1.5 Разметка Schema.org для отзывов
Стоит отметить, что в настоящий момент Яндекс в полной мере не поддерживает разметку отзывов (https://yandex.ru/support/webmaster/supported-schemas/review-organization.html):
Но Google продолжает поддерживать этот тип разметки.
Обнаружив микроразметку отзывов и оценок, поисковая система может показывать в сниппете текст отзыва и оценку-рейтинг.
Для разметки отзывов используется схема https://schema.org/Review.
Пример микроразметки:
<div itemscope="itemscope" itemtype="https://schema.org/Review">
<p itemprop="name"><a href="/url" itemprop="url">Имя Фамилия</a></p>
<div>
<div itemprop="author" itemscope="itemscope" itemtype="https://schema.org/Person">
<span itemprop="name">Имя Фамилия</span>
</div>
<span itemprop="datePublished" content="2019-05-06">06.05.2019</span>
</div>
<div itemprop="reviewRating" itemscope="itemscope" itemtype="https://schema.org/Rating">
<p><span itemprop="ratingValue">5</span><span itemprop="bestRating"></span>.</p>
</div>
<div itemprop="reviewBody">
<p>Текст отзыва.</p>
</div>
<div style="display: none;" itemprop="itemReviewed" itemscope="itemscope" itemtype=" https://schema.org/Organization">
<span itemprop="name">Название компании</span>
<div itemscope="itemscope" itemtype="https://schema.org/PostalAddress" itemprop="address">
<span itemprop="streetAddress">Адрес компании</span>
<span itemprop="postalCode">Индекс</span>
<span itemprop="addressLocality">Регион компании-город</span>
</div>
<span itemprop="telephone">Телефон</span>
<span itemprop="email">email@mail.ru</span></div>
</div>
Используемые параметры:
- первый параметр name содержит ссылку на страницу, где размещен отзыв и название данного отзыва;
- author содержит объявление разметки https://schema.org/Person и указывает того, кто оставил отзыв – ФИО или название компании;
- datePublished – дата публикации отзыва;
- reviewRating – описание рейтинга-оценки данного отзыва;
- ratingValue – конкретная оценка;
- reviewBody – блок текста отзыва;
- Блок описания компании, о которой оставлен отзыв – здесь указываются схемы: https://schema.org/Organization (с параметром name для названия компании), https://schema.org/PostalAddress (с параметрами streetAddress – улица, номер дома, квартира-офис, postalCode - можно указать индекс, addressLocality – город-регион, telephone – номер телефона, email – электронный адрес).
1.6 Разметка Schema.org для контактов и информации о компании
Этот тип микроразметки позволяет улучшить представление сайта в результатах поиска, добавить режим работы, адрес, номер телефона.
Используются схемы https://schema.org/Organization и https://schema.org/PostalAddress.
Пример сниппета с разметкой «О компании»:
Пример разметки с информацией о компании, который проходит валидацию и в Яндекс и в Google:
<div itemscope="itemscope" itemtype="https://schema.org/Organization">
<span itemprop="name">Название компании</span>
<div itemprop="address" itemscope="itemscope" itemtype="https://schema.org/PostalAddress">
<span itemprop="streetAddress">Улица, дом, квартира-офис</span>
<span itemprop="addressLocality">Регион-город</span>
</div>
<span itemprop="telephone">Телефон</span>
<span itemprop="email">Электронный адрес</span>
</div>
Здесь используются следующие параметры:
- name – для указания названия компании;
- streetAddress – указание адреса, улица, дом;
- addressLocality – местоположение организации, регион;
- telephone – номер телефона;
- email – электронный адрес;
Дополнительно можно указывать индекс так:
<span itemprop="postalCode">Индекс</span>
1.7 Разметка Schema.org для новостей и статей
Эта микроразметка позволит улучшить представление в результатах поиска информационных страниц – указывать то, что будет показываться в описании, заголовке.
В данном случае используется схема https://schema.org/NewsArticle. В целом, этот тип микроразметки относится к подвиду разметки творческих работ CreativeWork, но подходит для страниц статей и новостей, блога.
Пример разметки статьи, который проходит валидацию и в Яндекс и в Google:
<div itemscope itemtype="https://schema.org/NewsArticle">
<meta itemprop="genre" content="Жанр статьи">
<h1 itemprop="headline">Заголовок-название статьи</h1>
<div itemprop="author" itemscope itemtype="https://schema.org/Person">
<span itemprop="name">Автор (например, название сайта-компании)</span>
</div>
<meta itemprop="datePublished" content="2015-02-05T08:00:00+08:00"/>
<meta itemprop="image" content="https://www.site.ru/images/image.jpg">
<div itemprop="description">
<p>Описание статьи.</p>
</div>
<div itemprop="publisher" itemscope itemtype="https://schema.org/Organization">
<meta itemprop="name" content="Название компании">
<meta itemprop="telephone" content="+71111111111">
<meta itemprop="address" content="City">
<span itemprop="logo" itemscope itemtype="https://schema.org/ImageObject">
<img class="itemprops" itemprop="url image" src="https://www.site.ru/images/image.jpg" />
</span>
</div>
</div>
Некоторые пояснения:
В параметре itemprop="genre" указывается жанр статьи (если трудно выделить жанр, то можно указать, хотя бы «Статья» или «Новость о компании»/«Новость отрасли»).
В параметре itemprop="author" указывается информация о том, кто является автором статьи или новости (если автора нет, то указывать название компании).
В параметр itemprop="headline можно добавить название, отличающееся от заголовка h1, для этого используем отдельные дополнительные теги .
В параметре itemprop="datePublished" рекомендуется указывать дату публикации именно в формате типа «2015-02-05T08:00:00+08:00», так как он поддерживается и Яндекс и Google.
В параметре itemprop="image" указывается картинка для данной статьи (если на сайте проблема с картинками и у статей их нет, то хотя бы логотип добавить можно).
В блоке с параметром itemprop="publisher" указывается разметка с информацией о компании по схеме https://schema.org/Organization, логотип размечен по схеме https://schema.org/ImageObject.
1.8 Разметка Schema.org для товаров
Такой тип микроразметки нужен, чтобы добавить в сниппеты сайта более конкретную информацию о компании – стоимость, описание товара.
Пример отображения разметки товара в сниппете:
Для настройки используются схемы https://schema.org/Product, https://schema.org/Offer.
Пример разметки товара, который проходит валидацию и в Яндекс и в Google:
<div itemscope itemtype = "https://schema.org/Product">
<img itemprop="image" src="/images/image.png" />
<meta itemprop="brand" content="Название бренда"/>
<span itemprop = "name">Название товара</span>
<meta itemprop="description" content="Описание товара"/>
<div itemprop = "offers" itemscope itemtype = "https://schema.org/Offer">
<link itemprop="url" href="https://www.site.ru/catalog/tovar" />
<div itemprop = "price">
<meta itemprop="priceCurrency" content="RUB"/>1000.00
</div>
<span>руб.</span>
<span>В наличии</span>
<link itemprop="availability" href="https://schema.org/InStock">
</div>
</div>
Нужно отметить, что цена в сниппете не показывается, если в Offer в свойстве availability указано, что товара нет в наличии.
Используемые параметры:
- itemprop="image" – указывается фото товара;
- itemprop="brand" – указывается название бренда;
- itemprop = "name" – указывается название товара;
- itemprop="description" – указывается описание товара;
- itemprop="url" – указывается URL страниц товара;
- itemprop = "price" – здесь указывается цена товара, причем важно, чтобы в блоке данного параметра была указано только цифра;
- itemprop="availability" – указывается наличие товара (если не в наличии, то нужно указать https://schema.org/OutOfStock).
Отметим, что для товаров в валидаторе Google есть возможность предварительного просмотра отображения разметки:
2. Open Graph
Этот стандарт микроразметки нужен для того, чтобы превью сайта, которое появляется при размещении ссылки в социальных сетях, было более привлекательным.
В настоящий момент, Open Graph будет работать в социальных сетях: Facebook, Вконтакте, Google+, Twitter, LinkedIn, Pinterest, а также - в сервисе Яндекс.Видео.
Сразу нужно отметить, что этот стандарт микроразметки, так как он, по сути, представляет собой описание отображения ссылки для социальных сетей, описывает страницу полностью, а не конкретные ее фрагменты.
Можно выделить следующие основные значения типов разметки:
- website – услуги, коммерческие страницы;
- article – информационные страницы;
- video.movie/video.tv_show/video.other – видео фильм, шоу, прочее видео и т.д.
Эти значения проставляются в параметр og:type.
Также, часто используются следующие параметры:
- og:title – название страницы, которое будет отображаться в представлении сайта;
- og:description – описание страницы, которое будет отображаться в представлении сайта;
- og:image – URL картинки, которая будет отображаться;
- og:url – URL самой страницы;
- og:site_name – название сайта/компании;
- og:site – домен типа;
- og:type:article:section – можно использовать для указания категории конкретной статьи.
Если разметка описывает видео, то можно использовать следующие параметры:
- og:video – URL видео на сервере;
- video:duration – длительность видео в секундах;
- ya:ovs:upload_date – дата загрузки в формате «2017-11-13»;
- ya:ovs:adult – только для взрослых или нет (true/false);
- og:video:type – тип самого видео, например, «application/x-shockwave-flash».
Можно настраивать индивидуальные разметки для разных сетей, подставляя вместо «og», название социальной сети, например, «twitter», «vk», например:
<meta property="twitter:url" content="https://site.ru/page">
<meta property="twitter:title" content="Название">
<meta property="twitter:description" content="Описание">
<meta property="twitter:image" content="https://site.ru/image.png">
<meta property="twitter:site" content="site.ru">
Пример настройки разметки для информационных страниц, который проходит валидацию и в Яндекс и в Google:
<meta property="og:title" content="Название страницы"/>
<meta property="og:description" content="Текст превью" />
<meta property="og:image" content="https://www.site.ru/images/image.jpg"/>
<meta property="og:type" content="article"/>
<meta property="og:type:article:section" content="Название раздела, в котором находится страницы"/>
<meta property="og:url" content= "https://www.site.ru/page.php"/>
Для значения типа «article» обязательными параметрами являются og:image, og:url, og:title, og:type.
Пример настройки разметки для страницы товара, который проходит валидацию и в Яндекс и в Google:
<meta property="og:type" content="website">
<meta property="og:description" content="Купить товар за 1000 рублей."/>
<meta property="og:site_name" content="Интернет-магазин «Название»">
<meta property="og:title" content="Товар N">
<meta property="og:url" content="https://www.site.ru/page.php">
<meta property="og:image" content="https://www.site.ru/images/image.jpg"/>
Для значение типа «website» обязательными параметрами являются og:image, og:url, og:title, og:type.
Пример настройки разметки для страницы с видео, который проходит валидацию и в Яндекс и в Google:
<meta property="og:title" content="Название видео/страниц с видео "/>
<meta property="og:url" href="https://www.site.ru/page.php"/>
<meta property="og:video" href="https://youtu.be/W4XrivKvhHI"/>
<meta property="og:description" content="Описание видео/страниц с видео."/>
<meta property="video:duration" content="256"/>
<meta property="og:image" href="https://img.youtube.com/vi/W4XrivKvhHI/hqdefault.jpg"/>
<meta property="ya:ovs:upload_date" content="2017-11-13"/>
<meta property="ya:ovs:adult" content="false"/>
<meta property="og:type" content="video.other"/>
<meta property="og:video:type" content="flash"/>
В данном случае все приведенные параметры обязательны.
Важный момент заключается в том, что чтобы пройти валидацию разметке видео, необходимо добавление в тег <html> специального префикса, например:
<html prefix="og: http://ogp.me/ns#
video: http://ogp.me/ns/video#>
Пример отображения в facebook размеченной страницы:
В приведенном примере размечены: заголовок, описание, картинка и не отображаемые внешне параметры - URL страниц, тип разметки и категория статьи «og:type:article:section».
Таким образом, разметка Open Graph позволяет задать желаемые названия, описания, изображения и другие параметры, отображаемые в сниппете страницы в социальных сетях.
3. JSON-LD
Такой тип разметки использует все те же форматы разметки schema.org, часть которых уже была описана выше. Разница заключается в том, что JSON описывается разово в блоке <head></head> страницы сайта и, таким образом, описывает страницу целиком, а не конкретные блоки контента/элементы страницы, как это делает просто разметка schema.org.
Есть важный момент по использованию этого вида разметки в Яндекс: «данные, размеченные с помощью JSON-LD, используются Яндекс.Почтой, но пока не отображаются в результатах поиска Яндекса» (https://yandex.ru/support/webmaster/json-ld/about.html). Однако это не значит, что теперь можно не обращать внимание на прохождение валидации этой разметки в Яндекс, лучше сразу позаботиться об успешной валидации JSON разметки в обеих поисковых системах.
Разметка настраивается в отдельных тегах:
<script type="application/ld+json">
{
CODE
}
</script>
Как уже было указано выше, данный формат использует схемы разметки schema.org, например, часто используются следующие:
- LocalBusiness – для описания контактов, страницы о компании;
- Article – для описания информационных страниц/страниц с обычным контентом, где нельзя настроить товарное предложение;
- Organization – для описания информации о компании;
- ImageObject – для описания изображения;
- Person – для указания авторства;
- Product – для описания товарных страниц;
- Offer – для описания товарных страниц;
- InStock – для указания наличия товара.
Пример разметки информации о компании и контактов, который проходит валидацию и в Яндекс и в Google:
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "LocalBusiness",
"image": "https://www.site.ru/images/image.png",
"address": {
"@type": "PostalAddress",
"addressLocality": "Город",
"addressRegion": "Регион",
"postalCode":"111111",
"streetAddress": "ул. Улица, д. 1"
},
"description": "Текстовое описание сайта/компании",
"name": "Название сайта/компании",
"telephone": "+7 (111) 111-11-11",
"openingHours": "пн.-вс., 9:00-18:00",
"geo": {
"@type": "GeoCoordinates",
"latitude": "55.97430159995695",
"longitude": "37.66872078180313"
},
"sameAs" : [ "https://vk.com/group",
"https://www.facebook.com/group/",
"https://www.instagram.com group/",
"https://www.youtube.com/channel/UCCyAzvgrTT8uTBGA-dqUg7Q"]
}
</script>
Несколько пояснений по параметрам:
- В блоке «GeoCoordinates» указываются координаты долготы и широты местоположения;
- В блоке «sameAs» указываются другие представительства компании в Интернет, например, группы в социальных сетях;
- postalCode – это почтовый индекс;
- openingHours – это информация о режиме работы.
Предварительный просмотр можно использовать в валидаторе разметки Google:
Пример разметки товарной страницы, который проходит валидацию и в Яндекс и в Google:
<script type="application/ld+json" >
{
"@context": "https://schema.org",
"@type": "Product",
"url": "https://www.site.ru/catalog/product",
"category": "Категория товара",
"image": "https://www.site.ru/images/photo-tovara.jpg",
"manufacturer": "Производитель",
"model": "Модель/тип товара",
"description": "Описание товара.",
"name": "Название товара",
"offers": {
"@type": "Offer",
"availability": "https://schema.org/InStock",
"price": "5000",
"priceCurrency": "RUB"
}
}
</script>
Несколько пояснений по параметрам:
- url – это URL конкретной страницы;
- availability – наличие (выше для schema.org указывалось, какую схему нужно проставить в случае, если товар не в наличии);
- price – цены, обязательно должна быть только цифра;
- priceCurrency – валюта цены.
Пример отображения в Google страницы с настроенной разметкой:
Пример разметки страницы статьи, который проходит валидацию и в Яндекс и в Google:
<script type="application/ld+json">
{
"@context" : "https://schema.org",
"@type" : "Article",
"mainEntityOfPage":{
"@type":"WebPage",
"@id":"https://www.site.ru/article.php"
},
"url" : "https://www.site.ru/article.php",
"datePublished": "2019-01-01",
"dateModified":"2019-01-01",
"headline": "Название статьи",
"image": {
"@type" : "ImageObject" ,
"url": "https://www.site.ru/images/image.jpg",
"height" : 800,
"width" : 1200
},
"articleBody": "Текст описания",
"author": {
"@type": "Person",
"name": "Автор или название компании",
"url": "https://vk.com/group"
},
"publisher": {
"@type": "Organization ",
"name": "Название компании",
"logo" : {
"@type": "ImageObject",
"url": "https://www.site.ru/images/logo/image.jpg"
}
}
}
</script>
Несколько пояснений по параметрам:
- datePublished/dateModified – дата публикации/последней модификации статьи;
- height/width – можно указать размеры картинки статьи.
Пример отображения в Google, где в сниппет вместе с текстом описания попала дата публиrации статьи, хотя она на самой странице не выводится:
Пример краткой настройки прочих страниц на основе Article (например, страницы услуг, на которых нельзя настроить товарную разметку, статичные страницы и т.д.):
<script type = "application/ld+json">
{
"@context" : "https://schema.org",
"@type" : "Article",
"name": "Название страницы",
"datePublished": "2019-01-01",
"headline": "Название статьи",
"image": {
"@type" : "ImageObject" ,
"url": "https://www.site.ru/images/image.jpg"
},
"author": {
"@type": "Person",
"name": "Название сайта/компании"
},
"articleSection":"Категория, например, Услуги",
"articleBody":"Текст описания, например, предлагаем заказать услуг за 1000 рублей!",
"publisher": {
"@type": "Organization ",
"name": "Название компании",
"logo" : {
"@type": "ImageObject",
"url": "https://www.site.ru/images/logo/image.jpg"
}
}
}
}
</script>
В данном случае никаких дополнительных параметров, кроме как описанных выше, не используется.
Заключение
Итак, выше были рассмотрены три основных формата микроразметок (Schema.org, Open Graph, JSON LD), которые позволяют улучшить представление сайта в поисковых системах и социальных сетях и, тем самым, косвенно повлиять на улучшение поведенческих факторов ранжирования.
Обращайтесь в компанию "Increase Sales" для оптимизации и продвижения Ваших сайтов в поисковых системах!