Различните видове навигация в уебсайта - знайте какво работи

Никлас Хаунер/август 2017

Всеки ден посещаваме тонове уебсайтове, които търсят информация. Понякога търсенето е успешно, понякога не. Една от причините защо това може да бъде? Грешната навигация. Потребителят просто не може да се ориентира в уебсайта. За да сложим край на този призрак, представяме някои от най-популярните варианти на менюто и даваме препоръки как да ги използваме.

Менюто за хамбургер

Това, което отначало звучи като меню в McDonalds, всъщност е широко разпространен и често използван тип навигация в менюто в уебсайтовете. Тя се роди поради необходимост, когато сайтовете изведнъж трябваше да покажат цялото си съдържание на нашите малки iPhone 4s или Google G1s. Името на менюто за хамбургери произлиза от трите успоредни линии, за които се предполага, че напомнят на опростен сандвич с месна гарнитура.

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

навигация

Интерактивната навигация

Интерактивната навигация е много отворено поле и също е малко трудно за обяснение. По принцип може да се каже, че няма типична връзка от А до Б. По-скоро самото навигиране в уебсайта е част от преживяването. Интерактивните елементи закачливо водят потребителя до следващия раздел или подстраница. Най-добре е да погледнете директно примера - тогава ще бъде по-ясно.

Статичната странична лента

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

Заглавна * навигация

Навигацията в хедър * (аналогично на това е и навигацията в долния колонтитул) е на практика малката черна рокля сред менютата - класическа и същевременно елегантна. Най-известният представител на този вариант на менюто и от години е: уебсайтът на Apple. Предимството: потребителят има всички елементи от менюто, които се виждат веднага с един поглед. Apple също така много ясно показва как се държи такова меню в мобилната си версия: то безпроблемно влиза в менюто на бургер. Тук също има различни модификации, при които например менюто е фиксирано в горната част на екрана при превъртане или - и това е най-новата тенденция - с по-малки размери на дисплея се събират вече неподходящите елементи от менюто от падащото меню *, което ние правим ще ви отведе до следващия вариант на менюто.

Падащи менюта * (или мега менюта)

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

Долния ред

Кой тип меню е подходящ за вашия собствен уебсайт, зависи от много фактори - било то съдържание, опит, използваемост *, крайно устройство и т.н. - но в крайна сметка никога няма всеобхватно общо решение. По-скоро се използват все повече смесени форми, например в Tesla, които на видно място представят новите си автомобили в заглавна * навигация и скриват всички останали елементи зад менюто на бургер. Надяваме се, че нашата малка екскурзия в света на менютата е показала възможностите и че управлението на менюто на уебсайт е малко наука сама по себе си, която с удоволствие ще подкрепим.

Използваемост = Използваемост или лекота на използване
Странично дърво = всички страници на уебсайта се разпространяват
Едно пейджър/едно пейджър = цялата информация е събрана на една страница
Хедър = горната част на уебсайт, напр. Б. съдържа логото
Падащо меню = меню, което може да бъде разгънато чрез взаимодействие с потребителя
Премахване с мишката = преместване на показалеца на мишката върху елемент от уебсайта