навигация в веб-дизайне
Веб-дизайн 0 Комментариев

Взгляд на навигацию в веб-дизайне

В этой статье рассмотрим интересные способы оформления навигации, которые используются сегодня. Некоторые из них используются достаточно давно, другие – новый взгляд на навигацию сайта, третьи представляют собой несколько измененные шаблоны, использующиеся для создания правильного контекста ресурса.

Обычная навигация.

Это классический шаблон навигации. Представляет собой список ссылок, расположенный в верху страницы горизонтально или вертикально. Этот способ никогда не перестанет быть актуальным.

Данный вид навигации лучше всего работает на небольших сайтах, где в навигации представлено всего несколько пунктов.

навигация в веб-дизайне

Примеры:

toyfight.co

thecoolclub.co

Скрытая навигация.

Часто такой вид навигации применяется в мобильных устройствах, помогая экономить пространство. Часто имеет смысл скрывать такое меню за одной кнопкой (гамбургер-меню). Некоторые дизайнеры используют такое меню для того, чтобы скрыть даже небольшое количество ссылок.

В случае, например, с Awwwards (awwwards.com), скрывать пункты меню действительно имеет смысл, т.к. их сайт содержит сложное меню, которое требует достаточно много места экрана.

навигация в веб-дизайне

Другие примеры:

mindsparklemag.com

kinfolk.com

Гибридная навигация.

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

Сайты этой категории часто используют навигацию в нижней части страницы (футере). Иногда такая навигация просто копирует пункты с верхней части сайта, делая его более удобным. В других случаях, в футере размещаются вторичная навигация, полезная для ограниченного небольшого числа пользователей.

навигация в веб-дизайне

Примеры:

webydo.com

bigyouth.fr/en

Системная навигации.

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

Она используется для знакомства пользователей с категоризированными постами и другими сборниками информации. Если информация на сайте распределена по темам, датам, тегам, эта способ навигации для вас.

навигация в веб-дизайне

Примеры:

fubiz.net

nytimes.com

Экспериментальная навигация.

Это не один отдельный шаблон, а целая коллекция. Ее можно назвать «Портфолио навигации», потому что такая навигация чаще всего используется на сайтах-портфолио, где дизайнеры чувствуют полную свободу своей креативности. Такие сайты обычно отличаются отсутствием традиционного меню или рассеиванием пунктов меню по всей странице.

Часто такой подход в какой-то степени вредит юзабилити сайта, но, без сомнений, такие страницы создают эффект чего-то творческого и запоминающегося.

навигация в веб-дизайне

Примеры:

veintidosgrados.com/work

aftershock.cc

Что вы думаете о навигации будущего? Мы увидим консолидацию существующих систем навигации или появление новых моделей в 2017 году?



Подпишитесь на обновления блога!

Будьте всегда в курсе новостей

Добавить комментарий