遂昌网站建设:如何设计完美的结账表格

2019.07.26 mf_web

151

毫无疑问,结账体验是任何在线商店最重要的方面。它的设计与电子商务网站的转换直接相关 - 您的结账表格越快越方便,转换率就越高。


作为一名用户体验设计师,您的工作就是确保结账体验的无缝和高效。在本文中,我将分享十个非常实用的技巧,这些技巧将帮助您实现出色的结账性能。

1.不要强迫用户创建帐户

根据Baymard Institute的说法,创建帐户的强制性要求是人们放弃购买流程的主要原因之一。不要犯这样的错误!允许用户购买而无需创建帐户。它不仅必须提供客人结账选项,还要使其清晰可见。Baymard Institute发现,88%的移动结账表单无法使客人结账选项清晰可见,因此用户经常会忽略它。

用户应始终可以看到标签。

用户应始终可以看到标签。图片来源:MDS

4.设计单列表格

在多列形式中,眼睛遵循之字形扫描,这使得用户更难以专注于某些元素(眼睛不会被固定在某些元素上)。结果,多列表单增加了完成时间。当表单由一列组成时,这使用户更容易扫描它 - 眼睛遵循垂直扫描模式。

5.将相关信息分组在一起

如果一次性显示太多信息,这对您的用户来说可能是压倒性的。分块技术可以帮助您提供相同数量的信息而不会超载它们。有两种类型的分块:

  • 页面上的分块字段。您可以将相关信息组合在一起并按逻辑顺序排列。

多步结账流程

多步结帐流程:表单清楚地表明用户当前处于什么阶段。图片:Murat Mutlu

提示:对于多步骤结帐流程,必须确保后退按钮行为符合用户期望。用户希望后退按钮向后退一步(他们认为是他们的上一页),而不是一直回到产品页面。第二种行为通常伴随着数据丢失,因此很容易导致结账放弃。

6.帮助用户填写地址

努力减少打字的需要。当用户开始键入地址时,您可以使用自动建议和自动完成的机制。服务,如谷歌的地理位置搜索让您根据字母的几个打字填写的地址。同时,您应该将预填字段设置为可编辑,以便用户可以更改其中的信息。

提供不同的付款方式,并设计完美的信用卡表格

沃尔玛允许使用信用卡,礼品卡和许多其他流行的选项(如PayPal)付款。

在许多支付选项中,信用卡仍然是最常用的一种。确保结帐表格针对使用信用卡购物进行优化至关重要。以下是一些需要记住的事项:

  • 告知用户可接受的卡类型。您可以将此信息作为一行提供支持的发卡机构的图标。如果您的支付系统不支持某种类型的卡,请在用户开始输入卡号时告诉用户。

  • 根据输入的第一个数字显示卡片类型。前六位数字标识用户卡的确切发行者。将发卡机构的标识放在现场以向用户提供系统已识别其卡的视觉反馈也是很好的。

  • 使用占位符文本作为卡过期日期。这将帮助用户以有效格式输入数据。

  • 当您要求提供“安全代码”时,请提供客户可以找到的提示。这可能与“?”类似。该字段旁边的图标,当用户单击/点击该图标时,该图标会显示包含信息的弹出窗口。请记住,“安全代码”并不统一 - 不同的发卡机构使用不同的命名,位置和长度(例如,VISA的安全代码位于卡的背面,由三位数组成,而对于AMEX,它位于正面并包含四位数字)。

银行卡详细信息表格

银行卡详细信息表格,满足上述所有要求。图片来自Dmitry Kovalenko的Fluix

8.提供摘要

在购买之前提供订单摘要至关重要。此功能允许用户查看订单详细信息和选定的交货选项,仔细检查开票和发货信息,并在必要时进行所有必要的更正。

设计“快速购买”功能

亚马逊的1-Click购买功能允许用户几乎立即购买该产品。将从客户的数据中使用有关首选送货方式,地址和付款详细信息的信息。

10.提供在其他设备上完成购买的选项

当用户开始在移动设备上浏览产品时,这是非常典型的情况,但是当填写结帐表单时,他们会切换到桌面。当用户转向桌面时,他们应该可以从移动设备上继续使用。允许他们通过提供“通过电子邮件发送您的购物车”选项来实现这一目的。

结论

在结账过程中,您的最终目标是提高成功率(让用户转换)并减少完成时间(允许更快地完成)。买东西越容易,人们就越有可能做到这一点。

联系电话 400-6065-301

留言