七个导航菜单的设计建议

一般来说在web界面中，浏览频次与点击次数最多是导航菜单，越复杂的系统越需要合理的导航，常常关于导航如何设计团队会争论，这也是很正常的事情，毕竟好的导航会给之后设计工作提效不少，同时也让使用者有更好的用户体验，以下七个设计建议能帮助用户在使用导航菜单时获得更好的体验。

导航位置

不止有主导航，还有次级导航，辅助导航等等，导航的位置需要符合人类“F”阅读习惯，导航位置的布局关系到客户能不能快速的找到并理解整体的页面布局；

及时告知当前位置

对于使用者来说，当他们每一次点击导航，都有可能会有以下疑问：

• 当前在哪里？
• 后退去哪里？
• 关系是什么？
• 再点可能去哪里（预期）？

因此在任何的页面中应该或明示、或暗示的告知客户当前的位置、如何回去、如果是新开窗口和之前页面的关系是什么？如果再点击可能会如何，这个涉及到导航设计的统一性原则，也就是导航行为要有规律并一致，才能让使用者能比较准确的预期点击行为之后的结果；

7±2原则

对于使用者来说，当他们每一次点击导航，都有可能会有以下疑问：

1956年美国心理学家米勒在发布的《神奇数字7加减2:我们加工信息能力的某些限制》中正式提出7±2法则。他在最早对短时记忆能力进行了定量研究，发现一般情况下，普通人的短时记忆能力的广度为7±2的信息块，也就是大概为5-9个信息块之间。

那么同理，导航菜单的菜单数同样遵循这样的原则，注意这里说的并不是导航只能有最多9个，而是说超过9个的导航应该考虑“截断”或者别的方式，目的是如果导航菜单过多（比如20个）使用户能一次性阅读不至于产生恐慌。

主题分组

上一建议讲到了数量上的处理办法，如果系统或者网站关联的地址的确比较多（一般会有很长的导航，不管是横向还是纵向的排列），那么在信息架构的阶段就应该按相关性分类清楚，这样在导航菜单的设计上更有逻辑性，同时可以辅助以icon、意向图等视觉方式更强调“导航模块”的内容意义，让用户更好的理解；

文案清晰简洁

大多是情况下文字的传达效率是最高的，那么在导航的文案上要求以下几个原则：

• 准确
• 一致
• 易读
• 简洁

展开与收起

导航菜单展开或是收起需要根据页面尺寸、情境等不同因素的综合考虑而定，响应式布局在不同的尺寸导航根据尺寸动态调整，基本的原则是——容易找到和便于操作，不同场景也可能有一定的取舍，也许会牺牲一点操作便利，或者为了操作便利，全部平铺；

视觉指引

在很多网页的视觉设计过程中，有可能为了视觉个性的表达，可能忽略了菜单的几个基本态的完整性，但从用户体验的角度，必须保证每个状态的完整性，尤其是B端产品，菜单的状态的视觉指引尤为重要；

• normal（正常态）
• disable（禁用态）
• hover（鼠标滑过）
• click（鼠标点击）

总结

在实际的工作中也许会有一些的视觉风格的要求，但还是得遵循基本的用户体验原则，可用一定是第一位的，以上是导航菜单的七个建议是一般导航菜单在设计中需要注意的点，希望能给大家一些参考，欢迎指正交流。