Когда и как использовать меню "бургер" на сайте и в приложениях? Одноклассники и тут выделилилсь =)
Делать меню-бургер на сайте или нет? Вопрос, который меня волновал давно, но я его игнорировала.
Бургер - это меню, которое выглядит как три горизонтальные полосы (выше).
Пару месяцев назад дискутировала с дизайнером по поводу меню на сайте. Переделывали дизайн и на мобильных все пункты вывести было нереально. Сделали бургер. Хотя у меня было неспокойно на душе.
Недавно отсмотрела 20 сценариев в вебвизоре: с телефонов бургер игнорят, будто его и нет. Долистывают до конца и переходят по ссылкам в футере. Тоже неплохо.
На днях была на лекции по дизайну, где все встало на свои места. Если коротко, то:
Плюсы Бургера | Минусы бургера |
---|---|
В версии для смартфона без бургера никак, потому что пихать в верхнее меню 20 пунктов на смартфоне невозможно (или глупо) | Существует категория людей (например, старшего возраста), которые не понимают, что это меню. Бургер интуитивно понятен для тех, кто вырос со смартфоном водной руке и бургеров в другой. |
Если убрать меню в бургер, люди будут жать на конверсионную кнопку, а не на меню. |
Решила проверить, какие из приложений на моем телефоне будут с бургеров, а какие без)
Бургер | Иконки+текст |
---|---|
Фейсбук, который задает всем тренд | Телеграм |
Вконтакте, который копирует фейсбук | Авиабилеты |
Поиск Яндекс | Яндекс.Карты |
Агода: аналог Букинга в Азии (но дешевле). В бургер убрана куча всего интересного | Цены на крипту: очень простой, в бургер нечего прятать, так что его нет и это логично |
Сервис доставки еды, при клике на бургер открывается дивный мир личного аккаунта + настройки | На этом приложения без бургеров в моем телефоне закончились =) |
Ю ду - сервис услуг. | |
Билеты ПДД | |
Гет Такси: в бургер убраны все сервисы такси |
Кстати, заметили, что у соцсетей бургер снизу справа, а у сервисов (еда, такси - сверху слева)? =) Обычно одна кампания задает тренд, а после ее копируют. Проще "переманить" к себе покупателей/пользователей, которые уже знакомы с аналогичным интерфейсом, чем придумывать что-то новое и обучать людей пользоваться продуктом.
На фоне приведенных интерфейсов выделяются Одноклассники.
Одноклассники (мобильное приложение) | |
---|---|
Очевидно, что Одноклассники стали заложниками ситуации, в которой часть пользователей знает без объяснения, что означают 3 горизонтальные полоски, а часть - нет. Специально для последних все пункты меню подписаны. |
Резюме:
- Бургер схлопывает большое количество пунктов меню как на сайте, так и в приложениях. Замечу, что в приложениях из примеров выше, где нет бургера, он и не нужен, ведь туда нечего убирать.
- Бургер понятен не всем. Например, если сервис/приложение рассчитаны на людей, незнакомых с "молодежными (=)))" интерфейсами. Им не ясно без подписи, что бургер - это меню. (Или, например, многие сейчас не связывают иконку дискеты и процесс сохранения, потому что в жизни не видели дискеты)
Подписывайтесь на мой блог о маркетинге, крипте и путешествиях. Я пишу о полезных вещах весело и простыми словами.