Хлебные крошки

Хлебные крошки (breadcrumbs, навигационная цепочка) - элемент навигации на сайте, представляющий собой путь от главной страницы до текущей. Обычно отображается в верхней части страницы и выглядит как последовательность ссылок, разделённых специальным символом (чаще всего знаком «>» или «/»).

В интернет-маркетинге, и, в частности, в SEO хлебные крошки рассматриваются как важный элемент, улучшающий пользовательский опыт, помогающий поисковым системам понимать структуру сайта и увеличивающий глубину просмотра.

Происхождение названия

Название отсылает к сказке «Гензель и Гретель», где дети бросали хлебные крошки, чтобы отметить путь и не заблудиться в лесу. На сайте хлебные крошки выполняют ту же функцию - помогают пользователю не заблудиться и показывают, где он находится относительно структуры сайта.

Зачем нужны хлебные крошки

Для пользователей

Показывают текущее местоположение на сайте
Позволяют быстро вернуться на уровень выше
Помогают понять структуру и логику сайта
Снижают количество лишних кликов (не нужно нажимать «назад» много раз)
Улучшают общее впечатление от сайта

Для SEO

Поисковые системы (Яндекс, Google) учитывают хлебные крошки при анализе структуры сайта
Внутренние ссылки в крошках помогают распределять вес между страницами
В результатах поиска могут отображаться расширенные сниппеты с хлебными крошками, что увеличивает CTR
Помогают поисковым роботам быстрее находить новые страницы
Уменьшают глубину вложенности в глазах поисковиков

Для бизнеса

Увеличивают глубину просмотра (пользователь переходит на другие разделы)
Снижают показатель отказов
Повышают удобство интернет-магазинов (легко вернуться в каталог)

Типы хлебных крошек

Иерархические (location-based)

Самый распространённый тип. Показывают место страницы в структуре сайта:

Главная > Каталог > Обувь > Кроссовки

Подходит для интернет-магазинов, корпоративных сайтов, порталов с чёткой иерархией.

Атрибутивные (attribute-based)

Показывают не только путь по структуре, но и выбранные пользователем фильтры и атрибуты. Часто используются в каталогах со множеством фильтров:

Главная > Обувь > Мужская > Кроссовки > Nike

Исторические (path-based)

Показывают полный путь пользователя по сайту, включая страницы, не связанные с иерархией. Используются редко, так как могут сбивать пользователя.

Где размещать хлебные крошки

Обычно в верхней части страницы, сразу под основным меню
Перед заголовком H1
На всех страницах, кроме главной
Должны быть заметны, но не перетягивать внимание

Как оформлять хлебные крошки

Разделители

Чаще всего используются символы: >, /, →, |. Главное - единообразие на всём сайте.

Текст

Последний элемент (текущая страница) обычно не является ссылкой
Названия должны быть короткими и понятными
Первый элемент всегда ссылка на главную

Микроразметка

Для SEO рекомендуется использовать микроразметку Schema.org типа BreadcrumbList. Это помогает поисковым системам лучше понимать навигацию и отображать расширенные сниппеты.

Пример разметки хлебных крошек (JSON-LD)

{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Главная",
      "item": "https://site.ru"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Каталог",
      "item": "https://site.ru/katalog"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "Обувь",
      "item": "https://site.ru/katalog/obuv"
    },
    {
      "@type": "ListItem",
      "position": 4,
      "name": "Кроссовки Nike",
      "item": "https://site.ru/katalog/obuv/krossovki-nike"
    }
  ]
}

Примеры для разных сайтов

Интернет-магазин

Главная > Электроника > Смартфоны > Apple > iPhone 16

Блог

Главная > Блог > SEO > Как составить семантическое ядро

Корпоративный сайт

Главная > Услуги > Продвижение сайтов > SEO-аудит