Автор: Netpeak

Помните ли историята на Хензел и Гретел, в която находчивият брат оставя трохички хляб, които да му покажат пътя към вкъщи? Пренасяйки се в модерната реалност, изразът "хлебни трохички" придобива още един смисъл - този път свързан с навигацията на сайтове.

В тази статия ще отговорим на въпросите какво всъщност са хлебните трохички, как да ги добавим в сайта си и каква е тяхната роля в SEO.

Какво представляват хлебните трохички

Хлебните трохички (breadcrumbs) са един от елементите за навигация в сайта.

Тяхната роля е да правят сайта по-удобен, като позволяват на потребителите да достигнат до дадена страница само с един клик на мишката.

Трохичките са своеобразна верига на движение, която се състои от линкове. Обикновено започва от главната страница (home page), преминава през следващите посетени страници и завършва с текущата страница.

Хлебните трохички са необходими за сайтове с трето или по-голямо ниво на вложеност. Ако даден сайт се състои само от няколко страници, обикновено няма нужда от тяхната имплементация. Всичко обаче зависи от конкретните характеристики и цели на сайта.

Видове хлебни трохички

Хлебните трохички се делят на няколко основни вида спрямо начина, по който навигират потребителите:

1. Йерархично-базирани (hierarchy-based)

Това са най-често срещаните хлебни трохички. Те показват на потребителите къде се намират в сайта и категориите, през които са минали. Удобни са за ползване, защото представляват лесен достъп до желаните страници.

2. Базирани на атрибути (attribute-based)

Този вид трохички се използват в онлайн магазините при наличие на много продукти - например, магазини за техника. Те показват онези атрибути, на които потребителят е кликнал, преди да стигне до конкретната страница.

3. Трохички с падащо меню (drop-down breadcrumbs)

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

4. Базирани на историята (history-based)

Както името им предполага, тези трохички показват на потребителите път до предходните посетени страници. Срещат се рядко, тъй като бутонът "Back" изпълнява същата функция.

Характеристики

Когато създаваме хлебни трохички, трябва да помним, че ги правим за хора. Ключово правило тук е тяхното оформление да съответства на функцията им да ориентират и навигират потребителите.

1. Позициониране и стил

Навигационното поле с хлебни трохички изглежда най-добре, когато е разположено в най-горната част на страницата - това място привлича погледа и по този начин допринася за лесната ориентация на посетителите на сайта.

Важно е хлебните трохички да са съобразени със стила и дизайна на сайта, за да има добра координация между тях и другите елементи на страницата. Помнете - хлебните трохички трябва да подобряват цялостния външен вид на сайта, а не да изглеждат като отделен елемент, който не е на мястото си.

2. Хлебни трохички в мобилна версия

Значителна част от трафика на сайтовете идва от мобилни устройства, тъй като съвременните потребители използват предимно смартфона си, за да сърфират в интернет. Освен това, Google въведе mobile-first индексиране - по този начин към мобилната версия на даден сайт се добави особена важност, тъй като тя се индексира приоритетно от търсачката.

За съжаление в съвременните дизайни на сайтове понякога изобщо не се предвиждат хлебни трохички. Освен това, често хлебните трохички изглеждат добре на десктоп версията на сайта, но не и на мобилната му версия. В някои случаи те не се събират на екрана и по този начин се получава "сбиване", което влошава потребителското изживяване и цялостния външен вид на страницата.

Този проблем може да бъде решен чрез добавяне на възможност за превъртане (скролване) наляво и надясно в хлебните трохички. Пример за хлебни трохички с опция за скролване в мобилна версия може да видим в Bazar.bg - видео.

3. Първи елемент от трохичките

Освен обикновен текст "Начало", добра опция е първият елемент на трохичките да представлява изображение на къщичка с img таг. За по-голям принос в класирането, към изображението се добавя alt таг, който е основната ключова дума, по която искаме да класираме началната страница. Този метод е полезен, тъй като Google възприема alt тага като анкор за линк от изображение.

4. Връзки в хлебните трохички

Елементите от "пътеката" на хлебните трохички трябва да съдържат препратка към страницата, на която съответстват. Това важи за всички елементи, освен за последния, който сочи към текущата страница.

В случаите, когато имаме странициране, последният елемент на категорията в трохичките (който води към 1-ва страница в категорията) е препоръчително да е линк, за да може още по-бързо потребителят да се върне на главната страница на категорията.

Името на текущата страница трябва да е под формата на обикновен текст, който не може да се клика. Причината вече я споменахме - Google никак не обича линкове, които сочат към страниците, от които идват.

5. Хлебни трохички в начална страница?

Структурата на всеки сайт започва с главна страница - не е логично хлебните трохички да са част от нея. Освен това, цикличните линкове, които препращат потребителите до страницата, от която идват, имат негативно влияние върху класирането. Хлебни трохички в начална страница is a no-no!

Каква е ролята им в SEO

1. Страница с резултати (SERP)

Освен че подобряват потребителското изживяване (user experience), хлебните трохички са един от факторите за класиране в търсачката.

През 2018-та година Google добави хлебните трохички към страницата с резултати (SERP).

2. Микроформати

За да се появят хлебните трохички на страницата с резултати, трябва да осигурите наличие на съответните микроформати.

В Google Search Console има отчет за структурирани данни (structured data) на хлебни трохички. Той показва дали хлебните трохички функционират правилно и предупреждава в случай на възникнали проблеми.

Отчетът "Breadcrumbs" се намира в раздел "Enhancements".

Как да добавите хлени трохички към сайта си - вижте тук!