(翻译)使表单错误消息更令人安心的方法

  填写表单并非总是轻而易举。表单设计得再简单,也会用户会出错。设计人员设计的表单错误消息会让用户感到担心还是舒适?太令人担心的错误消息会使用户放弃填写表单。
  令人安心的错误消息便于用户纠正错误并继续填写表单。以下设计技巧能让错误消息更令人安心,以便用户舒适地完成表单填写。

避免使用否定词

  表单错误消息中不要使用带否定语气的词语,否定词会让用户感觉他们犯了很大的错,使他们认为情况很糟糕。
  用户感觉害怕或忧虑的话,就很难理性地考虑纠正错误。不能把用户吓得明明问题很容易解决却偏偏去找别人帮忙,也不能吓得他们不再想接着填写表单。

在这里插入图片描述
  有很多方式可以告诉用户他们犯了错,同时又不会让他们感觉犯了错。不要强调用户犯了错,使他们把注意力放在自己身上。相反,应告知用户如何修复错误,使他们的注意力放在填写表单上。
  错误消息的语气应该礼貌而专业。消息的用词要能打动用户,令他们安心,不要用否定词。

用橙色或黄色突出错误字段,不要使用红色

  红色是突显错误字段的最常见颜色,它能有效显示错误字段,但也会过度刺激用户,让他们感到紧张,觉得自己填写表单时犯了严重的错误。 红色也意味着危险,而设计人员并不希望用户在犯错时感受到危险。
在这里插入图片描述
  橙色和黄色属于暖色系,使用它们不仅能突显错误,还不会让用户感到太紧张。橙色和黄色的波长不如红色,也没那么刺眼。用户看到橙色或黄色的错误消息时,不会像看到红色那样感到恐慌。

详述字段内容出错的原因

  有时候,错误消息仅告知用户他们犯了错还不够,还要让他们准确地知道出错原因。
  例如,电子邮件字段应在失去用户焦点时提示用户输入的内容应包含“@”符号,同时输入的内容还应包含域名,这比仅提示用户输入的内容无效更有用且具体。

在这里插入图片描述

不要集中显示错误消息,应将每条错误消息置于相应的标签处

  在页面顶部显示一大堆错误消息并不能让用户对纠正错误感到舒适,这样妨碍了他们查看错误消息,用户纠正字段内容错误时必须得回想页面顶部的错误消息。
  将错误消息集中在一起会放大错误的严重性,大部分用户一下看到太多错误消息很可能就不会去修复错误了。
在这里插入图片描述
  较柔和的做法是将每条错误消息放在对应的字段标签旁,残障用户会喜欢这种方式,他们的屏幕阅读器会同时读取错误消息及字段标签以便于纠正错误。
  集中显示错误消息会迫使残障用户记忆字段对应的错误消息,而既集中显示错误消息又在字段标签处显示关联的错误消息会增加用户的工作量[1]。

每次只显示一个字段的错误消息

  更加柔和的做法是突出显示有错误的字段,并在用户跳转到错误字段时仅显示与当前字段相关的错误消息。用户不再被其它错误消息干扰,提高了错误纠正速度。
  使用气泡标注样式的错误消息能有效满足上述要求,但气泡标注不能挡住选中字段的标签。用户选中新的出错字段后,之前显示的气泡标注应消失,同时在字段旁显示新的气泡标注。

在这里插入图片描述

表单提交前验证具有多种要求的字段内容

  某些字段,如用户名、密码等,出于安全原因会有多种输入要求。与其在表单提交后给用户显示一长串错误信息,不如提前验证这些字段内容。可以在字段旁放置气泡标注,每满足一条输入要求就在该要求前点亮绿灯。
在这里插入图片描述
  表单填写费时费力,不要给予用户过多的错误消息,使他们耗费更多的时间和精力。要让用户相信,他们犯的错误不值一提,很容易纠正。
  错误消息对表单完成率的影响比大多数人想象的要大。不要忽略错误消息,否则用户就会另找新欢。

原文地址:https://uxmovement.com/forms/how-to-make-your-form-error-messages-more-reassuring/

[1]原文:Showing them an error summary forces them to have to remember the errors when they get to the fields. And showing both the error summary and error messages next to fields forces too much work on the user.

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值