Строка навигации

В строке навигации показано положение страницы в иерархии сайта (путь к ней с главной страницы ресурса).

Примеры

Google Поиск использует разметку строки навигации в теле веб-страницы, чтобы отнести информацию с этой страницы в определенную категорию результатов поиска. Часто пользователи попадают на одну и ту же страницу, хотя делают разные поисковые запросы. В таких случаях строка навигации определяет категорию контента применительно к поисковому запросу. Например, на странице ancillaryjustice.html в зависимости от контекста могут появляться следующие строки навигации:

Вариант строки навигации для поискового запроса с названием книги "Слуги правосудия":

Книги › Авторы › Энн Леки › Слуги правосудия

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

<script type="application/ld+json"> { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [{ "@type": "ListItem", "position": 1, "name": "Books", "item": "https://example.com/books" },{ "@type": "ListItem", "position": 2, "name": "Authors", "item": "https://example.com/books/authors" },{ "@type": "ListItem", "position": 3, "name": "Ann Leckie", "item": "https://example.com/books/authors/annleckie" },{ "@type": "ListItem", "position": 4, "name": "Ancillary Justice", "item": "https://example.com/books/authors/ancillaryjustice" }] } </script>

Вариант строки навигации для поискового запроса "Премия "Небьюла" 2014 за лучший роман":

Книги › Научная фантастика › Слуги правосудия

RDFa

Нажмите кнопку ниже, чтобы посмотреть пример кода RDFa для этой строки навигации в инструменте проверки структурированных данных.

<ol vocab="https://schema.org/" typeof="BreadcrumbList"> <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books"> <span property="name">Books</span></a> <meta property="position" content="1"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books/sciencefiction"> <span property="name">Science Fiction</span></a> <meta property="position" content="2"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books/sciencefiction/awardwinnders"> <span property="name">Award Winners</span></a> <meta property="position" content="3"> </li> </ol>

Микроданные

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

<ol itemscope itemtype="https://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/books"> <span itemprop="name">Books</span></a> <meta itemprop="position" content="1" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/books/sciencefiction"> <span itemprop="name">Science Fiction</span></a> <meta itemprop="position" content="2" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/books/sciencefiction/ancillaryjustice"> <span itemprop="name">Ancillary Justice</span></a> <meta itemprop="position" content="3" /> </li> </ol>

Вот пример сразу с несколькими строками навигации:

Книги › Научная фантастика › Лауреаты премий
Литература › Фантастика

RDFa

Нажмите кнопку ниже, чтобы посмотреть пример кода RDFa для этой строки навигации.

<ol vocab="https://schema.org/" typeof="BreadcrumbList"> <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books"> <span property="name">Books</span></a> <meta property="position" content="1"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books/sciencefiction"> <span property="name">Science Fiction</span></a> <meta property="position" content="2"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/books/sciencefiction/awardwinners"> <span property="name">Award Winners</span></a> <meta property="position" content="3"> </li> </ol> <ol vocab="https://schema.org/" typeof="BreadcrumbList"> <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/literature"> <span property="name">Literature</span></a> <meta property="position" content="1"> </li> › <li property="itemListElement" typeof="ListItem"> <a property="item" typeof="WebPage" href="https://example.com/literature/speculativefiction"> <span property="name">Speculative Fiction</span></a> <meta property="position" content="2"> </li> </ol>

Микроданные

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

<ol itemscope itemtype="https://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/books"> <span itemprop="name">Books</span></a> <meta itemprop="position" content="1" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/books/sciencefiction"> <span itemprop="name">Science Fiction</span></a> <meta itemprop="position" content="2" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/books/sciencefiction/awardwinners"> <span itemprop="name">Award Winners</span></a> <meta itemprop="position" content="3" /> </li> </ol> <ol itemscope itemtype="https://schema.org/BreadcrumbList"> <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/literature"> <span itemprop="name">Literature</span></a> <meta itemprop="position" content="1" /> </li> › <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem"> <a itemtype="https://schema.org/Thing" itemprop="item" href="https://example.com/literature/speculativefiction"> <span itemprop="name">Speculative Fiction</span></a> <meta itemprop="position" content="2" /> </li> </ol>

Пример для HTML

Используйте в дизайне страницы HTML-блок для строки навигации. В случае с примером из раздела Правила он будет выглядеть так:

<ol>
  <li>
    <a href="http://www.example.com/books">Books</a>
  </li>
  <li>
    <a href="http://www.example.com/sciencefiction">Science Fiction</a>
  </li>
  <li>
    <a href="http://www.example.com/books/sciencefiction/awardwinners">Award Winners</a>
  </li>
<ol>

Правила

Разметка должна соответствовать общим правилам в отношении структурированных данных и содержать как минимум одну строку навигации (не для целевой страницы), если страницу можно найти в более широком перечне результатов. Так как по запросу научно-фантастические романы лауреаты премий будет найдено много других страниц помимо ancillaryjustice.html, рекомендуем добавить строку навигации для более широкой категории поиска:

Книги › Научная фантастика › Лауреаты премий

Определения типов структурированных данных

Google Поиск распознает свойства BreadcrumbList, перечисленные ниже. Чтобы контент появлялся в расширенных результатах, необходимо задать все обязательные свойства.

Обязательные свойства
item	Thing URL веб-страницы, указанной в строке навигации.
name	Text Название строки навигации, которое видит пользователь.
position	Integer Позиция страницы в иерархии сайта. К примеру, позиция 1 указывает на то, что страница находится в начале цепочки.