1. Навіщо потрібні хлібні крихти на сайті?
2. Найпоширеніші види крихт
3. Динамічні хлібні крихти
4. Хлібні крихти на основі історії відвідування
5. Хлібні крихти зі списком
6. Яким сайтам потрібні хлібні крихти?
7. На що впливають хлібні крихти?
8. Позиція пошукових систем
9. Чому хлібні крихти такі важливі для просування сайту
10. Чи потрібно робити хлібні крихти на мобільній версії?
11. Якісна внутрішня перелінковка
12. Як зробити правильні хлібні крихти?
13. Мікророзмітка для хлібних крихт у сніпеті
14. Чому ж Rich Snippets такий актуальний при видачі?
15. Як додати хлібні крихти в WordPress?

Система хлібних крихт (англ. bread-crumbs) — це різновид альтернативної навігації. Вона вказує місце розташування користувача на ресурсі взагалі або в окремому розділі сайту.

У переважному випадку крихти є невеликим меню, яке розташоване у верхній частині сторінки, і використовуються для зручності навігації. Вони позначають послідовність переміщення від поточної точки перебування користувача до домашньої сторінки або початку розділу.

Назва взята з німецької історії про Гензель та Гретель, в якій обидві дитини розкидають крихти на шляху, щоб знайти дорогу додому. Як і в історії, хлібні крихти на ресурсах допомагають відвідувачам простежити шлях до початкової точки входу.

Навіщо потрібні хлібні крихти на сайті?

На ресурсах, які мають безліч сторінок, категорій та розділів, навігація із застосуванням хлібних крихт у рази підвищує зручність орієнтування для користувачів.

Якщо ж говорити про UX, то хлібні крихти скорочують кількість кліків, які потрібно буде виконати відвідувачеві ресурсу, щоб перейти в іншу частину сайту. Тобто вони покращують доступність розділів і категорій, і, відповідно, збільшують швидкість переміщення ними. Це дає позитивний користувацький досвід, а отже, зростає ймовірність повернення відвідувача на ресурс.

Такі меню також є ефективним візуальним рішенням, яке вказує точну дислокацію користувачів в ієрархії ресурсу, що робить їх релевантним джерелом контекстної інформації для таргет-сторінок. Тобто людина одразу розуміє, де вона перебуває і в який розділ може перейти.

Зазвичай можна знайти крихти на ресурсах, які мають велику кількість контенту, організованого в ієрархічному порядку. Ви також бачите їх на сайтах, які мають більше одного кроку, де вони функціонують подібно до індикатора виконання.

У своїй найпростішій формі хлібні крихти являють собою горизонтально розташовані текстові посилання, розділені символом «більше ніж» (>). Символ вказує рівень цієї сторінки відносно посилань на сторінку поруч із ним.

Найпоширеніші види крихт

Хлібні крихти на основі ієрархії

Є ієрархічне (або засноване на місцезнаходження) меню. Це типові хлібні крихти, які ви можете знайти у блогах або на сайтах із простою ієрархічною структурою.

Ось приклад із Amazon:

Динамічні хлібні крихти

Цей різновид крихт заснований на атрибутах. Такі хлібні крихти використовуються у випадку, коли продукт має багато параметрів, і слід хлібних крихт відбиває це, щоб спростити навігацію.

Ось приклад сайту електронної комерції:

Зверніть увагу, що крихти хліба допомагають користувачам вибирати різні атрибути продукту, не залишаючи поточної сторінки.

Хлібні крихти на основі історії відвідування

Шлях до хлібної крихти будується на основі сторінок, які відвідав користувач. Це не надто хороша практика SEO веб-дизайну, і вона використовується не дуже часто.

Хлібні крихти зі списком

У цьому разі йдеться про додаткове вкладене підменю. Це дуже зручно для користувача, оскільки під час натискання він може перейти в пов'язані категорії.

Яким сайтам потрібні хлібні крихти?

Насамперед хлібні крихти потрібні ресурсам із великою кількістю розділів. Типовим прикладом є сайти електронної комерції, у яких велика різноманітність продуктів згрупована у логічні категорії. З іншого боку, що більше на сайті навігаційних елементів, то краще реагують користувачі.

Навіть якщо ваш проєкт складається з десяти сторінок у трьох розділах, все одно краще додати крихти, щоб поліпшити сприйняття відвідувачів і реакцію пошукових систем.

Чудовий спосіб визначити, чи виграє веб-сайт від навігації по хлібних крихтах, — створити карту сайту або діаграму, що представляє архітектуру навігації, а потім проаналізувати, чи поліпшать хлібні крихти здатність користувача переміщатися всередині та між категоріями.

На що впливають хлібні крихти?

Існує три основні групи факторів, на які впливають хлібні крихти:

• Час перебування відвідувачів на сайті.

• Відсоток відвідувачів, які повернулися.

• Підвищення рейтингу видачі.

Поліпшення показників за будь-якою з них сприяє зростанню ресурсу, а отже, призводить і до підвищення ваших продажів або впізнаваності бренду.

Позиція пошукових систем

Google та інші пошукові системи наголошують на важливості хлібних крихт у всіх своїх документах і посібниках з SEO.

Причина проста: траси breadcrumb складаються зі слів, причому найчастіше з ключових, і їм є що запропонувати як роботам пошукових систем, так і користувачам. Пошуковики використовують їх, щоб краще зрозуміти, як влаштований ваш ресурс, що значно збільшує частоту візитів робота і оновлення позицій у видачі.

Як кажуть на Хабрі: погодуйте своїми хлібними крихтами гуглі-гуглі і вони повертатимуться до вас знову і знову.

Чому хлібні крихти такі важливі для просування сайту

Крихти є важливим елементом дружнього до SEO сайту з кількох причин:

• Вони полегшують навігацію — це основна роль хлібних крихт, і тому користувачі люблять їх.

• Вони заохочують людей відвідувати більше сторінок веб-сайту, перш ніж вони виходять, і таким чином вони знижують показники відмов.

• Вони хороші для використання додаткових ключових слів у SEO.

Є дві головні причини, через які хлібні крихти хороші для оптимізації та підвищення рейтингу видачі.

По-перше, вони допомагають пошуковим роботам на етапі сканування та індексації. Роботи-сканери можуть ідентифікувати хлібні крихти та використовують структуру їх розмітки для збору додаткової інформації про веб-сторінку та ресурс.

По-друге, Google не тільки показує постійне посилання на сторінку, але й відображає інформацію про крихти пошукової видачі.

Наприклад, постійне посилання на сторінку нижче: https://www.ukraine.com.ua/, але оскільки там є оптимізовані для SEO крихти, вони показують підрозділи навігації в результатах, що дає користувачам можливість заздалегідь дізнатися, куди вони потраплять.

Чи потрібно робити хлібні крихти на мобільній версії?

Якщо ви вирішили залишити хлібні крихти видимими на мобільних пристроях, переконайтеся, що розмір шрифту досить великий, щоб посилання можна легко натискати. Звичайною практикою є або приховувати крихти на мобільних телефонах, або робити схожими на кнопки.

Ось приклад мобільної крихти:

 

Якісна внутрішня перелінковка

Щоб оптимізувати ваші хлібні крихти, можна застосувати кілька рекомендацій.

Переконайтеся, що хлібні крихти увімкнені та помітні користувачам. Багато веб-дизайнерів схильні приховувати сліди крихт, тому що вважають, що списки в меню та підменю не відповідає дизайну.

Це не завжди так. Подивіться на перший приклад, наведений вище, і зверніть увагу на те, наскільки корисний ланцюжок хлібних крихт. При цьому категорії зрозумілі, а дизайн вдало реалізовано і він добре вписується в колірну гамму ресурсу.

Як зробити правильні хлібні крихти?

Для поліпшення видимості ви повинні прописати схему відображення крихт у своєму ресурсі. Причина, через яку хлібні крихти відображаються разом з URL-адресами в результатах пошуку Google, полягає в тому, що на вебсайті ввімкнено розмітку схеми хлібних крихт, і робот вносить її у видачу.

Що таке розмітка схеми? Це спосіб виділити певні області вашого веб-сайту пошуковим роботам, щоб вони могли краще зрозуміти, як влаштована сторінка.

Вводячи відповідні елементи коду на ваші HTML-сторінки (це називається структурованими даними), ви забезпечите пошуковикам більше актуальних відомостей про розділи та категорії вашого ресурсу.

Добре відформатовані крихти покращують показання, пов’язані з отриманням фрагментів меню пошукової видачі.

Ось як можна додати схему крихти на ваш сайт:

Для додавання хлібних крихт є відповідна схема. Вона має такі обов’язкові властивості:

• Елемент — URL сторінки для певного елемента.

• Назва — назва крихти.

• Положення — положення цього елемента в сліді крихти.

Ось як виглядає код для книгарні:

Крихітки: Книжки — Автор — Анна Ліки — Слуги Правосуддя:

Мікророзмітка для хлібних крихт у сніпеті

Rich Snippets (синонім «багаті результати») — це звичайні результати видачі Google з відображенням параметрів структурної розмітки. Ці додаткові дані зазвичай беруться з інформації, отриманої роботом з HTML-коду сторінки. Найпопулярніші різновиди Rich Snippet включають аналітику, рейтинги, рецепти, рекомендації та події.

Чому ж Rich Snippets такий актуальний при видачі?

Класичні результати видачі Google або інших пошукових систем відображають три категорії даних:

• Тег заголовка.

• Мета-опис.

• URL.

Це типовий «фрагмент». Rich Snippets можна отримати, якщо ви візьмете звичайний фрагмент і додасте до нього мікророзмітку. У цьому випадку використовується не тільки крихти в меню, а й розмітка рейтингу та кількості голосів.

Ось приклад «багатих результатів»:

Навіть за першого погляду, результати із зірочками і цифрами більш привабливі на вигляд, ніж звичайні результати пошуку — і це призводить до більш високого показника CTR (кількості кліків).

Як додати хлібні крихти в WordPress?

Найбільш популярний для цієї CMS плагін оптимізації Yoast. У ньому розробниками реалізована вбудована підтримка хлібних крихт. Після активації на вашому сайті хлібні крихти можна налаштувати, перейшовши в розділ SEARCH APPEARANCE > BREADCRUMBS.

Як ви можете бачити вище, можна налаштувати низку показників, пов'язаних із відображенням хлібних крихт.

Інформація про відповідну схему автоматично додається на всі ваші веб-сторінки. Для цього використовуються теми Genesis (WordPress) — теми, засновані на плагіні Genesis.

Коли ви замість WordPress використовуєте іншу CMS або застосовуєте іншу тему, найкраще спочатку перевірити, чи активована в принципі схема хлібних крихт на вашому ресурсі. Перейдіть до тестувального плагіна структурованих даних і введіть URL-адресу однієї зі сторінок, на яких увімкнено хлібні крихти.

Якщо із запитами на показ додаткової інформації все гаразд, ви побачите праворуч результати з 0 помилками та 0 попередженнями.

У разі тест показує правильність виведення інформації.

Якщо тест видав помилки, попередження або ви не бачите елемента списку хлібних крихт, це означає, що структуровані дані хлібних крихт введені невірно або не підтримуються вашою CMS. Найкращий спосіб це виправити — ввести необхідний код вручну на всі діючі сторінки HTML.

На закінчення можна сказати, що тенденція використовувати хлібні крихти міцно закріпилася практично на всіх типах ресурсів. Виняток становлять хіба що лендінги (посадочні сторінки), на яких актуальна інформація розміщується повністю.