网页中为你指路的面包屑到底应该如何使用?
2017-11-29 13:40:35 来源:易采站长网友投稿 作者:admin
编者案:里包屑是我们生知的一种导航东西,它们常常呈现正在页里内容的上圆,见告您所处的地位。它玲珑,便利,常睹,且简朴。但是即使是那样的UI控件,正在设想上一样是有讲求的,明天我们便去聊聊里包屑吧~
做为一种帮助导航体系,里包屑可以协助用户明晰的定位到本人地点网站的地位。那个词源自于童话中随着里包屑回到本人家的孩子,而网页中的里包屑也是协助用户找到本人地位的UI控件。

里包屑经由过程途径展现见告用户他们所处的地位,现在天的那篇文章将会讨论一个可用的网页里包屑该当怎样设想,经由过程最好理论展现里包屑的准确用法。
里包屑导航供给可用性
做为一种视觉指引,里包屑为用户提醒出网页的条理构造,也恰是因而,里包屑成了用户理解网站布景疑息的主要路子,协助用户理解以下成绩的谜底:
·我正在那里?按照全部网站的条理,里包屑能让用户晓得他们所处的地位。
·我借能来那里?里包屑提拔了全部网站的可查找性,里包屑的存正在提醒了全部网站的构造,用户也随之大白网站借有哪些其他的部门。
·能否该当阅读更多?里包屑提醒出网站有更多值得探究的内容,鼓舞用户阅读更多。反过去,里包屑的呈现低落了网站的跳出率。
削减操纵次数
从可用性的角度上去看,里包屑削减了用户跳转到下层级页里的操纵数,那样制止了用户利用阅读器的返回按钮战翻找导航寻觅下级页里的庞大交互。
占用空间小
里包屑那种设想元素正在页里上占用的空间相称小,它根本皆是以带链接的文本的情势存正在的,而且凡是只要一止。
里包屑没有会给用户带去搅扰
那个小小的设想元素占有的空间没有年夜,可是给用户带去的便利近弘远于能够带去的成绩战搅扰。
甚么时分利用里包屑?
能否要正在网站中利用里包屑,次要与决于网站的构造。看看您的网站舆图大概团体的构造图,阐发利用里包屑可否进步用户正在网站内部差别种别、目次下导航能否便利:
·当您的网站内具有分类明了、构造明白的多条理线性构造的时分,您该当利用里包屑。好比一个具有品种繁多产物的电子商务网站,里包屑便相称有效。
·当网站没有具有逻辑明晰的条理构造的时分,便没有要利用里包屑。
里包屑的范例
里包屑是基于网站的逻辑构造而存正在的导航组件,它能够基于地位、途径去展现,也能够基于属性而存正在。
基于地位的里包屑
基于地位的里包屑设想凡是皆能很好的反应网站的构造特性。它们间接将网站的条理构造展示正在访客里前,此中包罗多个层级(级别凡是超越2层)。那种层级展现性的里包屑关于从内部滥觞(好比搜刮引擎)进进网站的用户而行,具有较着的指引性做用。

正在上面 BestBuy 的页里中,里包屑将产物地点页里的层级干系展示了出去。

基于途径的里包屑
基于途径的里包屑凡是也被称为“汗青脚印”,它展示出去的并不是是网站构造,而是访客到达特定页里的完好途径。那种里包屑途径并不是是静态的,而是静态死成的。基于途径的里包屑偶然候会对用户有所协助,可是有的时分借是会让用户感应利诱——有的用户阅读网站的时分阅读途径过于天马止空,那种基于途径的里包屑会协助他们记载,无需翻看汗青,也没有无需利用阅读器的返回按钮去返回特定地位。别的,那种基于途径的里包屑关于一次便到达特定地位的用户而行毫无用途。
上面便是利用基于途径里包屑去导航的案例战本理阐明:

基于属性的里包屑
那类基于属性的里包屑常睹于电子商务类网站,产物经常基于种别战属性而构造到差别的子目次中,基于属性的分类让用户更简单了解产物战产物之间的干系,供给了更多差别的阅读途径。

便像 TM Lewin 的那个页里,里包屑展示出的是特定页面临应产物,而产物是根据某个属性去构造的:

层级借是汗青?
按照实践经历,尽年夜大都的状况下,里包屑借是合适展示层级机构而非阅读汗青。因而,基于地位战属性的里包屑使用愈加普遍,基于途径的里包屑相对少睹的多。
里包屑导航最好理论
当您开端设想里包屑导航的时分,该当服膺上面的工作:
1、没有要利用里包屑去替换网页次要的导航体系
里包屑只是一个帮助导航体系,它没法替换次要的导航体系。请记着,它是仅仅是为了用户便利的主要选项,用去到达其他层级的快速定位链接体系。

2、没有要将当前页链接减到里包屑中
里包屑的最初一个层级是当前的页里,而那一项正在里包屑中是不该该减上链接的,果为它只起到展现定位的做用,出有任何意义。
3、利用分开符
正在里包屑中,用去分开差别层级最多见的是年夜于标记(>),常睹的利用办法是“女种别 > 子种别”。固然,分开符的利用其实不拘泥于那一种,有利用箭头(→)的,借有利用书名号(»)的,也有利用斜杠(//)的。利用哪一种分开符凡是与决于团体气势派头战设想师的爱好。


4、挑选适宜的尺寸战间距
正在设想的时分该当认真思索尺寸战距离巨细,差别的里包屑层级之间该当有充足的间距,确保用户可以辨认。固然您也没有期望里包屑占有页里太多的空间,假如里包屑比顶部导航借要年夜,看起去便十分为难了。
5、没有要让它成为视觉核心
里包屑自己是一个帮助导航,假如利用过于花梢的字体战夺目的颜色,会使得它隐得鹊巢鸠占,过于抓人眼球。它不该该是阅读历程顶用户的视觉核心。上面的里包屑设想其实不好,可是它过分于夺目,以至比顶部导航借能惹起用户留意力。

Google 的里包屑设想其实不抢眼,可是用户仍然可以很好的利用它。

6、没有要正在挪动端页里上利用里包屑
假如您以为本人的挪动端页里上要利用里包屑的话,那便意味着您的挪动端网页设想呈现成绩了:能够是网站太庞大(嵌套层级过深),而那样一去,便没有契合挪动真个利用场景了。为理解决成绩,您该当试图简化全部系统,确保里包屑没有会呈现正在脚机上。
结语
里包屑让用户可愈加便利天阅读全部网站,回溯到下级页里,寻觅相干的产物,它关于全部网站构造是故意义的。它的功用其实不庞大,删减易用性是它的次要做用,以是万万没有要将里包屑庞大化。











闽公网安备 35020302000061号