Bricks Planet
返回砖块库

Brick Card

Form Error Recovery 表单错误修正路径

表单错误修正路径就是别只告诉用户“你错了”,还要告诉他错在哪里、怎么改、改完怎么继续。它像给失败提交铺一条回路,让用户从错误汇总回到字段,再回到提交动作。

关键结构图

用自己的话表达讲给别人听卡住补理解
重新讲一遍

表单顶部错误汇总连到两个字段错误,每个字段再连回提交按钮。

What

Form Error Recovery 是表单提交失败后,帮助用户找到、理解并修正输入问题的方法。

Form Error Recovery 表单错误修正路径连接字段级错误、错误汇总、组件状态、焦点跳转和重新提交。它把一次失败提交变成可恢复的流程。它的边界不是“出现一条错误文案”这么简单,而是用户能从失败状态定位问题、理解原因、完成修正并继续提交。

StructureForm Error Recovery = 识别错误 + 定位字段 + 修正提示 + 重新提交

When

当表单包含多个字段、校验规则、必填项、格式限制或提交失败风险时,需要设计错误修正路径。

How

提交失败后,在表单顶部提供错误汇总,在字段附近提供具体错误提示,用状态标记问题字段。修正后允许用户继续提交,并避免重复提交。

Examples

报名表缺少邮箱和手机号。页面顶部列出两个错误,每条可跳到对应字段;字段旁写清楚该怎么改。

支付表单卡号格式不对。错误提示应该靠近卡号输入框,并说明需要多少位数字,而不是只写 支付失败。

来源

类型:可访问性规范 / 表单设计实践

事实线:GOV.UK Design System 同时提供 error message 和 error summary,用于说明字段错误并在页面顶部汇总需要修正的问题;WCAG 要求输入错误能被识别并向用户说明。

依据:GOV.UK Error Message、GOV.UK Error Summary、WCAG Error Identification。

边界:适合有输入、校验、提交和修正的表单流程;不等于普通错误提示,也不等于只把按钮变红。

常见误读:不要只在提交按钮旁边写“提交失败”。用户需要知道具体字段、错误原因和修正方式。