101条UX原则 - #23 不要再把东西放到 “汉堡包”菜单里

很少有UI模式可以像汉堡包菜单一样引起争议。 在过去五年中，它成为在小型显示屏上提供菜单的客观存在的方式，通常的场景是使用响应式设计将网站扩展到移动端或平板电脑的屏幕宽度时：

研究显示（《汉堡包菜单和隐藏导航伤害用户体验指标》，NNG，（https:// www.nngroup.com/articles/hamburger-menus/）2016），汉堡包菜单会：

·减慢用户的探索的时间；

·增加感知的任务难度；

·减慢完成任务的时间。

简而言之，汉堡包菜单向用户隐藏了一些项目，这些项目变得不易被发现。 此外，由于菜单是隐藏的，因此用户无法了解产品中的“它们所在的位置”。

汉堡包菜单的一些替代设计模式：

·视图底部的导航：因 iOS 应用程序的大量应用而受到用户欢迎，你可以在一个始终存在的底部菜单中放置四到五个关键功能，也可使用高级工具使第五个项目“飞出”。

·选项卡式导航：和上述导航正好相反，这种形式通过 Android 应用程序得以推广，所有的项目是位于视图的顶部。

·垂直型：将导航固定在视图的左侧并垂直方向展示。它可能不会解决所有的问题，但如果你的项目少于六个或七个，那就比汉堡包更好。

在某些情况下，比如你的应用程序有许多需要“可能”的功能（请参阅＃96，确定交互是否设计得“明显”“简单”或是“可能”），为了在移动设备上能提供这些功能而不是删除它们，似乎值得做一些可用性权衡把汉堡包按钮放上，但，从不要在桌面程序上使用汉堡包菜单。

如果你必须使用汉堡包菜单，请将其标记为“菜单”，并为用户提供备受诟病的“三条线”图标。

知识点：

·汉堡菜单减慢了用户的探索速度。

·通过以这种方式隐藏菜单项，用户无法了解它们的位置。

·考虑使用汉堡包菜单的替代方案，但如果必须使用，请用标签写清楚。