Семантическая микроразметка на сайте

Содержание

• Что такое микроразметка?
• Зачем нужна микроразметка на сайте?
• Словари и синтаксисы микроразметки
• Как добавить микроразметку на сайт?
• Самые популярные типы микроразметки и примеры кода
  • Словарь Schema.org
  • Словарь Open Graph Protocol
  • Словарь Twitter Cards
  • Как проверить корректность добавления микроразметки на страницах сайта?
• Как отправить страницу на переиндексацию?

Что такое микроразметка?

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

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

Использование микроразметки (или структурированных данных) впервые было предложено в 2009 году консорциумом Schema.org, с целью помочь поисковым системам лучше понимать и анализировать содержимое веб-страниц, и быстро получила широкое распространение в веб-разработке. Сегодня микроразметка используется для различных типов контента, включая новости, рецепты, события, товары и т.д.

Зачем нужна микроразметка на сайте?

Использование микроразметки на сайте, в настоящее время, может предоставить следующие преимущества:

1. Улучшенная видимость (более информативный и привлекательный сниппет) в поиске: правильное использование микроразметки может помочь выделить ваш сайт в результатах поиска, что может привести к большему количеству кликов на страницу.
2. Улучшение качества поиска: микроразметка позволяет поисковым системам более точно понимать содержимое страницы, что может улучшить релевантность результатов поиска и помочь пользователям быстрее находить нужную информацию.
3. Улучшенная интеграция с социальными сетями: микроразметка поможет страницам вашего сайта лучше выглядеть в социальных сетях: Facebook, Twitter, Вконтакте, что также может привести больше трафика.

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

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

Словари и синтаксисы микроразметки

Словари микроразметки

Словарь микроразметки содержит набор стандартных типов контента, например, хлебные крошки, товары, рецепты, и их свойств, которые могут быть использованы для использования и разметки на веб-странице с использованием определенного синтаксиса микроразметки, например, Microdata, RDFa или JSON-LD.

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

Schema.org

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

Open Graph Protocol

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

Twitter Cards

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

Dublin Core

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

Geo

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

CreativeWork

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

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

Синтаксисы микроразметки

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

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

1. Microdata: это наиболее распространенный синтаксис микроразметки, который используется в HTML5. Microdata используется для добавления структурированных данных на веб-страницы с помощью атрибутов HTML, таких как itemscope, itemtype и itemprop.
2. JSON-LD: это формат данных, основанный на языке JavaScript, который используется для добавления структурированных данных на веб-страницы. JSON-LD использует объекты и массивы для описания структуры данных, которые затем могут быть встроены в HTML с помощью тега <script>.
3. RDFa: это синтаксис микроразметки, который используется для добавления метаданных на веб-страницы с помощью атрибутов HTML, таких как property, content и datatype. RDFa позволяет описывать не только сущности, но и свойства и их значения.
4. Microformats: это формат микроразметки, который использует простой синтаксис для описания данных на веб-страницах с помощью классов CSS. Microformats используются для разметки контактных данных, событий, рецептов и другой информации.

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

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

Как добавить микроразметку на сайт?

Чтобы добавить микроразметку на сайт, следуйте этим общим шагам:

1. Выберите тип микроразметки: определите, какой тип микроразметки лучше всего подходит для вашего контента, и изучите соответствующий словарь микроразметки.
2. Добавьте разметку на страницу: используйте HTML-код для добавления соответствующих свойств микроразметки на страницу. Это может включать добавление специальных атрибутов к тегам HTML, таких как <div> или <span>, или использование специальных тегов для описания контента, таких как <meta>.
3. Проверьте разметку: используйте инструменты проверки микроразметки, чтобы проверить, что разметка была добавлена правильно и что она соответствует выбранному словарю микроразметки.
4. Отправьте сайт на индексацию: после того, как микроразметка была добавлена на сайт, отправьте страницы на переиндексацию в поисковых системах, чтобы обеспечить быстрое обнаружение и индексацию разметки.

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

Код микроразметки можно добавить на сайт:

Вручную

1. Выбрать необходимый вид разметки.
2. Использовать генераторы микроразметки.
   • TechnicalSeo.com
   • SearchBloom.com
3. Ввести в генератор необходимые данные.
4. Скопировать сгенерированный код.
5. Добавить информацию в код сайта.

При помощи специальных плагинов

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

• для WordPress:
  • Yoast SEO
  • All in One SEO Pack
  • Schema Pro
  • WP SEO Structured Data Schema
  • Rich Snippets WordPress Plugin
• для Joomla:
  • Structured Data Extension
  • OSMap
  • JSitemap Professional
• для Drupal:
  • Schema.org Metatag
  • SEO Checklist
  • RDFa Breadcrumb
• для OpenCart:
  • SEO Pack Pro
  • Rich Snippets

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

Самые популярные типы микроразметки и примеры кода

Словарь Schema.org

Хлебные крошки (BreadCrumbs)

Хлебные крошки — это элемент навигации на веб-сайте, который помогает пользователям определить своё местоположение на сайте и вернуться к предыдущим страницам, которые они посетили. Использование микроразметки

Пример кода для микроразметки Хлебных крошек.

Словарь Microdata

<div itemscope itemtype="http://schema.org/BreadcrumbList">
<span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://example.com/"><span itemprop="name">Главная</span></a>
<meta itemprop="position" content="1" />
</span>
<span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://example.com/category/"><span itemprop="name">Категории</span></a>
<meta itemprop="position" content="2" />
</span>
<span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://example.com/category/books/"><span itemprop="name">Книги</span></a>
<meta itemprop="position" content="3" />
</span>
<span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://example.com/category/books/science/"><span itemprop="name">Научные книги</span></a>
<meta itemprop="position" content="4" />
</span>
<span itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem">
<span itemprop="name">Статьи</span>
<meta itemprop="position" content="5" />
</span>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"name": "Главная",
"item": "https://example.com/"
},
{
"@type": "ListItem",
"position": 2,
"name": "Категории",
"item": "https://example.com/category/"
},
{
"@type": "ListItem",
"position": 3,
"name": "Книги",
"item": "https://example.com/category/books/"
},
{
"@type": "ListItem",
"position": 4,
"name": "Научные книги",
"item": "https://example.com/category/books/science/"
},
{
"@type": "ListItem",
"position": 5,
"name": "Статьи"
}
]
}
</script>

 

Товары и услуги (Product)

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

Пример кода для микроразметки Товары и услуги.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Product">
<span itemprop="name">Название продукта</span>
<img itemprop="image" src="https://example.com/photos/1x1/photo.jpg">
<img itemprop="image" src="https://example.com/photos/4x3/photo.jpg">
<img itemprop="image" src="https://example.com/photos/16x9/photo.jpg">
<span itemprop="description">Описание продукта</span>
<div itemprop="brand" itemscope itemtype="http://schema.org/Brand">
<span itemprop="name">Название бренда</span>
</div>
<span itemprop="sku">12345</span>
<span itemprop="gtin13">123-456-789</span>
<span itemprop="mpn">ABC123</span>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<a itemprop="url" href="https://example.com/product/123">
<span itemprop="priceCurrency" content="USD">USD</span>
<span itemprop="price" content="99.99">99.99</span>
</a>
<meta itemprop="priceValidUntil" content="2023-04-10">
<link itemprop="availability" href="http://schema.org/InStock">
</div>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Product",
"name": "Название продукта",
"image": [
"https://example.com/photos/1x1/photo.jpg",
"https://example.com/photos/4x3/photo.jpg",
"https://example.com/photos/16x9/photo.jpg"
],
"description": "Описание продукта",
"brand": {
"@type": "Brand",
"name": "Название бренда"
},
"sku": "12345",
"gtin13": "123-456-789",
"mpn": "ABC123",
"offers": {
"@type": "Offer",
"url": "https://example.com/product/123",
"priceCurrency": "USD",
"price": "99.99",
"priceValidUntil": "2023-04-10",
"availability": "https://schema.org/InStock"
}
}
</script>

 

Отзывы (Reviews)

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

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

• Автор отзыва.
• Оценка (рейтинг).
• Дата публикации.
• Заголовок и текст отзыва.
• Продукт, к которому относится отзыв.

Пример кода для микроразметки Отзывы.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Review">
<span itemprop="author">Имя автора</span>
<span itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating">
<span itemprop="ratingValue">4</span>/<span itemprop="bestRating">5</span> звезд
</span>
<span itemprop="datePublished">2023-04-11</span>
<h3 itemprop="name">Заголовок отзыва</h3>
<p itemprop="reviewBody">Текст отзыва</p>
<div itemprop="itemReviewed" itemscope itemtype="http://schema.org/Product">
<h4 itemprop="name">Название продукта</h4>
</div>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Review",
"author": "Имя автора",
"reviewRating": {
"@type": "Rating",
"ratingValue": "4",
"bestRating": "5"
},
"datePublished": "2023-04-11",
"name": "Заголовок отзыва",
"reviewBody": "Текст отзыва",
"itemReviewed": {
"@type": "Product",
"name": "Название продукта"
}
}
</script>

 

Организации (Organization)

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

С помощью этой разметки можно указать следующую информацию об организации:

• Название организации.
• Логотип организации.
• Контактная информация (физический адрес, номер телефона, электронная почта).
• Описание организации.
• Список социальных профилей (Facebook, Twitter, LinkedIn и т.д.).
• URL сайта организации.

Пример кода для микроразметки Организация.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Organization">
<h1 itemprop="name">Название организации</h1>
<img itemprop="logo" src="логотип.png" alt="Логотип организации">
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">Адрес организации</span>
</div>
<span itemprop="telephone">Телефон организации</span>
<span itemprop="email">Электронная почта организации</span>
<p itemprop="description">Описание организации</p>
<ul>
<li><a href="ссылка на профиль в Facebook" itemprop="sameAs">Facebook</a></li>
<li><a href="ссылка на профиль в Twitter" itemprop="sameAs">Twitter</a></li>
<li><a href="ссылка на профиль в LinkedIn" itemprop="sameAs">LinkedIn</a></li>
</ul>
<a href="ссылка на сайт организации" itemprop="url">Сайт организации</a>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Organization",
"name": "Название организации",
"logo": "логотип.png",
"address": {
"@type": "PostalAddress",
"streetAddress": "Адрес организации"
},
"telephone": "Телефон организации",
"email": "Электронная почта организации",
"description": "Описание организации",
"sameAs": [
"ссылка на профиль в Facebook",
"ссылка на профиль в Twitter",
"ссылка на профиль в LinkedIn"
],
"url": "ссылка на сайт организации"
}
</script>

 

События (Event)

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

• Название события.
• Дата и время начала и окончания события.
• Место проведения события (название, адрес, координаты).
• Описание события.
• Изображение, связанное со событием.
• Список организаторов события.
• Список участников события.
• Ссылки на связанные веб-страницы.

Пример кода для микроразметки События.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Event">
<h1 itemprop="name">Название события</h1>
<div itemprop="startDate" content="2023-05-12T19:00">12 мая 2023 г., 19:00</div>
<div itemprop="endDate" content="2023-05-12T21:00">12 мая 2023 г., 21:00</div>
<div itemprop="location" itemscope itemtype="http://schema.org/Place">
<span itemprop="name">Место проведения</span>
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">Адрес места проведения</span>
</div>
<meta itemprop="latitude" content="широта">
<meta itemprop="longitude" content="долгота">
</div>
<p itemprop="description">Описание события</p>
<img itemprop="image" src="изображение.jpg" alt="Изображение, связанное со событием">
<div itemprop="organizer" itemscope itemtype="http://schema.org/Organization">
<span itemprop="name">Название организатора</span>
<a href="ссылка на сайт организатора" itemprop="url">Сайт организатора</a>
</div>
<div itemprop="performer" itemscope itemtype="http://schema.org/PerformingGroup">
<span itemprop="name">Название участника</span>
<a href="ссылка на сайт участника" itemprop="url">Сайт участника</a>
</div>
<a href="ссылка на связанную веб-страницу" itemprop="url">Связанная веб-страница</a>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Event",
"name": "Название события",
"startDate": "2023-05-12T19:00",
"endDate": "2023-05-12T21:00",
"location": {
"@type": "Place",
"name": "Место проведения",
"address": {
"@type": "PostalAddress",
"streetAddress": "Адрес места проведения"
},
"geo": {
"@type": "GeoCoordinates",
"latitude": "широта",
"longitude": "долгота"
}
},
"description": "Описание события",
"image": "изображение.jpg",
"organizer": {
"@type": "Organization",
"name": "Название организатора",
"url": "ссылка на сайт организатора"
},
"performer": {
"@type": "PerformingGroup",
"name": "Название участника",
"url": "ссылка " }
}

 

Рецепты (Recipe)

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

Пример кода для микроразметки Рецепты.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Recipe">
<h1 itemprop="name">Название рецепта</h1>
<img itemprop="image" src="изображение.jpg" alt="Изображение блюда">
<div itemprop="description">Описание рецепта</div>
<div itemprop="recipeIngredient">Список ингредиентов</div>
<div itemprop="recipeInstructions">Шаги приготовления</div>
<div itemprop="nutrition" itemscope itemtype="http://schema.org/NutritionInformation">
<span itemprop="calories">Количество калорий</span>
<span itemprop="fatContent">Количество жиров</span>
<span itemprop="carbohydrateContent">Количество углеводов</span>
<span itemprop="proteinContent">Количество белков</span>
</div>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Recipe",
"name": "Название рецепта",
"image": "изображение.jpg",
"description": "Описание рецепта",
"recipeIngredient": [
"Ингредиент 1",
"Ингредиент 2",
"Ингредиент 3"
],
"recipeInstructions": [
{
"@type": "HowToStep",
"text": "Шаг 1"
},
{
"@type": "HowToStep",
"text": "Шаг 2"
},
{
"@type": "HowToStep",
"text": "Шаг 3"
}
],
"nutrition": {
"@type": "NutritionInformation",
"calories": "Количество калорий",
"fatContent": "Количество жиров",
"carbohydrateContent": "Количество углеводов",
"proteinContent": "Количество белков"
}
}
</script>

 

Статьи (Article)

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

Пример кода для микроразметки Статьи.

Словарь Microdata

<article itemscope itemtype="http://schema.org/Article">
<h1 itemprop="headline">Заголовок статьи</h1>
<img itemprop="image" src="изображение.jpg" alt="Изображение статьи">
<p itemprop="description">Краткое описание статьи</p>
<div itemprop="datePublished">Дата публикации статьи</div>
<div itemprop="author" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">Имя автора</span>
</div>
<div itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
<span itemprop="name">Название издательства</span>
</div>
</article>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Article",
"headline": "Заголовок статьи",
"image": "изображение.jpg",
"description": "Краткое описание статьи",
"datePublished": "Дата публикации статьи",
"author": {
"@type": "Person",
"name": "Имя автора"
},
"publisher": {
"@type": "Organization",
"name": "Название издательства"
}
}
</script>

 

Видео (Video)

Микроразметка «Видео» позволяет структурировать информацию об определенном видео, включая его заголовок, описание, длительность, качество, автора, дату публикации и т.д.

Примеры свойств, которые могут использоваться в микроразметке "Видео":

• name - название видео;
• description - описание видео;
• duration - продолжительность видео;
• thumbnailUrl - ссылка на изображение обложки видео;
• uploadDate - дата публикации видео;
• publisher - издатель видео;
• author - автор видео;
• embedUrl - ссылка на встраивание видео;
• contentUrl - ссылка на файл видео.

Пример кода для микроразметки Видео.

Словарь Microdata

<div itemscope itemtype="http://schema.org/VideoObject">
<h1 itemprop="name">Название видео</h1>
<div itemprop="description">Описание видео</div>
<meta itemprop="duration" content="PT2M30S">
<img itemprop="thumbnailUrl" src="изображение.jpg" alt="Изображение обложки видео">
<meta itemprop="uploadDate" content="2023-04-11T10:00:00+03:00">
<div itemprop="publisher" itemscope itemtype="http://schema.org/Organization">
<span itemprop="name">Название издательства</span>
</div>
<div itemprop="author" itemscope itemtype="http://schema.org/Person">
<span itemprop="name">Имя автора</span>
</div>
<meta itemprop="embedUrl" content="ссылка на встраивание видео">
<meta itemprop="contentUrl" content="ссылка на файл видео">
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "VideoObject",
"name": "Название видео",
"description": "Описание видео",
"duration": "PT2M30S",
"thumbnailUrl": "изображение.jpg",
"uploadDate": "2023-04-11T10:00:00+03:00",
"publisher": {
"@type": "Organization",
"name": "Название издательства"
},
"author": {
"@type": "Person",
"name": "Имя автора"
},
"embedUrl": "ссылка на встраивание видео",
"contentUrl": "ссылка на файл видео"
}
</script>

 

Карты (Maps)

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

Пример кода для микроразметки Карты.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Place">
<h1 itemprop="name">Название местоположения</h1>
<div itemprop="description">Описание местоположения</div>
<meta itemprop="latitude" content="51.5074">
<meta itemprop="longitude" content="-0.1278">
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">Адрес местоположения</span>
</div>
<div itemprop="telephone">+375 (XX) XXX-XX-XX</div>
<a itemprop="url" href="ссылка на страницу с информацией о местоположении">Ссылка на страницу с информацией о местоположении</a>
<img itemprop="image" src="изображение.jpg" alt="Изображение местоположения">
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Place",
"name": "Название местоположения",
"description": "Описание местоположения",
"geo": {
"@type": "GeoCoordinates",
"latitude": 51.5074,
"longitude": -0.1278
},
"address": {
"@type": "PostalAddress",
"streetAddress": "Адрес местоположения"
},
"telephone": "+375 (XX) XXX-XX-XX",
"url": "ссылка на страницу с информацией о местоположении",
"image": "изображение.jpg"
}
</script>

 

Персона (Person)

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

Пример кода для микроразметки Персона.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Person">
<h1 itemprop="name">Имя Фамилия</h1>
<div itemprop="jobTitle">Должность</div>
<img itemprop="image" src="фотография.jpg" alt="Фотография">
<a itemprop="url" href="ссылка на страницу с информацией о человеке">Ссылка на страницу с информацией о человеке</a>
<div itemprop="telephone">+375 (XX) XXX-XX-XX</div>
<div itemprop="email">example@example.com</div>
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">Адрес</span>
</div>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Person",
"name": "Имя Фамилия",
"jobTitle": "Должность",
"image": "фотография.jpg",
"url": "ссылка на страницу с информацией о человеке",
"telephone": "+375 (XX) XXX-XX-XX",
"email": "example@example.com",
"address": {
"@type": "PostalAddress",
"streetAddress": "Адрес"
}
}
</script>

 

Картинки (Image)

Пример кода для микроразметки Персона.

Словарь Microdata

<div itemscope itemtype="http://schema.org/ImageObject">
<img itemprop="contentUrl" src="изображение.jpg" alt="Описание изображения">
<meta itemprop="name" content="Название изображения">
<meta itemprop="description" content="Описание изображения">
<meta itemprop="height" content="Высота изображения в пикселях">
<meta itemprop="width" content="Ширина изображения в пикселях">
<meta itemprop="author" content="Автор изображения">
<meta itemprop="datePublished" content="Дата создания изображения">
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "ImageObject",
"contentUrl": "изображение.jpg",
"name": "Название изображения",
"description": "Описание изображения",
"height": "Высота изображения в пикселях",
"width": "Ширина изображения в пикселях",
"author": "Автор изображения",
"datePublished": "Дата создания изображения"
}
</script>

 

Вопросы и ответы (FAQ)

Пример кода для микроразметки Вопросы и ответы.

Словарь Microdata

<div itemscope itemtype="http://schema.org/FAQPage">
<div itemprop="mainEntity" itemscope itemtype="http://schema.org/Question">
<h2 itemprop="name">Название вопроса</h2>
<div itemprop="acceptedAnswer" itemscope itemtype="http://schema.org/Answer">
<p itemprop="text">Текст ответа на вопрос</p>
</div>
</div>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "FAQPage",
"mainEntity": {
"@type": "Question",
"name": "Название вопроса",
"acceptedAnswer": {
"@type": "Answer",
"text": "Текст ответа на вопрос"
}
}
}
</script>

 

Место (Place)

Микроразметка «Место» (Place) позволяет описать информацию о местах, таких как компании, музеи, рестораны, парки и т.д. Примеры свойств, которые могут использоваться в микроразметке:

• name — название;
• address — адрес;
• telephone — номер телефона;
• geo — координаты места (широта и долгота);
• image — изображение;
• openingHours — часы работы.

Пример кода для микроразметки Место.

Словарь Microdata

<div itemscope itemtype="http://schema.org/Place">
<h1 itemprop="name">Название места</h1>
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">Адрес места</span>
</div>
<span itemprop="telephone">Номер телефона места</span>
<div itemprop="geo" itemscope itemtype="http://schema.org/GeoCoordinates">
<meta itemprop="latitude" content="Широта места">
<meta itemprop="longitude" content="Долгота места">
</div>
<img itemprop="image" src="Ссылка на изображение места">
<span itemprop="openingHours">Часы работы места</span>
</div>

Словарь JSON-LD

<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Place",
"name": "Название места",
"address": {
"@type": "PostalAddress",
"streetAddress": "Адрес места"
},
"telephone": "Номер телефона места",
"geo": {
"@type": "GeoCoordinates",
"latitude": "Широта места",
"longitude": "Долгота места"
},
"image": "Ссылка на изображение места",
"openingHours": "Часы работы места"
}
</script>

Словарь Open Graph Protocol

Open Graph Protocol (OGP) создан для того, чтобы предоставить возможность создавать более эффективные презентации ссылок, которые можно размещать на различных платформах.

Пример использования тегов Open Graph Protocol для страницы с информацией о статье:

<html prefix="og: http://ogp.me/ns#">
<head>
<meta property="og:title" content="Название статьи">
<meta property="og:description" content="Описание статьи">
<meta property="og:image" content="Ссылка на изображение статьи">
<meta property="og:url" content="Ссылка на страницу со статьей">
<meta property="og:type" content="article">
<meta property="og:site_name" content="Название сайта">
<meta property="og:locale" content="ru_RU">
<meta property="og:article:published_time" content="2018-01-01T00:00:00+00:00">
<title>Название статьи</title>
<meta name="description" content="Описание статьи">
</head>
<body>
<!-- Контент страницы -->
</body>
</html>

 

Словарь Twitter Cards

Пример использования тегов Twitter Cards для страницы с информацией о статье:

<html>
<head>
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Название статьи">
<meta name="twitter:description" content="Описание статьи">
<meta name="twitter:image" content="Ссылка на изображение статьи">
<meta name="twitter:url" content="Ссылка на страницу со статьей">
<meta name="twitter:site" content="@имя_владельца_сайта">
<meta name="twitter:creator" content="@имя_автора_контента">
<title>Название статьи</title>
<meta name="description" content="Описание статьи">
</head>
<body>
<!-- Контент страницы -->
</body>
</html>

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

Как проверить корректность добавления микроразметки на страницах сайта?

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

• validator.schema.org
• search.google.com/test/rich-results
• webmaster.yandex.ru/tools/microtest/

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

Как отправить страницу на переиндексацию?

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

Отправить страницы на переиндексацию можно в панели вебмастера Google и Яндекс.

 

Вам также будут полезны и интересны статьи:

• Аренда сайта или интернет-магазина, или как просто и быстро начать продавать через интернет
• KPI для интернет-магазина
• Как правильно формировать SEO-теги для страниц интернет-магазина?
• Яндекс.Вебмастер: руководство по подключению и применению
• Google Search Console: руководство по подключению и использованию
• Google Tag Manager – подробное руководство по настройке и использованию
• Как составить план продвижения для сайта интернет-магазина?
• Как настроить отслеживание целей и конверсий в Яндекс Метрике и Google Analytics
• Что такое семантическое ядро и как его составлять
• Почему в интернет-магазине нет продаж?
• Самостоятельный аудит сайта
• Разработка сайта — руководство для начинающих
• Сколько стоит сайт?
• SEO чек-лист для интернет-магазинов
• Веб-аналитика для коммерческого сайта
• Как выбрать и купить домен и хостинг?
• Все факторы ранжирования сайтов в Google и Яндекс в 2020 году
• Руководство по установке и настройке счетчика Яндекс Метрика 2021
• Как посмотреть посещаемость сайта?
• Google Analytics 4 — руководство по установке и настройке