共享国内外优质资源

【五大大】响应式电商网站导航设计超全面指南

时间: 2017-03-25 13:30:47浏览次数:1455
响应式商务网站的首页导航设计必须本着用户体验为佳的原则,既要将网站中的所有信息都在有限的导航栏中体现,又要为用户反馈出重要的帮助信息。网站因其独特的重要性和不可替代性,在响应式电子商务网站H5设计中日渐凸显出举足轻重的地位。
    伴随着互联网的成长,通过电子商务网站实现商品交易越来越频繁,而来访客户在面对越来越庞大的信息量时会感到迷茫,因此,优秀的响应式H5导航设计能够提高网站的易用性,对实现响应式商务网站的高效运作具有实际意义。

    响应式商务网站的首页导航设计必须本着用户体验为佳的原则,既要将网站中的所有信息都在有限的导航栏中体现,又要为用户反馈出重要的帮助信息。网站因其独特的重要性和不可替代性,在响应式电子商务网站H5设计中日渐凸显出举足轻重的地位。



    1、符合网站内容结构

    在设计电商网站的导航之前,事先应该对网站整体的内容有一个全面的了解,并且将网站内容进行归类。这里涉及到的一个问题就是,无需把所有的板块都在导航上一五一十的展现出来。电商网站普遍有两个导航,分别是网站头部的总导航和侧边的分类导航。一般来说,总导航会比较笼统的展示网站商品,而分类导航则会比较详细。总导航的内容过多无论在体验还是视觉上,都会有拖泥带水的感觉。如下图案例,当当网的总导航分类就显得比较复杂琐碎。

    另一方面,导航中显示的内容应该与网站内容是紧密相关的,这也体现了导航与内容的匹配度。

    这其中牵涉到了导航中或导航周围出现的广告,正如当当网案例所示,导航周边融入一些广告无可厚非,运用的恰当不仅不会遭到用户的反感,相反还能提升用户的满意度,但需要注意的是应该尽量避免与本站内容无关,并且广告成分过于明显的一些内容,过量的无关内容势必会让用户感觉在购物时受到干扰。

    2、结合网站业务目标

    首页中的导航就是网站当下情况的一个缩影,用户通过导航就能大概的了解到网站销售哪些商品。

    因此,导航很有必要随着网站主营商品的变更,或是根据商品销量而变化,让呈现在用户面前的导航始终与网站本身内容以及时下热门很贴合。(例如优设网的顶部导航,就挑选了最实用的设计师网址导航以及大牛云集的设计讲座,强烈推荐同学们收藏起来)在电商网站的运营过程中,许多问题会逐渐的浮现出来,所以网站改版也是无法避免的过程之一,但在改版之前,应该先列出所有的问题,再思考这些改动能否真正解决问题。

    设计师在不同项目的设计过程中,单从过程来说基本上大同小异,但至关重要的是,每一次网站设计会根据客户不同的业务需求而产生不同的设计目标,当你心中一旦有了这个目标,就应该时刻提醒自己,你的设计无论多么花哨或是简单,都必须把这一目标完完整整的体现出来。

    唯品会在目标的体现上还是比较明显的,把自家主营的商品栏目种类,包括近期的活动用最清楚的方式展现出来,很有效的减少了用户思考的时间,让用户在最短的时间内为自己的点击做出决定。

    3、遵从用户使用习惯

    根据用户的使用体验和感受来设计网站是必然的,但往往有很多设计师会用周围同事的意见代替大部分用户的意见,这一点是非常不可取的。在做导航设计的时候,设计师应该把使用对象都看成是新用户或是没有耐心的用户,尤其是电商网站,在第一时间就要满足用户的需求,尽量削弱导航的学习性,比如鼠标悬停的分类打开方式就可以很大程度上的降低用户的学习成本。

    用户在页面停留的时间都是按秒来计算的,因此,导航必须一目了然,让用户产生依赖感。这里还要说一点,当网站决定改版的时候,导航尽量不要做很大的改变,因为导航是整个网站中比较重要的组成部分,也是用户相对比较依赖的一个模块,一旦导航有了很大的变化,会让用户在无形中产生一种陌生感和距离感,新的技术只用在无关痛痒的地方。

    关于用户体验,这里还有小细节可以和大家分享。当用户的鼠标从一级导航移动到二级导航的瞬间,有时会因为移动角度和时间上的偏差,无意悬停到下面的一级分类中。虽然只是一个不经意的小细节,但这会让一些不耐心的用户非常恼火。根据我们的初步调查,目前市面上比较主流的电商网站在这一点上都做得比较合格。

    另外,亚马逊的网站过于“简洁”,导航的底色与网页底色,以及导航的字体与网页的字体都过于相近,这在查看的某一瞬间会造成用户的视觉混淆。

    4、使用合适的文案

    为了迎合用户在导航上只愿意停留短短的几秒钟,导航文字内容的可用性就变得至关重要。文字标签是传达信息最有力的途径,因此,导航中出现的文案应该避免使用一些用户很难理解的词汇,比如专业术语、缩写和个性化语言等。其中最常见的就是缩写,很多电商网站会由于排版美观,或是文字长度上的限制而选用缩写,从而牺牲用户体验,增加了用户对导航的理解难度。

    在电商网站导航中,文案的首要任务就是让每个用户都能准确快速的理解相关信息。而作为设计师,我们理所当然的花费许多时间一味的专注于视觉美学,这是几乎所有设计师的通病,但这一通病在导航设计中却成了致命伤。清晰明了的表达是美观的前提,任何交互项目的最佳状态就是实现透明化。

    5、清晰的视觉体验

    从视觉角度上来说,用户只用几秒钟的时间扫视网站,所以导航的视觉设计必须符合逻辑,用色彩给用户提供一种指引,成为用户点击的向导。可点击的部分尽可能的明显一些,减少用户对其的猜测。在色彩的使用上应避免大片亮色,这会间接地降低导航文字的可识别度,与此同时,电商网站面向的是所有的消费者,因此,在导航与导航文字内容的色彩搭配上也要考虑到一些色彩障碍者。

    京东的网站在这一点上做的还是比较好的,每一个层级的导航颜色由深及浅,让用户有一种循序渐进的感觉。整个导航区域的色彩搭配也很恰当,无论鼠标悬停在任何地方,所在的位置都能反应出一个比较舒适的页面。

    总之响应式商务网站的导航设计还是应该本着用户体验为佳的原则,既要将网站中的所有信息都在有限的导航栏中体现,又要为用户反馈出重要的帮助信息。
想要效果 就要行动
速度联系国民建站优选品牌五大大

现在填写 送好礼

智慧建站新选择,网络营销好伙伴

有颜值 会销售 ,一切用效果说话

国民建站优选品牌五大大

助您成功跻身明星企业及实力网商行列。

五大大建站免费咨询热线
0755-82819113
在线QQ咨询
QQ:125667200
思安股票_股票配资,配资炒股,配资平台,配资官网,股票配资网站,股票配资门户...