Навигацията на сайта е нещо, което много хора създават СЛЕД като са помислили за страниците и съдържанието. В скорошно проучване – само 50% от потребителите са успели да предположат къде могат да намерят релевантно съдържание, като се ръководят по структурата на сайта.

Ако половината от вашите потребители не могат да намерят страницата, която търсят – това е огромен UX проблем! Ще доведе по по-висок рейтинг на напускане, по-малко време прекарано на сайта и по-нисък рейтинг на конвертиране.

Ако управлявате сайт за електронна търговия – лошата навигация може да повлияе на печалбата ви.

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

Какво е навигация на сайт? 

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

Хипертекстът или медията са текст-базирани уеб страници, които използват хиперлинкове, за да се свържат с други страници в Интернет. Хиперлинкът е връзка, която свързва вашия браузер с URL.

URL-то индикира кой файл на сървъра трябва да достъпи браузера и го сваля и представя на потребителя, за да може да го види.

Вътрешните линкове водят към други страници от същия домейн. Външните линкове водят до страници от друг домейн.

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

Какво е меню за навигация в сайт?

Менюто за навигация в сайта е набор от линкове, обикновено към вътрешни страници, които са организирани в меню. Повечето сайтове, включително и този, имат меню в горната си част.

website navigation menu header example

Тази част се нарича “хедър” (глава) на сайта. Едни от най-популярните страници, свързани в тези менюта са:

  • За нас
  • Блог
  • Контакти
  • Цени
  • Услуги

Разбира се, менюто може да включва линкове и към други страници.

Какво е навигационна структура на сайт? 

Навигационната структура на сайта определя как различните страници са организирани и свързани една с друга.

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

website navigation structure example

В този пример “За нас”, “Планове”, “Контакти” и “Блог” са страници, свързани в главното меню. За да достъпите “Мисия” и “Екип”, първо трябва да посетите “За нас”.

Защо навигацията е важна за сайта? 

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

С правилния подход към навигацията и менютата можете да сведете този процент до под 50%. Това ще намали процента на отпадане, ще повиши средното време, което един потребител прекарва на сайта и ще доведе до повече трафик и клиенти.

Какво прави една навигация добра? 

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

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

Навигацията, ориентирана към потребителя, също е ориентирана и към контекста. Трябва да се вземат под внимание очакването на потребителя и неговия опит. Това може да е причина, например, защо онлайн вестниците не могат да се отърват от своя “претъпкан” дизайн. Защото именно това очаква потребителя, което включва и много подробни менюта от категории и подкатегории.

8 принципа за подобрена навигация на сайт 

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

1. Планирате вашата структура и навигация

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

Планирането е основна част от процеса на предоставяне на задоволителна за потребителя навигация.

2. Следвайте установените стандарти 

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

За основни дизайн елементи, като къде да позиционирате менюто и как да индикирате, че то се разгръща – използвайте познатите стандарти.

Трите хоризонтални черти – “☰ хамбургер менюто” е една от най-разпознаваемите икони за идентифициране на разгръщането на менюто. Друга такава е трите точки, разположени хоризонтално.

Ако искате да бъдете креативни и да създадете собствена икона – шансовете са много потребители да не разберат целта й и с трудност да намерят менюто.

3. Използвайте речника на потребителя

Вместо да свързвате към същите стари страници, използвате език, който е по-близо до това, което търси потребителя.

Този подход е полезен и за СЕО, и за ползваемост. Създайте страници, които отразяват това, което потребителите търсят онлайн.

Можете да ги свържете със същите думи и фрази, с които потребителя би следвало да ги намери в Гугъл.

4. Използвайте адаптивни менюта 

След, като над 52% от трафика се осъществява от мобилно устройство, адаптивният дизайн е абсолютно задължителен.

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

5. Възползвайте се от менюто във футъра

Читателите, които скролват до края на страницата са по-ангажирани със съдържанието от стандартния потребител. Възползвайте се от това и използвайте пространството в края на сайта, за да позиционирате важно съдържание.

Футърът ви позволява да добавите линкове към съдържание, за което не можете да намерите място в хедъра.

6. Използвайте цвят и бяло пространство, за да разделите навигацията от другите елементи

Използвайте цветове, шрифтове и бяло пространство, за да разделите вашите менюта от останалите части и от страничните ленти. Направете така, че да бъде ясно къде започва и свършва менюто.

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

7. Избягвайте падащи менюта

За повечето сайтове (не всички), падащите менюта не са необходими или полезни. Когато потребителите виждат линк в менюто, предположението е, че то се кликва. Освен, ако дизайнът не го разделя от линковете, които се кликват – може да доведе до объркване.

Наличието на твърде много линкове в главното меню може да има негативно влияние върху сайта ви.

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

8. Опростете структурата 

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

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

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

flat structure example

Има доказателство, че простата и плоска структура има положително влияние върху СЕО-то и може да доведе до сайтлинкове в Гугъл. Затова, не обърквайте навигацията си!

Тендеции в уеб навигацията през 2020

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

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

Разгръщащи се категории в менюта на цял екран (за мобилните устройства) 

Uber - menu mobile

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

Проблем за тези компании е, че имат много различни продукти и категории и, че може да е невъзможно да бъдат включени в едно меню.

Това води до ясни, категоризирани и разгръщащи се мобилни менюта, вместо един безкраен списък с линкове.

Плаващи менюта в хедъра 

Може би универсалната тенденция за менютата през последните няколко години са плаващите менюта.

Плаващо е това меню, което се залепя за горната част на браузера, докато скролвате надолу. Обикновено – това е част от хедъра, която включва малко лого, и може би икона за търсене.

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

Обобщение

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

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

Вашият коментар

Вашият имейл адрес няма да бъде публикуван. Задължителните полета са отбелязани с *

Този сайт използва Akismet за намаляване на спама. Научете как се обработват данните ви за коментари.