McGovern(the founder and CEO of CustomerCarewords)说，相比于直接搜索，用户更喜欢用导航。因为导航是让用户做选择题，而搜索是填空题。如果链接的文案与用户寻找的内容相符，他们直接点击链接的可能性更大。
导航设计一直是一个有争议的话题，web端、移动依旧有些不错的应用规则在我们进行网站导航设计时值得参考的：
例如：
•保持(导航结构的)连贯性和一致性
•设计清晰易懂的交互方式
•设计扁平的导航结构
•考虑响应式设备的兼容性
导航的设计原则
导航是组织产品信息的树干，它能够让用户更轻松的在产品中找到所需的信息。为了让导航更适用，首先要定义用户，他们使用产品的典型路径以及产品经理希望他们使用的功能。
1、明确用户群体和核心任务就可以解构流程、通过信息架构搭建产品枝干。
2、选择合理的信息架构设计产品
设计一个优秀的导航结构，分析信息架构的层级是关键。
当产品的信息层级结构图出来时，扁平的导航结构是更好的选择。这是因为，这种扁平的结构能让用户只需要点击一到两次就可以去到最底层的页面。
扁平的导航结构固然很理想，但并不是说把菜单设计得很简短就是好的。就像Nielsen Norman Group 所说，导航项的意义是让用户辨识导航栏项目，并不是让用户去回忆(导航栏项目)。
所以，导航菜单必须简短表达明确，方便用户浏览。
限制导航层级
导航结构的层级数由产品信息层级决定，理想状态下，用户需要点击的导航层级越少，用户到达目标页面也越快越清晰。就像Nielsen Norman Group说的“信息层级越深，则用户越容易被误导”。
扁平的导航层级结构
深层级的导航结构
大部分产品都是3-4个信息层级，这样产品页面比较容易被触达，但保持产品信息在3-4个层级需要确保导航结构不过于宽泛。
要理清产品到底几个信息层级是合适的，可以把现有的信息层级结构划分成互不相关的独立部分。然后审视各个子页面的分组，看看他们是否可以被升至更高一个层级，这时要注意：
•更新一下当前信息版块下的标签
•建立一个完全新的信息版块去容纳那些原本属于交叉版块的子页面
•重新调整各个信息版块之间的关系— 也许他们应该依照操作行为来被分组而不是主题
三种信息架构
1、多个高频需求
2、单个高频若干个低频
3、单个高频无低频需求
导航的类型
1.横向导航
优点：
通常使用比较少的菜单，简单，容易记忆。
位于页面顶部，不占用横向空间。
由于位于顶部，在视觉上更突出，更容易识别。
菜单选项之间视觉权重的区分更明显，左边最强右边最弱。
缺点：
扩展性有限，不能很好地承载大量和多层级菜单。
占用屏幕高度，特别是当固定于屏幕顶部时。
来回切换菜单选项时，横向移动鼠标的距离更长，操作效率更低。
2.纵向导航
优点：
能够承载的菜单项数量和层级更多，扩展性强。
不占用屏幕高度且可以收起，为内容提供更多空间。
在菜单间切换时鼠标移动距离短。
能够更好地适应屏幕宽度较小的设备。
缺点：
菜单数量多层级复杂时，不容易记忆。
菜单选项文字不宜过长，可能会截断。
各菜单选项之间的视觉权重差别不明显。
3.横向导航扩展
但总体来说，单独的横向导航方式层级不能超过 3 层，多于 3 级就不利于用户的阅读和选择。
4.纵向导航扩展
相对于横向，纵向的拓展性强，不管多少级都可以一直往下加，但层级高过于 3 层，用户对导航的分辨和记忆会明显下降。
当然，有时候单独只有横向或者纵向一种导航不能完全满足我们的需求，根据以上特点，我们也可以有如下组合的形式。
5.组合导航
很明显，这样的组合导航，适用于一级导航不太多（最好少于 5 个）且内容权重差别很明显，一级导航之后的导航内容和层级比较多且内容复杂。
另外，如果嫌纵向导航占空间，则可以考虑将纵向导航做成可折叠收起的模式，适用于贴着浏览器的纵向导航。
6.可折叠的纵向导航
为了让用户每天都要“看”的这件事情变得简单高效有质量，导航设计就这样诞生了。希望大家能在设计导航中发现更多有趣、有益的内容，激发更多、更好的创意，完成优秀的B端web产品。
网友评论