Що таке не стандартна навігація, або чому це роблять дизайнери?

Дорогі читачі нашого бога, сьогодні ми хочемо порадувати вас черговий роботою нашого талановитого віддаленого автора — Юлии Солнцевої. Попередні її роботи можна почитати тут і тут. Ну, а пока — пропонуємо зануритися в нестандартну навігацію і, нарешті-то, з'ясувати, для чого ж дизайнери це роблять і — що саме вони роблять :).

За щодо нетривалий період розвитку веб-технологій дизайнери накопичили великий досвід: придумали сто золотих правил хорошого дизайну і десять стандартних помилок. Але, як відомо, «ніж далі в ліс, тим більше дров», і поле для досліджень так ж широко.

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

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

На сьогоднішній день в інтернеті існує незліченну безліч сайтів, хороших і не дуже. Середньостатистичний користувач зазвичай не бачить різниці між сайтами, орієнтованими на одну цільову групу. А є чи між ними очевидна різниця? Бажання виділитися з інформаційного шума — цілком комерційно обґрунтоване бажання, і коштів для цього більше ніж досить. Одним з таких прийомів є використання креативної навігації.

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

Отже, використання нестандартної навігації може мати наступні переваги.

1. Підвищення лояльності до компанії, продаваним товарам і послуг.
Навіщо сайту красивости, якщо саме важливе — це контент, інформаційне наповнення? Уявіть сайт без графіки, його тестовую версію. Навіть з добре продуманої навігацією такий сайт навряд чи буде користуватися популярністю серед користувачів. А тепер додамо трохи графічних елементів навігації, сайт стає набагато привабливіше, а якщо ще зробити графіком тематической — то відвідувачеві набагато простіше і комфортніше буде Шукати потрібну інформацію. Усi дії, описані вище, були не ніж іншим, як підвищенням лояльності відвідувачів до сайту. Нестандартна навігація, яка візуалізує діяльність компанії і цікава в своєму технічному рішенні, дозволяє користувачу з найменшим опором сприймати знайдену інформацію.

2. Залучення уваги до сайту.
З хорошим пошуком хочеться Шукати. Вдала креативна навігація подовжує перебування відвідувача на сайті, а також збільшує пошуковий інтерес відвідувача, адже первинна мета навигации — мотивувати зануритися в контент сайту. І тут нестандартні рішення мотивують клікнути, дізнатися, як що-або працює, перевірити, що буде, якщо і т.д. Сайт з унікальними дизайнерськими рішеннями самопопуляризируется.

3. Управління емоціями відвідувача.
Більшість рішень про покупці приймаються на емоційної грунті. Мерчандайзинг взяв за основне правило управління емоціями покупців з допомогою самих різних прийомів: привабливою викладки, колірного рішення вітрин, навіть освітлення впливає на емоційний сприйняття товару споживачем. Як це працює з нестандартної навігацією? При вдалому рішенні нестандартна навігація приваблює відвідувача, формує перший позитивне враження, що, в свою чергу, підвищує відсоток повернення на сайт.

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

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



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

Цікавий асоціативний ряд створила компанія taptaptap: на їх сайті taptaptap.com навигационное меню і справді в вигляді меню:

Сайт картографа-любителя стилістично відповідає захопленню його володаря:

Нестандартне навигационное меню і тематичні ілюстрації створюють правильний асоціативний ряд, пов'язаний з видом діяльності компанії. В цьому hand-made ательє усi підпорядковане однією стилистической основі:

Тематично ілюстровані кнопки меню створили добре понимаемую і нестандартну навігацію цього сайту:

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

Відмінна дизайнерская робота і грамотне уявлення інформації роблять цей сайт одним з найкращих прикладів використання нестандартної навігації: 

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


4. Самостійний пошук.
Дайте можливість відвідувачеві Шукати самостійно. Якщо ваше креативне меню не доведеться по смаку відвідувачеві, він завжди зможе самостійно знайти необхідну йому інформацію.

Leoburnett.ca: Стильна система навігації на flash, безсумнівно, привертає увага. Недолік навігаційного меню: розсіювання уваги, складність використання.



Сайт японської телекомунікаційної компанії «KDDI». Потрібно постаратися, щоб зрозуміти, що можна робити на цьому сайті. Я просто дивилася на Вродливий flash.
Також на сайті є аудиопроигрыватель, котрий дуже швидко викликає бажання його відключити:

Аналогічна ситуація з навігацією cайта молочної компанії:

Хоча дизайн в мінімалістичному стилі добре відображає суть діяльності фірми. Gotmilk використовують приємні кольори зі сбалансированными колірними акцентами.

5. Закони композиції.
Не перевантажуйте навігацію графічними елементами, грамотно проставляйте колірні акценти, пам'ятайте про законах читання і основах композиції.

Пріоритет розподілу уваги при перегляді сторінки такий:



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

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


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

Дизайнерське агентство з Манчестера. Графічне навигационное меню дуже добре відображає діяльність компанії, а також очевидно в своєму використанні. Усi збалансовано і правильно структуровано:


На сайті не тільки чітке меню, але і правильний баланс форми і кольори:

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