Горизонтальная VS вертикальная навигация

Плюсы и минусы двух типов меню вкраце
Плюсы и минусы двух типов меню вкраце

Какое меню лучше: горизонтальное сверху или вертикальное слева? Дизайнеры спорят об этом уже давно. Многие делают свои собственные выводы, а некоторые находятся в сомнениях. В любом случае, конкретного решения никто еще не оглашал. Ведь все зависит от контекста, да и как говорится: контент — король (content is king)! Меню, которое подходит для одного сайта, может не выполнять своих функций эффективно для другого, поэтому важно понимать в каком контексте будет использоваться меню.

Оригинал: The Strengths and Weaknesses of Top and Left Navigations


Пробегаемся глазами (scanning)

    Левое вертикальное меню намного проще и эффективнее сканируется глазом. Тремя фиксациями глаз человек может различить 6 позиций меню, в отличие от трёх позиций горизонтального. Так же вертикальное движение глаз более эргономично в данном случае, ведь горизонтальное движение глаз свойственно обычному чтению.


Место на странице

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


Приоритет пунктов меню

    Вертикальная навигация в начале страницы считается более видимой: она обычно находится на «первой полосе» (above the fold) и не надо пользоваться прокруткой, так же это меню легко находить глазами. Левостороннее меню иногда бывает очень длинным и некоторые позиции (или много позиций) могут уйти за конец окна браузера, приходится скроллить. Более того, горизонтальное меню находится вблизи логотипа и других элементов «шапки», что делает более заметным.

Видимость

    Вертикальная навигация в начале страницы считается более видимой: она обычно находится на «первой полосе» (above the fold) и не надо пользоваться прокруткой, так же это меню легко находить глазами. Левостороннее меню иногда бывает очень длинным и некоторые позиции (или много позиций) могут уйти за конец окна браузера, приходится скроллить. Более того, горизонтальное меню находится вблизи логотипа и других элементов «шапки», что делает более заметным.

Применение

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

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

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

перевод: Рехимкулов Ринат

Реклама

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

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s