Главная страница » Блог » Как правильно настроить разметку BreadcrumbList для улучшения навигации сайта?

Как правильно настроить разметку BreadcrumbList для улучшения навигации сайта?

Как правильно настроить разметку BreadcrumbList для улучшения навигации сайта?

BreadcrumbList помогает пользователям лучше ориентироваться на сайте и улучшает его ранжирование в поисковых системах. Для её настройки нужно использовать микроразметку Schema.org следующим образом:

  1. Вставьте HTML-разметку в теги <meta> или <link> внутри head раздела страницы.
  2. Укажите элементы хлебных крошек через атрибут itemprop=»itemListElement» и «position».

Пример кода:

html

<ol itemscope itemtype="http://schema.org/BreadcrumbList">

<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ItemListElement">

<a itemprop="item" itemscope itemtype="https://schema.org/Thing" href="/home">Главная</a>

<span itemprop="position">1</span>

</li>

<li itemprop="itemListElement" itemscope itemtype="http://schema.org/ItemListElement">

<a itemprop="item" itemscope itemtype="https://schema.org/Thing" href="/category">Категория</a>

<span itemprop="position">2</span>

</li>

<li class="active" itemprop="itemListElement" itemscope itemtype="http://schema.org/ItemListElement">

<span itemprop="item" itemscope itemtype="https://schema.org/Thing">Товар</span>

<span itemprop="position">3</span>

</li>

</ol>

Важный момент: убедитесь, что каждый элемент имеет уникальный URL и корректно указан порядок следования (атрибут position).
Чек-лист проверки:

  • Проверьте наличие всех необходимых элементов в списке.
  • Убедитесь, что указаны правильные позиции каждого элемента.
  • Протестируйте разметку в валидаторе Schema.org.
Внимание:
Условия: Внедрение системы — от 50 000 ₽/мес. Если бюджет подходит — посмотреть тарифы →
Прокрутить вверх