烟台APP开发公司：怎样和为什么要避免汉堡包菜

这种模式的问题现在得到广泛的认可，但实际的解决方案是什么？希望你阅读后了解问题、解决方案，在使用这种模式之前知道它的影响。

汉堡包导航这种模式的问题现在得到广泛的认可，但实际的解决方案是什么？希望你阅读后了解问题、解决方案，在使用这种模式之前知道它的影响。

汉堡包导航产生的问题：

1.较低的可发现性

2.效率不高

3.与平台导航模式冲突

4.不便于快速浏览

1）较低的可发现性

不在视线内的内容很容易被人遗忘。汉堡包菜单栏在其默认状态下，侧栏菜单及其所有内容都是隐藏的，所以人们需要花费一定时间来发现侧边菜单，并且操作它。就如同现在很多公司需要使用文字标签或提示，来补充单纯的图标，好让用户理解这个功能。（但是，这在主屏幕提供了主要功能的软件中是不适用的。）

2）效率不高

目前有人意识到并重视到汉堡包导航的弊端，汉堡包导航增加了导航摩擦，它迫使人们必须要打开菜单，只允许他们看到和到达他们的目的地。

以下是导航元素一直可见的即时导航对比

3）与平台导航模式冲突

除了这些问题之外，在诸如iOS的平台中，汉堡菜单根本不能实现，并且与标准的导航模式相冲突。

在ios平台里，左侧有返回上一层级的交互手势，但是此时左侧导航栏还需要为菜单保留。在用户点击到下几个层级后，想要直接通过菜单跳转层级时需要经过好几次的返回，才可以划出菜单，如下图：

4）不便于快速浏览

这里有两个软件的功能展示的对比（Jawbone UP的通知和twitter的通知）

当用户需要获得信息必须通过点击导航，跳转到另一个页面才能看到时，用户得到想得知的信息是很困难的。

就像Jawbone UP应用程序那样：在侧边栏菜单按钮旁边显示一个代表通知性质的图标。但是这也并不能很好的解决这个问题。并且它需要你提供更多的图标来让用户明白你的功能位置。作为设计师，你可能会被迫显示通用的通知图标，这样可以让用户更好的理解图标的意图，以免增加歧义。

相比之下，Twitter下面的Tab Bar可以让用户了解通知功能和内容，并直接导航到与之相关的界面。

导航的认识

很多人可能会觉得，我们不得不使用汉堡包菜单栏来精简界面，但这实际上是对人们在现实中的误解。你可能会认为人们会看着界面中的一切，被复杂的各种元素困扰，但实际上，用户更倾向于关注一个重点领域，自动忽略其他信息，即使是在缩小尺寸的屏幕上。

因此，我们不需要为了精简而使用不好用的导航，就如同不应该为了精简而放弃应用程序的信息反馈和状态的显示。

作者旁注：也许我们需要的是刷新我们对HCI的理解，当我们设计的时候，采用一些视觉方法可以避免很多设计错误。

解决办法

关于这些问题已经写了很多，但是解决方案并不是每个人都很清楚。

我们什么时候使用汉堡包导航?

可能有一些非常罕见的情况，这种模式实际上是有意义的，但一般情况下，我们应该是完全避免它的。

IRCCloud就是合理应用这种模式的例子，它允许在频道和频道成员之间导航。

这案例告诉我们，汉堡包导航还是可以使用的。因为该软件只需要主屏幕来展示功能，没有下一层需要导航来跳转。但是即使在这种情况下，我们可以看到，有时候标题栏已经被超载了，这其中还是需要重新考虑其内容。（如下图）

同时，侧边栏菜单按钮（右）占用了显示“操作”按钮的机会，无法放置所有与内容相关的动作。所以，设计师别无选择，只能将渠道，网络和帐户等不同背景的操作混合到一个单独的操作工作表中：

应该用什么代替？

Sidebar菜单模式非常适合信息架构不太清晰的产品，因为你可以直接添加一件事情，而不会有直接的后果，当然直到人们真正使用它就会发现问题。

以上是如何从侧栏菜单中移除的示例。可以按照颜色编码的点来了解元素如何在这两种解决方案之间转换

好处：

1.状态可以直接显示在消息选项卡中
2.物品总是可见的，一个可以立即访问
3.无导航手势冲突

我们可以通过在滚动方向上隐藏导航栏来保存一些垂直空间 – 如Facebook中看到，使用固定的Tab Bar在当前屏幕，允许我们不依赖导航栏来执行此操作。

如果产品很小，也许一个工具栏就够了。其中关键的是：不要隐藏导航；允许直接访问；不要与导航手势冲突；并提供与其相关的图标的反馈。

对于网站设计，我（作者）认为最好仍然是审查信息架构，而不是套用一些iOS模式。只需将导航显示为网站导航，人们就会发现和使用。

它如何扩展？

我在这里提供的示例基于iOS，在这种情况下，你会使用Tab或工具栏。但是Tab Bar的规模如何超过5个项目怎么办？

这种情况并不理想，它可能再次表明你的应用程序的信息架构有问题，但如果您必须扩展超过5个选项卡，通常的模式是使用最后一个Tab栏提供对其余选项的访问，类似于不幸的地下室菜单。

你可能看到一些滚动的工具栏，例如Rookie。这样可以避免边栏菜单的问题，但是可能会产生点击和滚动之间操作失误，因此可能会导致更高的导航摩擦，并导致更高的错误率。

请记住，第二个解决方案更适合于行为而不是导航。

Rookie为了解决工具栏实滚动后，未被显示的功能容易被忽视的状态，在选择一个功能并完成之后（例如裁剪，旋转等），将其在工具栏里隐藏。这样可以防止在工具栏中用户找不到所需的功能，根据用户行为，在下一次显示时重新设置功能的排序。