目前网站APP常用的导航设计方法（2）

查阅资料，收集一下目前网站APP常用的导航设计方法，都是借鉴，非自己所写，只想保存下来方便自己查看。

1.标签导航（标签导航位于页面底部 ，标签的分类最好在5个以内，比如微博、微信、淘宝）

图1

优点：清楚当前所在的入口位置；直接展现最重要入口的内容信息。

缺点：功能入口过多时，该模式显得笨重不实用。

2.驼式导航（中间加了一个“+”导航，像轮船上用来指挥的船驼，比如微博、qq空间）

图2

优点：需要突出重要且频繁操作的入口。

缺点：同标签导航。

3.抽屉导航（将菜单隐藏在当前页面内，点击入口即可像抽屉一样拉出菜单）

图3

优点：节省页面展示空间；让用户注意力聚焦到当前页面；扩展性好。

缺点：不适合频繁切换的应用。

4.宫格导航（宫格导航将主要入口全部聚合在页面，让用户做出选择，比如美图秀秀）

优点：直接展现各项内容；方便浏览经常更新的内容。

缺点：无法入口间的跳转；不能直接展现入口内容；不能显示太多入口次级内容。

5.组合导航（比如淘宝里的快捷入口，像天猫之类的）

图5

当用户需要聚焦内容，同时又需要一些快捷入口能够接到某些页面时，就可以采用组合导航。

优点：布局灵活，能适应架构的快速调整。

缺点：不规则容易有杂乱感。

6.列表导航（比如微信的发现界面）

图6

优点：层次展现清晰；可展现内容较长的标题；可展示标题的次级内容。

缺点：同级过多时，容易产生疲劳；排版灵活性不高；只能通过排列顺序、颜色来区分各入口重要程度。

7.tab导航（用于二级页，本质和标签导航相同，当应用层级较多时，可采用tab导航，比如淘宝）

图7

优点：对多内容多层级产品适用。

缺点：结构复杂，内容繁多。

8.轮播导航（比如天气软件）

图8

优点：单页面简洁内容，整体性强；线性的浏览方式有顺畅感、方向感。

缺点：不适合展示过多页面；非主页面不利于展示和查看。

9.点聚导航（主操作选项或导航合并成一个按钮，浮动在页面上，比如path，最新版本导航置在中间）

图9

优点：灵活；展示方式有趣；页面更开阔。

缺点：隐藏了更多入口和操作。

10.瀑布导航（瀑布式布局适用于图片为主的内容，下拉自动加载，比如花瓣）

图10

优点：浏览时产生流畅体验；排版布局多变；沉浸式体验。

缺点：不适合层级架构复杂的产品；容易产生疲劳感。