Дизајнирање победничког менија за навигацију Идеје и инспирације
Навигациони мени на веб сајту је попут путоказа на улици или директоријума нивоа у тржном центру. Не можете доћи до своје дестинације без да прво знате где се налазите. Као иу стварном животу, навигација у веб дизајну је веома важна и игра главну улогу у употребљивости сајта, као иу корисничком искуству.
Данас можете видети мноштво различитих врста навигационих менија са занимљивим, креативним и необичним дизајном. Али, како о ефикасној навигацији на веб сајту, како би она изгледала; како би требало да изгледа?
Данас бих желео да поделим своја запажања и сазнања о важности навигације у веб дизајну. Открит ћу неколико једноставних савјета које можете користити за побољшање навигације и употребљивости веб-локације. Ту ће бити и неколико примјера учинковитих навигацијских изборника који ће вам дати идеју о томе како планирати ваш сљедећи дизајн.
Информатион Арцхитецтуре
Планирање навигације треба почети са информацијском архитектуром. Важно је сјести и размислите о информацијској архитектури веб-локације. Морате да схватите какве карактеристике нуди сајт, шта је најважније и шта би се могло поставити на нижим нивоима у хијерархији информација..
Информациона архитектура укључује карактеристике, потребе корисника, ситемап, тестирање и вирефрамес. Више о информатичкој архитектури можете прочитати у чланку Цамерон Цхапман у Информатион Арцхитецтуре 101: Тецхникуес анд Бест Працтицес.
Коришћење технологија које омогућавају корисници
Избегавајте коришћење Фласх-а, ЈаваСцрипт-а, јКуери-а или било чега другог што може да омета приступ навигацији на веб локацији приликом прављења навигационе траке, или бар да се уверите да су у стању да се деградирају.
За више референци на грацефул деградатион оф јавасцрипт, погледајте овај пост на 10 корисних метода за ЦСС и Јавасцрипт.
Користите једноставне, усер-фриендли изразе
Боље је користити једноставне, очигледне и термине које је лако схватити него да се држите индустријских услова за навигациони мени. Свака веза која корисницима доноси више од секунде или два да би се схватила, вероватно је неприкладна за употребу.
Ако корисник треба да кликне на линк да би открио на шта води веза, то ће допринети лошем корисничком искуству за ваше посетиоце.
Примери
Услови у навигационом менију сајта Ларисса Несс-а су лако разумљиви и довољно обични. Корисници неће сматрати да је то збуњујуће јер већ имају искуства са оваквим менијима.
Ево још једног доброг примера чистог и јасног менија за навигацију веб сајта са уобичајеним терминима који се користе у цсуппорт-у.
Креативна агенција Еигхти8Фоур користи термин "изложбени простор" који може бити збуњујући за посјетиоце. Овај термин може значити портфељ или посао, али није јасно и посетиоци немају избора него да кликну да га провере.
Стандардизовати дизајн навигације
Користите исти навигациони модел на свим страницама. Веома је важно јер без конзистентног дизајна, корисник може заиста мислити да је на другој веб страници. Уверите се да користите исти навигациони модел тако да корисници могу лако да претражују вашу веб локацију без губитка.
Блуегг, приказан испод, користи једноставан и чист дизајн навигације који остаје исти у свим подстраницама. Једина разлика је индикатор боје, који приказује страницу на којој је посетилац тренутно присутан.
Назначите где се налазите
Од пресудне је важности да корисник зна шта му је у сваком тренутку. То можете урадити путем промена позадине везе, боја назива странице или укључите текст болд у навигацијском изборнику да би се разликује од других.
Аустин Еастцидерс користи другу боју и позадину да означи страницу на којој је корисник укључен. Овај индикатор може радити и као суптилна промјена дизајна, на примјер помоћу а позадину различитих навигација што ствара осећај да су друге ставке менија у дубини.
Медиа Сургери користи тамнију боју као индикатор за отворену подстраницу. Једноставно, али ефикасно.
Користите веб конвенције
Ради се о једноставној и интуитивној навигацији по веб страницама. Веб конвенције олакшавају дизајнерима да раде на својим дизајну. Већина корисника би кликнула на логотип веб-локације да би се вратила на почетну страницу, па дизајнирајте свој логотип да то уради.
Ако не, терате да проводе време да науче нешто ново или их у неким случајевима ометају тиме што не дају оно што очекују да буду општеприхваћене навигацијске норме.
Овде можете сазнати више о веб конвенцијама:
- 10 Конвенције о веб дизајну
- Немојте поново откривати точак за Веб дизајн
- Дизајн са Веб конвенцијама
Ињецт Десигн ставља лого у горњи леви угао који одговара једном од најчешће коришћених веб конвенција данас.
Адамс Цреатион користи једну од најчешћих веб конвенција - лого се налази у горњем левом углу веб сајта и линковима на почетну страницу.
Тестирајте га: укључите трећу страну
Увек тестирајте свој дизајн за навигацију са било којом особом која је раније користила интернет. Можда бисте желели да доведете људе који нису били повезани са процесом дизајна да би га тестирали. Пратите њихове преференције када се крећу преко вашег сајта и анализирајте време које им је било потребно да пронађу странице за које су тражили.
За бољу прецизност, укључити више људи, прикупити податке, анализирати их и сажети за боље уклапање. Урадите анкету након теста ако је то потребно. Можете добити неке неочекиване идеје и уносе који би иначе остали неоткривени без овог пробног рада.
Обезбедите контекст
Да бисте били конзистентни са својим садржајем и навигацијом, пружите неки контекст за кориснике веб-локације да брзо пронађу ствари које су им потребне. Можете поставити мале иконе које се односе на садржај на који се повезујете или кратке описе да бисте дали преглед онога о чему је страница.
Мој властити бицикл користи једноставне иконе како би корисницима пружио више информација о томе шта могу наћи у одређеној подстраници.
Сарах Парментер користи кратке и лепе натписе под главном навигацијом како би пружио неке информације о подстраницама на које се повезује главна навигација.
СЕО пурпосе
Гоогле воли досљедну навигацију. Добро је имати конзистентну навигацију не само за кориснике да разумију и добију идеју о томе како се кретати кроз вашу веб-локацију, већ и за претраживаче да индексирају вашу веб-локацију.
Роботи за тражилице ће пузати кроз вашу веб локацију како би индексирали вашу веб локацију и ставили линкове на страницу с резултатима тражилице. Ако желите да будете видљиви, обратите пажњу на добар дизајн навигације и добит ћете више промета.
Бесплатне скрипте за навигацију (ЦСС и јКуери)
Ево кратке листе најновијих навигационих менија који би могли бити корисни за ваше пројекте. Ове скрипте ће учинити ваш производ кориснијим још боље додавањем неких лепих карактеристика и чинећи га задовољним за употребу.
Вертикални Сцроллер Вертикални Вести са КСМЛ-ом који користи ХТМЛ и јКуери: вСцроллер
Филтрифи
Паге Сцроллер
Тимелине Портфолио
ХоризонталНав
ЦСС3 Минималистиц Навигатион Мену
Ефект навигације круга са ЦСС3
Грид Навигатион Еффецтс са јКуери
Асценсор
Направите елегантан ЦСС3 мени за навигацију
Излог прекрасне хоризонталне навигације
И на крају, али не и најмање, инспиративни менији за хоризонталну навигацију. Провјерите ове невјеројатне веб странице и њихова рјешења навигацијског изборника како бисте пронашли нове идеје за ваше пројекте.
Цх3мицал
Блоом Сеарцх Маркетинг Инц.
Алек Перез
Либор Зезулка
Хауска!
Голден Ислес
Неил Царпентер
Марц Тхомас
3Д Полистирен
Лиецхтенецкер
Адвентуре Ворлд
Арбутус Пхотограпхи
ОМДРЛ
4 Пинес Беер
Хунтерс Винес
Надајмо се да ћете овај чланак сматрати корисним и информативним. Ако имате било каквих размишљања или се не слажете, подијелите своје мишљење у одјељку за коментаре.
