Меню-гамбургер: вред и польза

Но исследования (например, NNGroup в 2016 году) показывают, что такое решение приносит больше вреда, чем пользы. Три полоски, изображенные на кнопке меню, ничего не говорят пользователям о том, какие разделы там спрятаны. Поэтому они реже нажимают на эту кнопку, испытывают больше сложностей с поиском нужной информации, и это отрицательно сказывается на KPI сайта или приложения.

«Здоровая» альтернатива — меню с вкладками (tab menu), расположенное в нижней части экрана. Гайдлайны Google и Apple прямо рекомендуют использовать этот паттерн для отображения навигации. Главное, убедиться, что меню с вкладками видно на каждом экране приложения.

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

Меню-гамбургеры все-таки могут быть полезны в двух случаях:

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

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

Хороших вам интерфейсов!

Ссылки для тех, кто хочет углубиться в вопрос

https://www.nngroup.com/articles/hamburger-menus/ – то самое исследование NNGroup

https://www.lukew.com/ff/entry.asp?1945 — статья Люка Вроблевски, где он на нескольких примерах показывает, как внедрение гамбургерного меню ухудшило показатели продукта

https://uxdesign.cc/death-by-hamburger-2d1db115352a — статья, посвященная правильному и неправильному использованию гамбургерного меню, есть несколько примеров, как можно обойтись без него

https://uxplanet.org/tab-bars-are-the-new-hamburger-menus-9138891e98f4 — хорошая обзорная статья про меню с вкладками

https://conversionxl.com/blog/testing-hamburger-icon-revenue/ — результаты A/B тестирования различных кнопок, открывающих гамбургерное меню (с ссылками на два аналогичных исследования)

https://medium.com/@kollinz/hamburger-menu-alternatives-for-mobile-navigation-a3a3beb555b8 — если вам кажется, что на вашем сайте без гамбургерного меню не обойтись, прочитайте эту статью