移动应用UI设计——导航设计

导航的设计是 App 设计发展过程中很值得玩味的地方导航页面设计图，由于移动设备特别是智能手机的屏幕尺寸有限导航页面设计图，设计者们通常会将屏幕空间尽量留给主体内容，为导航页面设计图了在手机屏幕给定的范围内展示出更多内容，优秀的导航栏设计将起到关键性作用，对于不同的操作也当因地制宜地选则不同的设计方案。

APP 标签式导航——最常见、最保险 标签导航位于页面底部，通常包含5个标签是比较合适的数量。这种导航是非常常见的，如果你的应用需要用户频繁的在不同分页切换，可以采用这种导航。它的缺点是会占用一定高度的空间。 APP 抽屉式导航——适合信息层级多的界面设计 抽屉式导航常常与标签导航结合使用。

导航UI是指一种用户界面设计，用于在用户与产品之间提供交互性的导航功能。这种设计可以让用户更轻松地浏览产品的各种功能和页面。在web或移动应用中，导航UI通常包括一个菜单栏、一个侧边栏或一个底部选项卡，以帮助用户在不同的页面之间跳转。

标签用于定义超链接，用于从一张页面链接到另一张页面。用于设置锚点，用于页面定位。导航二级菜单显示隐藏 很多网页中的二级菜单栏不直接显示，需要鼠标移动到一级菜单或者点击一级菜单才会展开显示二级菜单。

干货集锦——20个最佳Bootstrap着陆页模板,快速网页设计不是事儿

SukcesSukces是一款功能强大的html5 / CSS3个人简历网站着陆页模板，适合所有人群，无论是自由职业者，设计师，摄影师，还是其他任何行业人群都可以使用该模板快速设计网页。该模板是基于Bootstrap 3框架，具有完全响应式的设计，因此在任何设备上都可以完美展现。

Mamba为扁平风格的单页面模板，用bootstrap构建。Mamba下载页 SuitsTheme SuitsTheme 模板的设计主要为蓝色风格，适全做企业网站官方首页，应该不错哦。SuitsTheme下载页Landy 是一个灵活的单页面网站模板。下载页ShopShop 适合用于小型购物网站模板。Shop下载页ZeencesZeences为一个暗调配色的博客模板。

移动手机站导航的设计模式有哪些

1、其中跳板式导航、列表式导航和选项卡式导航最为常见，仪表式导航和隐喻式导航一般在拟物化设计或者是工具类的app中比较常见，超级菜单式现在会用到的比较少。

2、网页端导航设计模式： 顶部区域导航： 顶部水平栏导航：最常见的模式，常作为产品主导航，置于页面顶部。 汉堡导航：通过隐藏次要信息以节省空间，提供便捷的导航体验。 侧边栏或竖直导航：提供横向排列的导航项，适合包含大量链接的网站。

3、下面介绍移动端几种常见导航形式。标签式导航（也叫Tab导航）大多数app会选择标签式导航，标签式导航结构如下图所示。底部标签导航是iOS页面布局中比较推崇的一种导航方式。而顶部标签式导航是安卓常用的导航模式，它可以避免导航与底部虚拟按钮之间发生冲突，引起误操作。

4、主要导航模式如跳板式、列表式、选项卡式、陈列馆式、仪表式、隐喻式、超级菜单式和抽屉式等。次级导航通常可以被归类为主导航模式，但在功能和布局上通常较为简洁，以支持特定的使用场景。跳板式导航强调清晰的入口展示和易记性，但可能不适合多任务操作。

5、底部布局的标签导航：这是最为常见的导航模式，一般而言是一个icon+文字描述 ； 纯icon形式的底部标签导航也有，但使用起来容易误导。所以大部分产品的一级导航设计，都有一个文字说明。总结这种导航的特点是：占用面积较大，用户能够轻松进行点击，一般不超过5个标签。

6、APP导航设计类型：列表式菜单 矩阵、网格式菜单 底部菜单 顶部菜单 扩展菜单 列表式菜单 列表式菜单设计这个从网站到手机APP上都很常用的，遵循由上至下的阅读习惯方式，所以使用起来用户不会觉得困难。另外我们可以通过漂亮的配色、 图标 组合来设计，使得菜单更多加美观。