当前位置: 首页 > 图文教程 > 网页制作 > 心得技巧 > 设计购物车与支付流程的一些想法

心得技巧
IE8 Beta 1两个地方需要大家注意
提高网站性能中内容有关的10条原则
网页设计者应该从三个方面优化网页
Web 设计 实现干净代码的12条定律[图文]
网页设计必备工具 firefox Web Developer插件 CSS工具组教程
UCenter Home 站点添加统计代码
9款很棒的网页绘制图表JavaScript框架脚本
提高网站可用性的10个小技巧
网站维护页面的列表制作技巧
B2C 网站用户体验细节设计参考
收集12个实用的网页在线工具
设计参考 漂亮和原创的博客设计
收集25个知名网站标志中使用的字体
极尽简约的网站设计实例
个性化创意鲜明的网站设计实例(30个)
水平滚动的网站设计 小结
更受欢迎 更具创造性的深底色网页设计实例
有创意的关于我们网页页面设计
整洁漂亮的网页设计的4项原则
设计参考 WordPress建站成功案例

心得技巧 中的 设计购物车与支付流程的一些想法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-01   浏览: 84 ::
收藏到网摘: n/a

对于电子商务网站来说,购物车与支付流程是其中最重要的部分,很大程度上购物支付流程决定了用户的购买概率,所以对于任何电子商务网站来说都不可能不重视这部分的设计。不过对于购物车支付来说我们并不需要完全自己来设计,可以通过研究一些大型网站的购物支付流程来作为参考,思考他们为什么要这样设计,最主要的是亲身去体验下他们的每一步,不断进行摸索,然后将好的部分应用到自己的购物网站上。

下面我为大家分析下12种设计较好的购物车和付款流程:

1. 不要让用户先注册再去选商品。

顾客们是来买东西的,不是来填表单的。所以需要确保用户在付款过程中完成了注册,而不是付款前就去注册,也不是让用户把商品放到购物车里之前去注册。注册表单的需要用户花功夫去填,注册过程中还可能有问题,所以这会成为用户顺利完成购物的障碍。

Taget这个网站就是当用户真正要把钱付了的时候,才让他去注册的。

在购物流程中,把注册这个麻烦往后面移,能使最后购买商品的用户大大增加。用户既然一开始就花了很多时间选购他们想买的东西,那如果在付款的时候因为注册麻烦而离开,前面选购商品花的时间久白费了。但如果用户还没开始选商品酒让他去注册,这时,他们还没花时间成本,就更容易选择离开。

2 如果这个商品有货,明确地告诉用户

对商品有的库存数量需要明确地告诉用户。如果商品没货了,要早些让用户知道,避免用户购买时往后操作了好几步才发现原来商品没货了。不仅要在商品介绍页面显示库存数量,在用户搜索商品的结果页面也要显示出来。

Overclockers 在商品列表中,就列出了详细的库存数量信息。

另外,如果某个商品现在缺货,但最近就会进货了,可以提供给用户一个预定的功能,这样不急着买这个商品的用户,过几天来就可以买到了,他也不用担心过一阵子来买时,商品又售空了。

3. 让用户很方便地修改订单

每个人都可能出错,用户有可能在购物车里放错了商品,或者要付款的时候改变主意了。这时,要让用户在付款的过程中能修改他们购买的商品,如果不能修改他们可能就离开了,而能修改的话,就赢得了许多潜在用户。



IconDock 就让用户通过输入框中的数字,很方便地修改购买的数量。

如果用户想把商品从购物车中删掉,不要让他们在输入框中输“0”这个数字来删掉。还是提供“删除”这个链接比较好,通过点“删除”,可以让他们把商品从购物车中删掉,这样修改既快又简单。

4. 在用户操作过程中,提供给他们实时的帮助

因为付款过程需要用户输入信息,而用户很可能在这个过程中碰到问题,这些问题不一定能靠有限的几个界面来解决。这种情况下,提供给用户专业的,一对一得帮助,要比给他们一个宽泛的帮助(比如“常见问题”的页面)好很多,类似“常见问题”的页面不一定能解决用户碰到的问题。

在“戴尔”的购物网站上,用户就可以通过咨询电话和在线客服获得帮助。如果用户在付款过程中碰到了问题,她可以立刻咨询客服获得帮助,问题几分钟内就轻松解决了。

在用户付款过程中,提供在线客服或电话咨询的帮助是个非常好的主意。不过不是所有公司都能负担得起那么多客服成本的,大中型公司可以考虑这个方法,特别是那些网上付款流程比较复杂的公司。

5. 使“返回”按钮充分起到作用

“返回”按钮是网页浏览器中最常用的按钮之一,所以许多用户可能在付款过程中也会经常用到。一些网站不提供返回上一页的功能,当用户点“返回”时,页面会自动重新指向某个页面或是报错,这样会对用户的体验造成负面影响。

Ticketmaster 中,点“返回”按钮出现这样的报错,就会让用户有受挫感。

当用户点“返回”按钮时,不仅不能老让他们碰到出错提示,而且如果前一页是表单的话,要保存他们之前填的数据并再次显示给他们看。这样用户只需要在原来填的内容上做修改,而无需重新填写整个表单。的确,有些情况下,用户点“返回”已经为时已晚,比如他点了“确定支付”的按钮。不过别的一些页面都能支持“返回”按钮的话,既节省了用户时间又减少了他们的挫败感。

亚马逊网站,说明了商品的颜色和详细情况,比如精装书/平装书,还提供链接返回查看原商品详细信息。不过他没有提供商品的缩略图。

Oxfam 提供了每件商品的缩略图,让用户能快速浏览。另外,如果用户想确认这个商品是否确实是自己想买的,还可以通过链接返回原商品介绍页面。

7. 提供操作流程的指引

付款通常是一个包括多步操作的流程。这意味着用户完成支付前会经过好几个页面。所以最好加一个操作流程指引,告诉用户他们现在的位置,即他们目前走到付款流程的哪一步,哪个页面上了,以及离完成过程还有哪几步。

苹果网站在所有付款页面上,都放了一个简洁的流程指引。

让用户知道自己在流程中的哪个位置,会给他们一种控制感,从可用性角度来说,这是很有必要的。当然,让用户知道后面还有哪几步操作,就可以完成了也会减少他们的疑惑。这样他们在完成付款前,根据自己的情况和想法,来调整或取消订单的自由度更大。

8.付款界面保持简洁

付款过程和网站上浏览型的网页不同。在付款过程中,用户并没有在购物。这意味着所有的浏览型操作在这里都是多余的,这只会分散用户的注意力,影响他正在完成的任务。设计时,要把那些不需要的元素去掉—比如,商品目录链接,热销商品推荐等,使界面保持简洁。

戴尔网站的付款页面,就没有商品的目录链接,而是让用户把所有注意力放在付款流程上。

有时用户会返回,再买一些商品,再来付款,所以需要提供一个“返回继续购物”的链接。另外,要确保所有指向“下一步”的按钮都大一些,避免用户找不到。

9.不要让用户离开付款流程

用户在付款过程中不要被打断很重要,比如,把用户引到一个和付款不相关的页面。把用户带离开付款流程会有以下两个问题:1)他们会搞不清自己究竟在哪里,甚至有可能付款的页面找不到了 2)他们可能会因为被打断而没有成功完成整个付款流程。

Laskys 网站的付款页面上,当鼠标悬停在某些元素上,会有帮助信息弹出告诉用户相关的功能说明。

不能打断用户付款流程,那么我们要找到一个方法显示不要的信息。如果需要提供一些帮助信息,而这些信息又不适合在当前页面上显示,可以考虑通过浮动窗口或弹出窗口显示。

10. 告知用户商品配送时间

线上购物比起实体店购物,有个较大的弊端:用户需要等待几天才能收到购买的商品。所以当用户购买成功后,需要告诉他们大致需要等待的时间。

苹果网站会根据不同用户的订单显示相应的送货时间。

告知用户商品配送时间有以下几个原因:首先,用户要确保快递公司送货上门时,家中有人收快递。其次,这样用户会对货什么时候到有个心理预期,而不用老担心买的东西怎么还没送到。送货时间显示得越早越好,最好在商品介绍的页面上就显示。这样的话,想购买该商品的用户,就能根据商品送到时间是否能满足需求,来决定他们是否购买。

11.告诉用户之后会发生什么

当用户完成了商品购买,并点击了最后一步操作的按钮后,接着会出现什么?以“感谢您购买本商品”为结束语。这对用户来说,是一种礼貌的表示,而用户也一定很乐意接受这些体贴的话。

亚马逊网站,在用户付款完成时,就会显示:感谢您购买了此商品,并且告诉用户接下去可以做些什么。

另外,还要告诉用户接着还会发生什么——比如,当商品发货时,他们会收到一封邮件通知。这会消除用户对订单是否真正成功购买的不确定,他们安心。

12 发一封确认邮件

用户可能完成了商品订购并付款了,但其实还没结束。网站需要发一封确认邮件,告知用户购买商品的详细信息和送货到达的时间。这个信息还是很有帮助的,因为这让用户再次确定他们没买错商品,比较安心。

亚马逊网站会在用户付款后,发送关于购买的商品详细信息的邮件,并告诉用户如果买错,如何在商品发货前修改。

如果用户买错了商品,在商品发货前,需要提供给他们重新登陆并返回修改订单的机会。简单的出错,比如选择错了尺寸,颜色,经常会发生,所以网站需要让用户感觉在线上购物既简单又可靠。