结账流程设计:步骤、字段与访客结账
结账流程应让顾客知道买什么、总共付多少、怎样收到,以及提交后发生了什么。好的设计还要在地址不适用、支付被拒绝或结果未知时,让人知道怎样继续,而不是只优化顺利付款的一条路径。
本文关注业务信息与交互取舍。衡量阶段流失见结账漏斗,付款选项见支付方式组合;Shopify 的编辑器、扩展与套餐限制由结账自定义承接。
先画出信息和状态,再决定分几页
下面的顺序是编辑检查框架,不要求所有平台按同样页面划分,也不排除钱包跳转等分支。
| 要完成的事 | 顾客需要知道或提供 | 应保留的结果 |
|---|---|---|
| 确认商品 | 变体、数量、当前价格、折扣条件 | 进入结账后仍是刚才选择的商品 |
| 确认交付 | 地址、可用配送、时效与限制 | 不支持的地址明确提示,不给不可兑现的承诺 |
| 确认费用 | 商品、折扣、配送、税费及其他适用费用 | 能解释当前总额,以及地址等输入改变后的差额 |
| 选择付款 | 当前条件下可用方式及必要验证 | 跳转、返回和处理中状态有反馈 |
| 提交与确认 | 付款义务、订单结果、后续查询入口 | 能区分成功、待处理和失败,并有可回查标识 |
一页式与多步骤都可能承载这些任务。减少页数不等于减少理解负担;把很多字段塞在同一页,也可能使错误难以定位。应检查用户是否能看懂、纠正和完成,而不是规定一个通用“最佳步骤数”。
每个必填字段都要有下游用途
建立字段清单,写明谁使用、为什么必须、缺失会影响什么,以及是否可以从前一步复用。联系方式用于订单沟通,配送信息用于履约;营销偏好则不能因为同样是邮箱就与履约需要混为一项。
姓名、公司、地址第二行和电话的必要性取决于地区、地址、承运商及购买方式。不能为了缩短表单删除必要的公寓信息,也不能在没有用途时把所有字段都设为必填。Shopify 的表单说明给出了这些设置及下游影响,平台实现应回到实际配置检查。
标签应说明要填什么,必填和选填要可辨认;格式特殊时提前给出例子。不要只用输入框中的占位文字承担全部说明。填写错误后,保留仍有效且允许保留的信息,让顾客修改出错项,不要求整份重填。
访客、登录与营销同意分开决定
对不依赖账户资格的普通零售购买,可以评估提供访客路径,并把保存资料或创建账户作为独立选择。这是体验建议,不是断言任何登录要求都不合法;B2B 合同价、受限购买或其他身份依赖场景需要相应核验。
若必须登录,应在顾客投入大量填写之前说明原因,检查找回或验证码失败后的恢复路径。账户要求还可能影响钱包入口:Shopify 文档指出,启用结账前登录要求时,在线商店购物车中的部分加速结账选项会被隐藏,不能仅按设计稿假设它们始终存在。
账户注册、接受交易条款与同意营销是不同决定。字段旁的说明和勾选状态应如实表达每一项的用途,避免用一个模糊的“继续”同时代表多种不清楚的授权。
费用和付款义务要在提交前清楚
在顾客能够决定是否继续时,展示已知费用与计算条件。地址尚未确定、无法给最终运费时,说明估算或计算方式;得到地址后更新明细,让人能解释总额变化。不能把必要费用藏进最后一屏,也不能用默认勾选增加顾客没有主动选择的付费项目。
欧盟适用的 B2C 远程合同中,Directive 2011/83/EU 的相关条款要求事前说明含税总价及适用额外费用(第 6(1)(e) 条)、明确下单的付款义务(第 8(2) 条),并最迟在下单流程开始时说明配送限制与接受的支付方式(第 8(3) 条);额外付款应取得明确同意(第 22 条)。这里采用 2026-09-27 合并文本,仅列与本节直接相关的要求,不是完整地区验收清单。
价格组成与购物车承接见购物车摘要,可兑现的时效见配送承诺。无论页面分几步,顾客都应有机会检查并更正交易内容。
失败与结果未知要有不同出口
| 情况 | 页面应帮助顾客做什么 | 不能据此断言 |
|---|---|---|
| 必填遗漏或格式错误 | 指出具体字段,以文字说明问题并允许更正 | 只把边框变红就足够 |
| 地址或配送不适用 | 解释限制,返回修改地址或选择其他可用方式 | 后台有库存就必然能够配送 |
| 支付被拒绝(decline) | 按可披露的结果给出重试或改用其他方式的路径 | 所有拒绝都来自余额不足,或等于拒付争议 |
| 正在验证或结果未知 | 显示处理中、结果查询或安全重试入口 | 没看到成功页就一定没有扣款 |
| 订单已建立、付款待处理 | 明确待完成动作和后续通知 | 有订单编号就等于已收款或已结算 |
“支付被拒绝”发生在付款尝试过程中;chargeback 是持卡人经支付体系提出的争议流程,不能作为同一错误类型。具体机制见支付授权、拒付与强客户认证。重复提交时也不能只换一条提示:需要实际检查是否形成重复订单或重复付款,并让恢复路径与后台结果一致。
把可访问性纳入可操作的检查
W3C 的 WCAG 2.2 相关成功准则提供了明确依据:
- 3.3.1 错误识别:自动检测到输入错误时,识别出错项并用文字描述。
- 3.3.2 标签或说明:需要输入时提供标签或说明。
- 3.3.4 错误预防:涉及金融交易等情况时,满足可撤销、可检查更正或提交前确认机制中的适用条件。
- 3.3.7 重复输入:同一流程中已提供的信息,通常应自动填入或可供选择;必要、安全或失效等情形存在例外。
这些条目不是整站符合 WCAG 的证明,也不自动决定当地法律适用。应另检查键盘操作、焦点、缩放和辅助技术下的完整流程,见无障碍基线。
最终用测试购买任务记录典型地址、设备、支付方式与同意状态下的观察。页面改动后完成率提高,还要结合流量、促销、订单质量和退款变化解释;不能只凭步骤变少,就宣称已经提升转化。