一 .来源:浏览器
面包屑导航(Breadcrumb )这个概念来自格林童话《汉赛尔和格莱特》:架构
好久好久之前,在大森林的边上住着一个贫穷的樵夫,他与妻子和两个孩子相依为命。他的儿子名叫汉赛尔,女儿名叫格莱特。后来樵夫的妻子去世了,他又给孩子们娶了一个后母。后母计划把两个孩子带到森林的深处,而后趁他们睡着的时候跑掉。她说服他们的父亲,在收成很差的时候把他们丢到森林里,这样的话,其余人没必要挨饿.汉赛尔无心中知道了后母的计划,因而偷偷地把一块面包藏在了口袋里。在去森林的路上,汉赛尔悄悄地捏碎了他的面包,并不时地停下脚步,把碎面包屑撒在路上。后母顺利地趁孩子们睡着的时候溜掉了,汉赛尔和格莱特醒来已经是一片漆黑。汉赛尔安慰他的妹妹说:“等太阳一出来,咱们就看得见我撒在地上的面包屑了,它必定会指给咱们回家的路。”可是当太阳升起来时,他们在地上却怎么也找不到一点面包屑了,原来它们都被那些在树林里、田野上飞来飞去的鸟儿一点点地啄食了。故事到此并未结束,但和咱们面包屑的故事已无关系,若是您对结局感兴趣的话,能够参照:学习
http://baike.baidu.com/link?url=Vbd-X1GvQc55zagUuuZ4YHowb5fiH9_cUAykm8vXcWW_haIRHmkJBwfiwAUVyiDS优化
“面包屑导航”这个概念来就是来源于这个童话故事,它的做用是告诉访问者他们目前在网站中的位置以及如何返回。网站
面包屑导航的意义在于明确告知用户目前处于网站的何种位置,方便用户经过该导航快速达到上级页面。搜索引擎
从用户体验角度讲,这种导航的设计是建议在当前窗口打开的,而不是另外开一个新窗口或者新tab。 url
在童话里,面包屑是汉赛尔在进入森林的路中偷偷撒下的,这是一种“历史记录”的应用方式,目的是帮助你追溯来路,于是它应该是一种线性的导航方式。不过在网页的应用中,“追溯来路”这件事浏览器已经作得足够好了,因此“面包屑”慢慢地就变成用来表达内容归属关系的界面元素,也就是咱们常常看到的“主分类>一级分类>二级分类>三级分类>……>最终内容页面”这样的方式。可是通常正常的来说目录结构由3层结构组成。分别是首页>栏目页>内容页。合理的构建目录结构可让用户随时随地的找到本身所在的位置又能保证栏目分类后的各个栏目的权重不至于太分散。同时在许多关于网站用户使用体验的调查报告中也得出超过3次点击访客尚未找到须要的信息,访客就很大的可能性会离开网站。因此,3层目录结构也是浏览体验的须要。设计
一、用户体验方面:
(1)让用户了解当前所处位置,以及当前页面在整个网站中的位置。
(2)提供返回各个层级的快速入口,方便用户操做。
(3)减小返回到上一级页面的点击或操做,不用使用浏览器的“返回”按钮或网站的主要导航来返回到上一级页面;
(4)面包屑有利于网站内链的建设,用面包屑大大增长了网站的内部链接,提升用户体验。
2.技术层面:
(1)不用经常占用屏幕空间,由于它们一般是水平排列以及简单的样式,面包屑路径不会占用页面太多的空间。这样的好处是,从内容过载方面来讲,他们几乎没有任何负面影响;
(2)、体现了网站的架构层级,可以帮助用户快速学习和了解网站内容和组织方式,从而造成很好的位置感。
(3)下降跳出率,面包屑路径会是一个诱惑首次访问者在进入一个页面后去浏览这个网站的很是好的方法。好比说,一个用户经过谷歌搜索到一个页面,而后看到一个面包屑路径,这将会诱使用户点击上一级页面去浏览感兴趣的相关主题。这样,从而,能够下降网站的整体跳出率;
(4)SEO优化相关。有利于百度蜘蛛对网站的抓取,蜘蛛直接沿着那个链走就能够了,很方便;Google已经将面包屑导航整合到搜索结果里面,所以优化面包屑导航每一个层级的名称,多使用关键字,均可以实现SEO优化。面包屑路径,对于提升用户体验来讲,是颇有帮助的。
3. 总体上,对于绝大多数网站来讲,只有面包屑这一种导航机制并不够,但它们用来补充网站的主导航是最有价值的,特别是对于那些层次复杂的大型网站,或者须要绑定一堆子网站的时候更加有用。
4、适用条件
虽然眼下不少网站都流行使用面包屑导航,可是并非全部的网站都适用。
符合下面两个条件的网站才适合使用面包屑导航。
一、层级较深的网站,面包屑导航适合层级较深的网站,若是只有一级分类的话,经过主导航就能够起到快速定位的做用。好比“豆瓣网”类型扁平构架的网站就没有使用面包屑导航。
二、独立不交叉的网站结构,因为面包屑网站导航路径是线性结构的,所以网站内容必须划分的很是清晰,且不存在交叉;不然,面包屑导航的路径就不是惟一的,同一分类可能出如今不一样的路径中,让用户感到困惑。
5、如何进行优化
1.面包屑导航通常都在导航的下面,形式通常为首页 > 一级目录名称 > 二级目录名称 > 目前位置,尽可能要把面包屑导航的层次控制在四层之内,这样也有利与搜索引擎蜘蛛一层层往下爬,到了四层如下就很难爬到了。
2.对于一个网站来讲,内部链接的结构搭建很是重要。像金字塔同样,第一层的众多页面应该集体支持它们的上一级。因此面包屑导航应该显示网站的层次,而不是浏览历史。除了层次之外,面包屑导航还可能显示的是属性标签。
3.面包屑导航的连接和别的同样,要使用文字,不要使用图片或JS。
4.面包屑中尽可能出现关键字,能够把“首页”这一类词换成网站名称,要注重细节。