导航菜单对于用户的使用来说尤为重要，本文是我从实际工作出发，结合自身产品和过去经验对于导航进行的一次全面总结
在任意一个B端后台系统中，导航菜单都是不可或缺的一部分，每个导航菜单都有其固定位置，通常这个位置是不可撼动的。所以说：导航菜单是B端产品层级重要的交互控件
对于B端产品的用户而言，他们使用导航菜单目的性很强
到后台主要是对具体功能进行操作，导航菜单在功能的引导中发挥了巨大作用。因此，其主要的功能就是对B端产品进行分发、引导；帮助用户在复杂的后台页面中，寻找出自己真正想要的功能。
分享内容：
- 合理规划
- 确定菜单广度和深度
- 菜单层级有区分
- 导航可配置
- 四种常见导航菜单
一、合理规划
1.1 遵循7±2 原则
导航菜单建议最多不要超过 9 个，最少不要低于5个。
原则解释：1956 年乔治米勒对短时记忆能力进行了定量研究，他发现人类头脑最好的状态能记忆含有 7（±2）项信息块，在记忆了 5-9 项信息后人类的头脑就开始出错。
在生活中我们经常会把一长串的数字分成 7 个左右的数组来记忆，这样会使难度降低很多，米勒称这种单位为“组块”。
二、确定菜单广度和深度
导航菜单广度和深度的区别：
- 菜单广度：导航菜单中每一个层级包含的菜单项数目为广度
- 菜单深度：导航菜单层级的数目为深度
深广度平衡帮助用户进行快速选择，通过能够对整个产品架构有着第一眼的认识。
2.1 当菜单广度过大时，怎么办？
当菜单广度过大，我们也能够通过设计的方法来优化导航菜单
我举一个比较具有代表性的例子：腾讯云。
2.2 菜单深度过深时，怎么办？
当面临菜单深度过深时，通常需要从几个方面去考虑：
（1）与产品经理沟通是否到位
这里主要是想通过与产品经理的沟通，了解到菜单的架构设计的原因，以及能否为你的设计进行一次重新的梳理，寻找一些值得优化的点。
建议在寻找产品经理之间，自己能够通过一些思维导图的软件将自己产品的菜单目录全部罗列出来，能够先多思考，为下面的沟通节约时间、提高效率。
（2）用户体验地图的绘制
在一个B端产品中，用户的目的虽然复杂，但是研究用户每一步操作，还是会查找出一些规律，我们可以从这些规律中，做些文章.
比如我们之前在一个医疗系统中，根据角色的不同，将医疗角色分为：前台、咨询师、医生、老板这四种角色，每个角色所关心的点都会有所不同。
比如：
老板：最关心每个门店目前的的情况数据，比如门店营业额、门店待客数、每个医生的治疗量以及治疗最少的医生。这些都代表着他不同场景下使用的习惯。
将这些情况分析以后，提炼出核心的需求点。
然后绘制完成他们的用户地图后，根据角色，明确每一个角色的日常操作有哪些，从而确定我们所有菜单所展示的位置以及整个菜单的层级关系。
三、菜单层级有区分
我将常见的导航区分进行总结，分为以下三种形式：
3.1 颜色区分
颜色区分作为最直接最有效的一种形式，这种形式也是后台页面最初的状态，我通常会用颜色区分和移动端顶部状态栏的演变史做对比，就其功能而言他们都有很多相似的点：
微信在2018年12月份时，发布微信7.0，将顶部导航由黑色转变为白色，引得大家争论不休，而经过时间不断洗礼，大家也逐渐接受这个了事情，渐渐忘去。
四、导航可配置
B端产品易操作性中，导航可配置操作算得上是一个重要的点。其中最主要是通过配置操作实现导航易用性的提升而如何让菜单可配置，通常的做法有两种。
4.1 我的菜单
如果你的产品是针对多数角色不同的用户进行设计，那么在导航设计时，可以考虑增加一个菜单选项：我的菜单，对于菜单进行标签处理。
设置一个我的菜单，将用户常用的菜单进行添加，能够满足每一位用户的菜单快速选择的需求，通过这样的自定义，用户在常用的菜单下，能够通过我的菜单进行快速跳转。
举个栗子：
在印象笔记当中，其快捷方式就是可以将用户想要的模块放置在此，可以快速跳转。
五、四种常见导航菜单
5.1 侧边导航
侧边导航在国内的 B 端产品当中最为常见的。将菜单栏放置在左侧，页面布局上基本为左右结构，将导航菜单放置左侧固定。
因为侧边导航在国内产品中最为常见，因此把他是优先提出来讲。国内厂商对于侧边栏导航的尤为偏爱，在很多人心目中，感觉就只有侧边导航和其他导航两种导航形式，也就造成了在 B 端产品的发展也逐渐趋同。
不过现阶段大家对于 B 端产品的重视，在设计上也开始多元化，话不多说，我们先来看看侧边导航的优点有哪些~
优点：
最后的絮叨叨
我相信，看到这里的同学都是勇士，给大家聊聊自己的心得吧～
其实这篇文章的原型，来自对于公司新产品的导航设计分享，我希望自己把最近几年接触到的内容整理一下，用一个系列的文章来去阐述B端产品的整个架构，如果大家想看什么文章，欢迎私信～
希望大家喜欢
作者：CE大人；一名正在成长的设计师，公众号：CE大人。
本文由 @CE大人 原创发布于人人都是产品经理。未经许可，禁止转载
题图来自Unsplash，基于CC0协议。
Mrw.so短网址关注互联网运营人的需求！