1、固定的导航栏
一般多用于移动端界面
站在产品角度上,是否是产品品牌的推广
在用户角度上,这些功能是否随时要用到
在优先级上,需考虑这些功能是否是用户也随时关注的,如消息提示
![](https://img.haomeiwen.com/i3422723/16037ffc46c796a0.png)
![](https://img.haomeiwen.com/i3422723/6124b00508366a6b.png)
2、大面积块状导航栏
图片充实,杂志风格,一般出现在内容图片丰富的大型网站上,便于分类,也可以突出产品
![](https://img.haomeiwen.com/i3422723/1a3c87227505d02b.png)
其他相关
HASSYADAI
新百伦
迪士尼
FIT
ACSL
WYZdesign
京东
亚马逊
H&M
Dior
3、通用导航栏
多种产品的媒体网站
迪士尼
![](https://img.haomeiwen.com/i3422723/c28bcb3051f5bfca.png)
4、垂直滚动
新颖,设计难度大 设计网站
muuuuu.org
![](https://img.haomeiwen.com/i3422723/4bfc3a9db717baff.png)
5、全局隐藏性菜单
节省空间,小屏幕
星巴克
![](https://img.haomeiwen.com/i3422723/78112256273c3029.png)
6、响应式子导航栏
隐藏内容,点击才出现
![](https://img.haomeiwen.com/i3422723/2f8ae5cd3d5e3ead.png)
![](https://img.haomeiwen.com/i3422723/1caf998a924c20ad.png)
![](https://img.haomeiwen.com/i3422723/b0eec2292de8b049.png)
7、文章摘要展示栏
实时展示,博客
纽约时报
![](https://img.haomeiwen.com/i3422723/f82a7241769904c2.png)
8、表格目录的运用
解救长文章、榜单类内容尤其适用
维基百科
![](https://img.haomeiwen.com/i3422723/ab916f6b6037aca6.png)
9、使用全大写字母
无衬线,大间距,浅色,小字号
KAMEDA&CO
![](https://img.haomeiwen.com/i3422723/d81cb808464990bd.png)
其他相关
GREATIVE APPLICATIONS
DERTURE
10、单页设计,点点代替导航栏
多用于扁平化的小网站,一个点表示一个页面
网友评论