Статья
Хлебные крошки на сайте: что это и зачем они нужны
«Хлебные крошки» — строка навигации вида «Главная → Услуги → Ремонт ванной», которая показывает, где на сайте находится человек. Название — из сказки, где дети отмечали дорогу крошками, чтобы вернуться домой. Разбираем, кому они нужны, как их оформить и что они дают в поиске.
Зачем они нужны
- Показывают, где человек. Пришёл из поиска сразу на карточку товара — и видит, в каком разделе находится.
- Позволяют подняться на уровень выше одним нажатием: от товара — к категории, от статьи — к блогу.
- Помогают поиску. Поисковики лучше понимают структуру сайта и могут показать путь к странице прямо в выдаче вместо длинного адреса.
Какие бывают
| Вид | Пример | Где уместен |
|---|---|---|
| По расположению | Главная → Каталог → Диваны → Угловые | Почти везде: показывает место страницы в структуре |
| По признакам | Диваны → Угловые → Серые → До 50 000 ₽ | Каталоги с фильтрами |
| По пути посетителя | Страницы, которые человек открывал до этого | Редко: путает, лучше не использовать |
Кому нужны
- интернет-магазинам и каталогам — обязательно: уровней много, люди приходят из поиска сразу вглубь;
- сайтам компаний с разделами услуг, статьями и кейсами — желательно;
- лендингу на одну страницу — не нужны: уровней нет.
Как оформить
- Над заголовком страницы, мелким шрифтом — крошки не должны спорить с заголовком.
- Каждый уровень — ссылка, кроме текущей страницы: на неё ссылаться бессмысленно.
- Понятный разделитель — стрелка или «›».
- Короткие названия уровней — как в меню, а не полные заголовки страниц.
- На телефоне длинную цепочку сокращают до ссылки на уровень выше: «← Диваны».
Хлебные крошки в поиске
Чтобы поисковики точно поняли цепочку, её дублируют в микроразметке — специальном блоке в коде страницы по словарю schema.org. Тогда Яндекс и Google могут показать в выдаче путь «сайт › Услуги › Ремонт ванной» вместо адреса страницы — это понятнее и привлекательнее для клика. О микроразметке подробно — в статье «Микроразметка schema.org».
Частые ошибки
- Крошки не совпадают с меню — в меню раздел называется «Услуги», в крошках «Наши работы».
- Последний пункт — ссылка на саму страницу.
- Крошки только для поисковиков — в разметке есть, на странице нет, или наоборот.
- Огромные крошки во всю ширину крупным шрифтом, которые отнимают первый экран на телефоне.
Как устроено у нас
На внутренних страницах нашего сайта — услугах, работах, статьях и странице о студии — путь к странице описан в микроразметке. Например, у статьи это «Главная → Блог → название статьи». Поисковики получают структуру сайта в точном виде и могут показать её в выдаче.
Как мы делаем это для клиентов
Сайт компании мы начинаем с карты разделов: какие страницы нужны и как клиент переходит между ними. Из неё складываются меню, навигация и путь до заявки.