当前位置:首页 >  站长 >  搜索优化 >  正文

电子商务网站设计分析之四:面包屑导航

 2015-07-28 17:07  来源: 互联网   我来投稿 撤稿纠错

  【推荐】海外独服/站群服务器/高防

网站中的面包屑导航(Breadcrumb Navigation)导航是一种作为辅助和补充的导航方式,它能帮助用户明确当下所在的网站内位置,并快捷返回之前的路径。

面包屑的由来出自一个童话,两个孩子为了不在森林里迷路,于是沿途洒下了面包屑作为标记,帮助自己能够原路返回。通过这个故事我们可以看出,之所以被称为面包屑导航,正是因为它在网站中也起了相同的作用,让用户既能看清自己在网站中所处的位置,也能快速的找到其他同类型产品。

一个小小的面包屑是最能体现网站用户体验的部分之一。电商网站的子页面数不胜数,而面包屑是指引用户的一盏明灯,由此可见面包屑导航对于用户浏览的重要性。

1.关键词统一,避免用词重复

面包屑导航的存在就是为了让用户能最直观的了解自己所处的位置,因此,用词精简直接并且唯一,是面包屑必须遵守的原则。也就是说,每一个产品页面都有属于它的唯一导航,这样能减少用户在购物时产生的疑问。在用词方面也要尽量避免有歧义的用词,京东的面包屑导航在这方面做的就不够好(如下图)。

一级分类和二级分类分别为“家用电器”和“生活电器”,这两个含义相近的词汇增加了用户的思考时间。因此,近义词和平级词汇应该在面包屑中尽量避免。

淘宝网中的面包屑就相对直观。从“所有分类”到“女装”再到“羽绒服”,每一个大分类都没有重复性,让用户能在第一时间做出反应。

2.显示层级页面的产品数量

用户使用面包屑的目的主要有两种,一种是想要返回上级,第二种就是查看页面中展示产品的类型。在用户的实际操作中,这两种需求的重要程度不分上下,但是大多数电商网站都忽略了后者。其实,这方面的改善并不困难,只要在层级页面的分类中展现出商品的数量,用户就能很清晰的看到所需商品的种类数量,便于用户挑选。

优购时尚商城的面包屑导航就注意到了这方面的小细节。系统会根据用户对条件的筛选自动抓取商品种类的数量,让用户根据商品的实际情况进行选择。

3.分类少也能使用面包屑

传统意义上都建议当网站的层级分类很多的时候可以使用面包屑,如果网站分类较少就可以省去这个部分。但笔者认为,面包屑还能有助于用户明确产品定位。当用户对产品没有目标性时,定位式面包屑就能让用户拥有更加顺畅的购物体验。

聚美优品的商品分类其实并不算少,但他们仍然选择使用定位式的面包屑设计。设计师将产品大分类和用户容易更改的部分做了一些小间隔,便于用户对条件进行修改。

4.使用具有指向性的符号

面包屑的从用户体验上来说是一个“重要的小角色”,既要让用户看得清楚,又不能太醒目,因此,在色彩上主要以黑、灰为主,形状上可以采用单独连接符号,多考虑关键字之间的包含关系,并且具有指示性。

亚马逊网站的面包屑在符号上用户体验很不令人满意,“:”既不能明确的显示出字词之间的概括性,指示性也远不如箭头那么直接。

而魅力惠的面包屑符号就满足了所有的标准,符号颜色和字词相同,大小也很适中,让用户在有需要的时候能马上找到它,但又毫不耀眼。

5.降低干扰

面包屑导航的设计应该始终遵循这样一个经验法则:它不应该抓住用户的注意力。一个称职的面包屑一定不能起到主宰页面的作用,低调的扮演着协助主导航的角色,让用户在购物时完全不受到它的干扰。

银泰的面包屑设计不像大多数网站选择全透明背景,而是使用了与周围背景色很相近的灰色。这种做法很容易让面包屑就此融入全局中,不产生用户使用时的任何困扰。

6.避免重复主导航的形式

现在的电商网站都很热衷于在小细节上做文章,他们的出发点是希望在细节中体现出优良的用户体验,就比如在原本简单的面包屑中添加下拉菜单。网站方认为这样做能让用户在更短的时间内找到自己需要的商品,但其实意义并不大。

以一号店为例,电子商务网站的主导航基本都有下拉扩展分类的功能,所以,面包屑导航如果也采用相同的形式就会变得很重复,而在实际功能上其实差异也不大。

京东的网站就避免了这一点,主导航是常规的下拉菜单形式,面包屑的设计也比较简单明了,没有过多的功能。

7.尽量精简层级

精简面包屑导航层级原因不仅仅为了提升用户体验,也为了利于搜索引擎的抓取。尽量把面包屑控制在4个层级以内,对用户视觉和SEO都有很大的好处。

唯品会的面包屑就显得过于拖沓繁琐了。虽然从分类上来说比较精细,分门别类十分清晰,但是“傻瓜式”的面包屑更适合实际使用。

苏宁易购的面包屑与唯品会的风格就完全不一样,苏宁易购的面包屑默认控制在4层以内,其他的多元化选项在另外一个区域中存在,降低了用户在使用时的受干扰程度。

8.在面包屑中使用关键字

面包屑对于网站的SEO有着很大的影响作用,因此把握关键字的设置也许能为网站带来更多的流量。

正如天猫的案例所示,在面包屑导航的第四层级中,用户可以根据自己的时机需求筛选关键字,让呈现出的产品更加准确。

总结:

笔者认为,面包屑是每个电子商务网站的一个必备模块,用户体验是否过关在这里可以有很好的体现。所有的网站元素可能都讲究创新改变,但是面包屑却始终如一,用最简单的方式来满足用户的浏览需求。

SEO专题推荐:

关键词优化专题:网站关键词优化没效果?来这里学习最实用的关键词优化技巧!

内链优化专题:最能提升网站权重的内链部署优化技巧与方法

外链建设专题:高质量自然外链怎么做?读完这些你将质的飞跃

网站降权专题:2015年最有用的网站降权、被K、被黑、被攻击的解决方法

用户体验专题:学习完这些,作为站长的你可以秒懂如何做网站用户体验

行业网站专题:优化行业网站的“葵花宝典”看完后无优化压力

申请创业报道,分享创业好点子。点击此处,共同探讨创业新机遇!

相关文章

  • 什么是面包屑导航,它对SEO的影响有哪些?

    什么是面包屑导航,它对SEO的影响有哪些?总结:面包屑导航是SEO优化的重要组成部分,但有的时候也可以打破常规,另辟蹊径,比如:利用面包屑导航做自定义内容的相关推荐。

  • 开发一个电子商务网站,需要运用哪些设计原则

    随着目前电子商务网站开发技术的迭代,电商网站的交互设计得到了很大程度的提升,可以认为现在的新型的商城平台都呈现出交互效果。由此可以引发一个思考,电商系统网站开发的交互设计原则、基础是什么?

  • 浅析如何基于用户分析来建设企业电子商务网站

    目前互联网上一个重要的应用就是电子商务,而且电子商务网站种类较多,比如由企业自建的电子商务网站,可以通过这类网站直接购买企业中的相关产品,另外就是各类综合性的电商平台和垂直行业电商平台等。相对于这些电商平台类网站而言,如果运营必须要具备强大的财力支持,而且网站设计和建设团队也相对高端,这不是本文所研

  • 从用户角度分析电子商务网站建设

    无论是哪种类型的网站建设,企业之所以选择利用网站来运营,是因为当前已经是互联网时代,只有更贴切互联网的运营模式才能更接地气,而今电子商务的发展迅猛,对于电子商务网站又要如何建设呢?奇亿网络就从用户需求角度来分析此类网站。毋庸置疑,建设网站的企业首先必须清楚自己的建站要求,对于整个电子商务网站的运作过

    标签:
    商务网站设计
  • 什么是面包屑导航?

    在网站建设和SEO中,面包屑导航的作用就是告诉访问者他们目前在网站中的位置以及如何返回。关于面包屑导航的由来是源于一则童话故事的一个词语:汉泽尔和格蕾特尔两个人在穿过森林是,为了避免找不到回家的路,他们在沿途走过的地方都会撒下面包屑以便于根据这些面包屑找到回家的路。典型的面包屑导航如同:网站首页—频

信息推荐