网页导航设计

01 导航的作用

导航便于用户在网站中快速查找到所需要的内容。

1. 引动用户查找信息，通过主导航、次导航，以及 分类 便于用户 快速找到 自己所需的东西。
2. 清晰整个网站的 目录结构 和链接间的关系，层次结构分明，便于访问者理解。
3. 导航容易形成地图的作用，让用户 了解网站结构 和定义网站整体的构架和网站方向指南。

02 常见的导航类型

• 横向导航
  建议导航数目 5±2，太多会不好看。

• 纵向导航
  对比横向导航细细的一条，需要适当拉宽一点，为了美观。宽度200px左右。

• 折叠导航
  占用页面空间小，交互效果强，可单独展开，也可局部展开。

• 面包屑导航
  作为辅助导航，在制作网站内页时经常使用，可以知道是从哪里跳转过来的。

• 混合导航
  两种以上导航同时存在。通常大型信息类、电商类网站使用较多。

• 图片导航

• 全屏页面类导航
  导航融合在全屏幕中
  点击

03 导航常用的设计规范

1. 网页中最小字号为12px，导航文字一般为14-20px之间，导航栏尺寸一般为80-100px
2. 一般网页尺寸宽度1920px，导航在有效区1200px内
3. 全屏页面类导航多为自适应网站，有效区可留可不留