Семантическая разметка
Материалы подготовленные:
Yandex, ЧаВо от Google, Русский любительский перевод Schema.org
Семантическая разметка или микроразметка - это разметка страницы с помощью тегов и атрибутов в тегах, которые указывают поисковым роботам на информацию/контент, что указан на странице.
Schema.org — это стандарт семантической разметки данных в сети, объявленный поисковыми системами Google, Bing и Yahoo! летом 2011 года.
Микроданные (HTML microdata) — это международный стандарт семантической разметки HTML-страниц, с помощью атрибутов, описывающих смысл информации, содержащейся в тех или иных HTML-элементах. Такие атрибуты делают контент страниц машиночитаемым, то есть позволяют в автоматическом режиме находить и извлекать нужные данные.
Цель семантической разметки — сделать интернет более понятным, структурированным и облегчить поисковым системам и специальным программам извлечение и обработку информации для удобного её представления в результатах поиска.
Яндекс с осени 2011 года понимает этот формат и поддерживает его в некоторых партнерских программах.
Разметка происходит непосредственно в HTML-коде страниц с помощью специальных атрибутов и не требует создания отдельных экспортных файлов.
Основные принципы разметки
- Оборачивание описания определенного типа в контейнер с указанием схемы разметки:
<div itemscope itemtype="http://schema.org/Organization" >
...
</div> - Разметка отдельных свойств с указанием на конкретное свойство схемы:
<span itemprop="streetAddress">Льва Толстого, 16</span> Пример документа до разметки schema.org:
<div>
<span>Яндекс</span>
Контакты:
<div>
Адрес: Льва Толстого, 16,
119021,
Москва,
</div>
Телефон: +7 495 739—70—00,
Факс: +7 495 739—70—70,
Электронная почта: [email protected]
</div>Документ после разметки:
<div itemscope itemtype="http://schema.org/Organization">
<span itemprop="name">Яндекс</span>
Контакты:
<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
Адрес:
<span itemprop="streetAddress">Льва Толстого, 16</span>
<span itemprop="postalCode"> 119021</span>
<span itemprop="addressLocality">Москва</span>,
</div>
Телефон:<span itemprop="telephone">+7 495 739—70—00</span>,
Факс:<span itemprop="faxNumber">+7 495 739—70—70</span>,
Электронная почта: <span itemprop="email">[email protected]</span>
</div>Пример семантической разметки “Адреса и организации”.
Хлебные крошки:
Исходный вариант
После применения формата микроразметки:<a href="http://www.example.com/platya">Платья</a> "
<a href="http://www.example.com/platya/gotovie">Готовые платья</a> "
<a href="http://www.example.com/platya/gotovie/zelenie">Готовые зеленые платья</a>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="http://www.example.com/dresses" itemprop="url">
<span itemprop="title">Платья</span>
</a> "
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="http://www.example.com/dresses/real" itemprop="url">
<span itemprop="title">Готовые платья</span>
</a> "
</div>
<div itemscope itemtype="http://data-vocabulary.org/Breadcrumb">
<a href="http://www.example.com/clothes/dresses/real/green" itemprop="url">
<span itemprop="title">Готовые зеленые платья</span>
</a>
</div>
Пример семантической разметки “Хлебных крошек”
Инструменты для проверки правильности оформления семантической разметки:
- Инструмент проверки структурированных данных от Google
- Инструмент проверки семантической разметки Яндекс
Используемые типы разметки Яндексом:
- Разметка информации о программах (приложениях, компьютерных программах, играх и т. д.) помогает Поиску формировать специальные сниппеты для страниц с такой разметкой.
- Разметка рецептов помогает Поиску формировать специальные сниппеты для страниц с такой разметкой.
- Разметка описаний фильмов помогает Поиску формировать специальные сниппеты для страниц с такой разметкой.
- Разметка музыкальных аккордов помогает Поиску формировать сниппеты с аккордами для страниц с такой разметкой.
- Разметка творческих работ помогает Поиску формировать специальные сниппеты для страниц с такой разметкой.
- Разметка вопросов и ответов помогает Поиску выделять лучший ответ и формировать специальные сниппеты для страниц с такой разметкой.
- Разметка рефератов и других подобных работ помогает Поиску формировать специальные сниппеты для страниц с такой разметкой.
- Разметка словарных статей помогает Яндекс.Словарям и Поиску формировать специальные сниппеты для страниц с такой разметкой.
- Разметка данных об организации и ее адресе помогает Справочнику и Поиску формировать специальные сниппеты для страниц с такой разметкой.
- Разметка информации об изображениях помогает улучшить представление изображений на сервисе Яндекс.Картинки.
- Разметка информации о видеороликах помогает улучшить представление видеоматериалов на сервисе Яндекс.Видео.
- Разметка отзывов об организациях позволяет отображать на сервисе Карты отзывы вместе с адресами организаций.
- Разметка отзывов об автомобилях и тест-драйвах помогает улучшить представление моделей на сервисе Яндекс.Авто и в поисковой выдаче.
Google Маркер
Google маркер – инструмент, который позволяет передать поисковым роботам Google структурированные данные с вашего сайта.
Сегодня инструмент поддерживает следующие типы данных:
Инструмент простой и удобный. Благодаря маркеру от Google не нужно вносить дополнительные атрибуты Schema.org в код. Понадобится лишь заиметь права администратора сайта в инструментах для вебмастера: просто выделите нужные элементы страницы и присвойте им соответствующие свойства.
https://support.google.com/webmasters/answer/2692911?hl=ru
Для изучения: