Хлебные крошки
Хлебные крошки (англ. breadcrumbs) — один из видов навигации, показывающий цепочку ссылок начиная с главной страницы сайта до текущей веб-страницы, на которой находится пользователь.
В большинстве случаев, хлебные крошки отображены вверху страницы сайта и выглядит примерно так:
Главная страница — Словарь терминов — Хлебные крошки
Зачем нужны хлебные крошки на сайте
Основная задача Breadcrumbs — улучшить пользовательский опыт (UX).
Breadcrumbs выполняют такие функции:
- Хорошо влияют на SEO — организовывают внутреннюю перелинковку, перераспределяют статический вес веб-страниц и улучшают сниппет в выдаче.
- Улучшают поведенческие факторы (поведение пользователей, показатели отказов и другое) — помогают пользователям ориентироваться и дольше оставаться на сайте.
- Увеличивают трафик — при использовании микроразметки, приносят больше трафика на сайт с ссылок сниппета в выдаче.
Микроразметка хлебных крошек
Путь к странице будет отображаться в поисковой выдаче при наличии микроразметки Schema.org в формате Microdata.
<ul itemscope itemtype="https://schema.org/BreadcrumbList">
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a href="/" title="Главная страница" itemprop="item">
<span itemprop="name">Главная страница</span>
<meta itemprop="position" content="0">
</a>
</li>
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a href="/glossary/" title="Словарь терминов" itemprop="item">
<span itemprop="name">Словарь терминов</span>
<meta itemprop="position" content="1">
</a>
</li>
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a href="/glossary/marketing/" title="Маркетинг" itemprop="item">
<span itemprop="name">Маркетинг</span>
<meta itemprop="position" content="2">
</a>
</li>
</ul>
Расшифровка обязательных атрибутов Breadcrumbs для Schema.org:
- itemscope и itemtype указывает на объект на странице — BreadcrumbList (список навигационной цепочки).
- itemprop=“itemListElement“ — item обозначен, как самостоятельный пункт списка.
- itemprop=“item“ — указывает на URL.
- itemprop=“name“ — имя навигационной цепочки.
- meta itemprop=“position“ content=“%number%“ — тег невидимка, указывает на расположения элемента в навигационной цепочке.
Микроразметку на сайте, можно проверить с помощью инструмента валидации кода от Google ().