Навігація по сайту: основні тенденції
Сьогодні такий елемент навігації, як іконка «гамбургер» знайомий більшості користувачів. Даний елемент може подобатися або не подобатися, проте не можна не визнати, що в цьому році «гамбургер» був однією з найголовніших тенденцій в веб-дизайні. Звичайно, до революційних змін в дизайні «гамбургер» не привів, проте, його стрімко зростаюча популярність є приводом подумати про те, як в найближчому майбутньому можуть змінитися елементи навігації і навігаційні шаблони. Чи буде домінувати тренд до спрощення та зменшення елементів або з`явиться щось нове? Однозначно ясно лише одне - дизайнери, як і раніше, будуть прагнути зробити доступ до інформації як можна більш простим і легким.
повноекранний НАВІГАЦІЯ
Є сайти, на яких навігація як би відсутній. Тобто, звичного меню користувач не бачить, але це не заважає йому переміщатися між сторінками сайту. В даному випадку навігація є частиною дизайну - це може бути контент, заголовки, картинки або інші елементи. Однак такий підхід до дизайну вимагає дуже ретельного тестування, так як ніколи заздалегідь не відомо, чи будуть користувачі сприймати зміст сайту як навігацію. Якщо тести покажуть, що відвідувачі не замислюються про те, як користуватися сайтом, то це означає, що дизайнер зробив все правильно.
НАВІГАЦІЯ В нижній частині ЕКРАНУ
Найчастіше дизайнери мають у своєму розпорядженні елементи навігації у верхній частині. Даний підхід домінує з моменту появи веб-дизайну - це найбільш раціональний варіант розміщення меню. Але деякі дизайнери почали експериментувати з переміщенням навігаційної панелі в нижню частину екрану. Це досить цікавий підхід, який непогано працює на односторінкових сайтах, не сильно перевантажених інформацією. При цьому потрібно завжди пам`ятати, що користувачі все одно спочатку шукатимуть меню вгорі, отже, навігаційна панель повинна бути досить помітною, але при цьому вона не повинна ускладнювати доступ до вмісту сайту, особливо при скролінгу.
ВЕРТИКАЛЬНОЕ МЕНЮ
Відео: HTML-верстка на Bootstrap | # 3 Navbar - розмітка навігації для сайту
Вертикальні стеки можуть бути непоганою альтернативою звичному горизонтальному меню. Даний підхід дозволяє ефективно використовувати наявний простір. По суті, іконка «гамбургер» якраз і є одним із способів вертикальної навігації - користувач клацає по значку, після чого бачить вертикальний стек. Вертикальне меню може бути статичним, а може зникати, ховаючись в контейнері, якщо місця на сайті мало. Використання вертикальної навігації показує непогані результати при створенні мобільних версій сайту - дисплей смартфонів і планшетів зовсім невеликий і горизонтальне меню там може просто не поміститися або стати нерозбірливим.
висувні МЕНЮ
Висувна навігація якийсь час була досить популярною у дизайнерів, але даний тренд поступово втратив актуальність. Однак висувне меню може бути корисно, особливо в якості другорядної навігації. Якщо дизайнеру потрібно зробити акцент саме на підміню, то даний прийом може бути цілком виправданий.
При натисканні на елемент основної навігації підміню плавно висувається і закриває собою посилання головного меню. Використання висувної навігації дозволяє додати інтерактивності і значно спростити користувачам взаємодію з сайтом.
Відео: Як зробити меню (панель навігації) на сайті Wordpress
ДЕТАЛЬНІ МЕГА-МЕНЮ
Докладні мега-меню були дуже поширеними кілька років тому, але зростання числа користувачів мобільних пристроїв змусив дизайнерів переосмислити концепцію великих меню, так як така навігація погано працює в мобільному середовищі. З проблемою докладних меню вперше зіткнулися розробники великих інтернет-магазинів - величезна кількість підпунктів дуже погано відображалося на маленьких дисплеях. Вирішенням цієї проблеми є розбивка навігації на два і більше шарів: перший шар коротко знайомить відвідувача з основним вмістом сайту, а допоміжні підміню дозволяють вибрати потрібний розділ і вже звідти ознайомиться з представленими на сайті категоріями.
Анімованих елементів НАВІГАЦІЇ
Анімовані елементи - один з головних трендів 2015 року. Такі елементи цілком можна використовувати і при розробці навігаційного меню. Однак такий прийом слід використовувати обережно - анімація не повинна відволікати користувачів від перегляду контенту. Анімовані елементи можуть використовуватися для показу підміню або якимось чином інформувати користувача. Анімація до того ж може зацікавити користувача, якщо той не очікує від сайту інтерактиву. Багато відвідувачів при цьому будуть довше затримуватися на сайті, щоб докладніше вивчить представлений на ньому контент.
плитковий НАВІГАЦІЯ
Сайт Pinterest використовує плитки для всього, в тому числі і для навігації. І це дуже правильно, адже будь-якому користувачеві легко зрозуміти, як переміщатися по сайту. В даному випадку елементом навігації є сама плитка. Користувач клацає по найцікавішого йому піну і тут же переміщається на відповідну веб-сторінку. Однак на цьому взаємодія з сайтом не закінчується: Pinterest тут же показує користувачеві вміст інших пінів, яке може того зацікавити і таким чином утримує відвідувача на сайті. Даний прийом є дуже перспективним, особливо при створенні сайтів з великою кількістю контенту. Плиточная навігація є одним з найкращих варіантів при показі сайту на мобільних пристроях - вона проста і інтуїтивно зрозуміла.
