Навигационное меню: гамбургеры vs сосиски

Навигационное меню: гамбургеры vs сосиски

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

Меню гамбургер

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

Плюсы

  • Минимизирует объем визуального пространства, необходимого для меню
  • Большая часть пользователей понимают его функциональность
  • Делает жизнь дизайнеров проще, пряча все лишнее на мобильном экране.

Минусы

  • Требует дополнительного тестирования, для того, чтобы убедиться, что меню будет работать как на мобильных, так и на компьютерных экранах. Иногда бывает сложным в исполнении при наличии различных выпадающих элементов, текстовых справок и т. д.
  • Может требовать дополнительный JavaScript
  • Добавляет дополнительную точку взаимодействия с пользователем (нажмите, чтобы открыть, затем перейдите к чтению доступных параметров).

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

Ссылки сосиски

 

Эта концепция далеко не нова. Большое количество сайтов уже давно реализовали этот тип меню в той или иной форме. Смысл этого поста заключается не в том, чтобы взорвать ваш мозг новым способом навигации, а в том, чтобы привлечь внимание к другой доступной концепции меню. Хватит пустых разговоров, давайте же быстрее посмотрим на сосиски в действии:

Плюсы

  • Минимальное количество CSS
  • Подходит для экрана и клавиатуры
  • Не требуется JavaScript
  • Пользователи могут видеть первые несколько доступных опций без какого-либо взаимодействия.

Минусы

  • Может выглядеть не самым визуально привлекательным для определенных проектов (уродливая полоса прокрутки в некоторых случаях)
  • Больше подходит для небольших меню
  • Без должного дизайна/визуальных эффектов пользователи могут не понять, что они прокручиваются.

Что же выбрать?

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


P.S. Вы случайно не проголодались?

 

Поделитесь
в социальных сетях

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

Комментариев пока нет. Вы будете первым!

Как продать дизайн?

Наши и другие рекомендации по разработке дизайна и дальнейшей публикации на сайте