数据正在读取中...

您的位置: 设计资讯 > 网站设计

网站设计:别把面包屑复杂化

www.shejinet.com 2017-11-24 21:57 设计.世界 浏览(5512)

摘 要:面包屑是网站常见的一种导航工具,一般出现在网页内容的上方,告知用户所处的位置。它的设计和作用都非常明确简单,千万别复杂化。

面包屑是网站常见的一种导航工具,一般出现在网页内容的上方,告知用户所处的位置。它的设计和作用都非常明确简单,千万别复杂化。

1.jpg

这样小巧的面包屑,它的作用是什么?

1、减少用户操作次数
从用户可用性的角度出发,面包屑减少了用户跳转高层级页面的操作次数,避免了用户要使用浏览器的返回键以及翻找导航寻找上级页面的复杂交互。

2、占用空间小
面包屑基本上是以链接文本的方式存在的,只有一串一小行的,所占用的空间比较小。

3、面包屑避免了给用户带来困扰
面包屑设计小巧方便,给用户带来的便捷远大于问题和困扰。

2.jpg

但是,当你设计网站面包屑导航的时候,这些点是一定要记住的:

1、别把面包屑替代了主要导航系统
面包屑只是一个辅助的导航系统,是无法替代主要导航系统的,它的存在是用于抵达其他层级的快速定位链接系统,是协助用户方便选择的次要选项。

2、别把当前页链接加到面包屑中
面包屑的最后一个层级是当前层级的页面,而这一项在面包些中是不应该加上链接的,它只是起到展示定位的作用,添加链接是没有意义的。

3、分隔符的使用
一般面包屑的分隔最常见的就是">",例如:“公司介绍>公司基地”。当然了,分隔符是没有硬性要求的,还有设计师使用“→”、“》”或“//”的,这个要看设计师的喜好和网站的风格。

3.jpg

4、合适的尺寸和间距

在设计的时候要结合网站的页面空间大小,毕竟不能占据太大的空间页面,所以保保证面包屑的大小尺寸,毕竟也不能做得比主导航还大。另外还要注意层级之间的间距。不能太密也不能太疏,方便、快捷最重要。

5、面包屑不是视觉的焦点

重申一遍,面包屑是一个辅助导航,不是主导航,它不适宜使用花俏的字体和醒目的色彩,它不应该成用户浏览的视觉焦点,这样会显得喧宾夺主。

4.jpg

6、移动端页面就不要用面包屑了

移动端页面本来就很简洁,人们都在试图简化它的页面设计,面包屑出现在页面会显得非常臃肿。移动端网站不仅仅是页面的简化,而是整个系统的简化,不宜太过复杂,也没复杂到使用面包屑来引航。

1511531836474548.jpg

数据正在读取中...

[优秀设计师] DESIGNERS

  • 红蚂蚁文化
    地区:天津 • 天津
    QQ:2284475163
    电话:qq2284475163
    邮箱:2284475163@qq.com
  • 博文
    地区:广东 • 深圳
    QQ:705434715
    电话:17875048743
    邮箱:705434715@qq.com
  • 久形设计
    地区:广东 • 佛山
    QQ:2926679497
    电话:18927776245
    邮箱:2926679497@qq.com
  • 蜂鸟创意
    地区:河北 • 石家庄
    QQ:2950464750
    电话:15930133486
    邮箱:2950464750@qq.com
  • 泉榕工作室
    地区:福建 • 福州
    QQ:5758429588
    电话:15980203576
    邮箱:5758429588@qq.com
  • 大巢设计
    地区:山西 • 晋中
    QQ:845183776
    电话:15536393968
    邮箱:845183776@qq.com
  • 邹剑
    地区:广东 • 广州
    QQ:810199288
    电话:18379067575
    邮箱:810199288@qq.com
  • 知鱼工作室
    地区:辽宁 • 沈阳
    QQ:1660150137
    电话:
    邮箱:1660150137@qq.com
  • 创龙轩设计
    地区:广东 • 广州
    QQ:1219427856
    电话:13790850808
    邮箱:1219427856@qq.com

[优秀设计公司] COMPANYS

联系我们| 免责声明| 设计师| 设计公司| 手机版| 设计知识