layui导航栏不跳转切换内容_UI设计知识系列 四、界面中的“导航布局”

导航布局，是UI设计时需要重点考虑的部分。一款App的导航可以被设计成多种形式的，导航设计的合理与否,直接关系到用户能否根据自己过去的生活习惯和直觉，不假思索地去使用APP,并且完成用户想要完成的任务。

一款产品从初期架构到上线会经历无数次的改版。有可能是因为商业模式的改变，也可能是产品本身的架构不能满足业务需求…… 产品在不断的迭代和更新。每进行一次结构上的调成，成本都是非常大的。所以，在设计之初，我们就要慎重考虑app的导航框架设计。

单独说导航框架包含：标签、列表、网格、屏幕轮播、抽屉导航等等各种形式。但是，导航的设计与产品所在行业、产品的特点、产品的商业目标有着密不可分的关系，或者说导航是完全服务于应用的。所以本着服务于App的目的，我把导航总结分类成了三个类别：同级导航、层级导航和内容式导航。

这篇文章也会按照导航的目的去展开。

一、同级导航

同级导航，一般都是运用在软件的入口位置或者是一级界面上，方便用户在同级界面之间进行来回切换。

这一个类别的导航，是应用最为广泛的一种，它的优势在于所有的内容都是平面化的，铺开在用户面前。不论用户怎样切换，都能清楚的知道自己现在所处的界面层级，不会迷失方向。

• 标签导肮

日常所接触的App中，很多都使用的是标签导航。特点是，最底部的标签是固定不动的，通常是以图标或图文组合的形式出现。点击标签，界面的内容区会随之切换。而图标会呈现出颜色上的变化。