Рано или поздно каждый начинающий вебмастер начинает задумываться, как бы еще оптимизировать сайт со стороны SEO. Одним из таких способов является внедрение семантической разметки для улучшения видимости сайта в результатах поиска. В этот раз мы написали не большую статью на тему как внедрить микроразметку для меню сайта с помощью SiteNavigationElement. Данная сущность указывает поисковому роботу, что это меню используемое для навигации на сайте, тем самым поисковая система может вывести его в сниппете результата выдачи сайта в ПС.
И так, приступим. Стандартно код горизонтального меню на сайте выглядит следующим образом:
<nav>
<ul>
<li><a href="/item-1/">Item-1</a></li>
<li><a href="/item-1/">Item-2</a></li>
<li><a href="/item-1/">Item-3</a></li>
<li><a href="/item-1/">Item-4</a></li>
</ul>
</nav>
Давайте к нему применим разметку Schema.org. В итоге вот, что получится:
<nav itemscope itemtype="http://schema.org/SiteNavigationElement">
<meta itemprop="name" content="Навигационное Меню">
<ul>
<li>
<a itemprop="url" href="/item-1/">
<span itemprop="name">Item-1</span>
</a>
</li>
<li>
<a itemprop="url" href="/item-2/">
<span itemprop="name">Item-2</span>
</a>
</li>
<li>
<a itemprop="url" href="/item-3/">
<span itemprop="name">Item-3</span>
</a>
</li>
<li>
<a itemprop="url" href="/item-4/">
<span itemprop="name">Item-4</span>
</a>
</li>
</ul>
</nav>
Теперь проверим валидность данного кода с разметкой Schema.org в webmaster.yandex.ru, раздел «Инструменты — Валидатор» или в search.google.com во вкладке «Проверка структурированных данных».

Валидатор Яндекс Вебмастера показал все без ошибок.

Валидатор Google Search Console также написал, что нет ошибок и предупреждений.
Чуть позже напишу как внедрить разметку «SiteNavigationElement» в меню на сайте с CMS WordPress.
Код меню с микроразметкой получился раздутым, нужна ли она на сайте, решать вам))









Словарь schema.org огромнейший, поэтому с помощью JSON-LD также можно разметить отдельные элементы сайта: меню, хлебные крошки и многое другое. Полный список всех типов «@type» для разметки на официальном сайте.
С JSON-LD не все так просто у Яндекса. Данные размеченные с помощью JSON-LD отображаются только в сервисе Яндекс.Почта, в поисковой выдаче они не буду видны. Google отлично понимает разметку в синтаксисе JSON-LD и выводит ее в результатах поиска.
Микроразметка schema.org внедряется в тело HTML страницы при помощи специальных атрибутов: itemscope, itemtype, itemprop и др.