简介:通过清楚地识别问题并允许用户轻松访问和更正错误字段,帮助用户从错误中恢复。表单是许多应用程序和网站的必要组成部分。我们使用它们来登录,购买商品,发送反馈并输入我们的个人信息。考虑一下您使用的网站以及您输入信息的次数:您多久遇到一次错误?浏览这些错误有多令人沮丧?
错误消息是系统状态的指示:它们让用户知道遇到障碍,并提供解决方案。但是,为了使错误消息有效,人们需要看到它们,理解它们并能够轻松地对它们采取操作。系统状态的可见性是Jakob Nielsen的10种可用性启发式方法之一。它指的是系统状态传达给用户的程度。理想情况下,系统应始终在合理的时间内通过适当的反馈使用户了解发生的情况。
错误是人为的,人们在使用软件时会犯错误。错误流是用户纠正错误必须执行的步骤序列。周到的错误流程使用户可以轻松地纠正错误并继续执行任务。
这些准则几乎不需要解释:首先,如果用户不知道输入内容有问题,他们将无法修复它。其次,人们不必通过表格寻找错误。最后但并非最不重要的一点是,他们在解决问题时不必记住如何解决问题:说明应该在他们的眼前。
1.尽可能进行在线验证
理想情况下,所有验证都应为内联式:即,用户填写完字段后,如果该字段包含错误,则指示符应出现在附近。这种错误消息很容易引起注意。此外,在字段完成后立即修复错误,对用户的交互成本最低:他们无需定位或导航到该字段,也不必从新字段切换上下文即可返回到旧字段他们认为自己已经成功完成了任务。当然,在某些情况下将无法进行在线验证,并且需要将用户输入的数据发送到服务器进行验证。2.指示复杂字段的成功输入
内联验证也可以用于指示成功完成。例如,如果您的用户必须创建一个唯一的用户名,则绿色勾号和该用户名可用的消息将使用户知道可以继续进行下一步。遵循错误预防准则:为字段值提供建议,将输入限制为合法值,并允许输入错误,缩写或不同的输入格式以保持灵活性。对于复杂的输入(例如新密码),即时内联验证(在键入字段值时显示)将防止用户猜测或多次检查输入的内容是否符合系统设置的准则。在下面的示例中,密码强度指示符随用户键入而变化,并帮助用户确定到目前为止输入的字符串是否足够好,还是需要添加更多字符。
Slack指出了密码规则,但还通过在用户键入时显示密码强度表来提供即时验证。
但是,不要过于关注成功指标。成功指示符不应分散用户填写表单的注意力,仅在附加上下文有助于更快或更准确地完成表单时才使用成功指示符。例如,当字段上的唯一要求是填写成功消息时,您无需显示成功消息,因为该消息不会为您的用户提供太多额外的上下文。
3.将错误消息保留在字段旁边
使用内联验证时,错误消息自然会显示在导致错误的字段旁边。但是,即使未对字段进行内联验证,也可以在问题字段下方或旁边显示可操作的错误消息,以帮助用户修复错误,这是值得的。该消息应遵循错误消息准则:应明确,易于理解,礼貌,准确,并提供建设性建议。将错误消息保留在错误的字段旁边可最大程度地减少工作内存负载:用户在修复错误时可以看到错误消息,而不必记住它。
4.使用颜色将错误与正常场状态区分开
红色是与错误最相关的颜色,橙色或黄色表示警告,绿色或蓝色表示成功。确保验证文本的颜色从表单的其余部分中脱颖而出,以便用户迅速注意到它。将相同颜色的半透明背景添加到错误字段,以使其在具有许多表单字段的长页面上突出显示。
5.添加图标或微妙的动画以方便扫描
错误消息或验证摘要左侧的图标与颜色一起会引起用户对错误的注意,并帮助色盲用户。当用户扫描表单时,图标将突出并吸引需要修复的内容。
Adobe.com:错误消息旁边的红色和图标引起了用户的注意。
与错误对应的图标上的细微脉冲或反弹动画可以进一步引起用户对错误的注意。但是,请不要滥用动画:如果存在多个错误,则许多动画图标可能会让人不知所措。而且不要为文本设置动画,动画错误消息很难阅读。
6.少用模态或确认对话框
当您需要特别注意潜在错误时,可以使用模式对话框或确认对话框来解释详细信息并帮助用户解决问题。但是,请谨慎使用此类对话框,因为它们有两个很大的缺点:(1)具有破坏性;(2)错误消息显示在需要修复的窗口中,因此,任何复杂的指令都必须存储在用户的工作记忆中,从而增加了他们的认知负担。但是,如果错误消息很简单或者仍可以按原样提交表单,则可以。
Gmail.com使用了一种模式来警告用户附件丢失。此错误表示很合适,因为错误消息非常简单,并且用户可以选择继续而不添加附件。
7.不要在输入完成之前验证字段
在大多数情况下,请避免在用户完成该字段并移至下一个字段之前显示错误。在有机会完成键入之前看到错误消息可能会很烦人。
在BestBuy.com上下订单时,离开该字段后,“电子邮件地址”字段上会显示一条错误消息。但是,返回修复该错误会提示另一个错误出现在“电话号码”字段中,尽管用户尚未开始在该字段中键入。
8.不要将验证摘要用作错误的唯一指示
一个验证摘要显示在表格的顶部,并可以让用户知道有错误需要被固定在页面上,这些错误是否在视口或折以下。验证摘要可以使用户以某种形式全面了解所有错误,但不应将其用作错误指示的唯一形式,因为它会迫使用户搜索错误的字段。此外,当用户到达错误字段时,错误消息可能不再出现在视口中,从而迫使用户在解决问题的同时记住错误消息。
SurveyMonkey在表格顶部以及在导致错误的特定字段下方提供了错误消息。
9.不要使用工具提示来报告错误
有时会使用工具提示来指示错误。通常在错误的字段旁边显示一个警报图标,然后,一旦用户将鼠标悬停在该图标上或将焦点移到该字段上,就会出现包含错误消息的工具提示或祝酒词。通常,我们建议不要使用这种发信号错误的方法。首先,一些警报图标很难注意到。其次,用户可能想知道该字段出了什么问题,而没有意识到如果他们采取额外的措施,他们实际上可以看到错误消息。第三,为什么要让用户做更多的工作(例如,将鼠标悬停或移至现场)以查看错误消息?
Facebook.com:注册表单中的错误显示为警报图标。用户必须单击每个按钮才能查看问题所在。尽管在此示例中,错误很容易得出,但如果填写了字段,则很难做到。
10.为重复的错误提供额外的帮助
如果相同的错误反复出现(通常在一次填表中通常发生3次或多次),则通常表明用户界面中存在严重问题。您的错误消息很可能不足以帮助您,但设计和用户需求之间可能还会出现另一个不匹配的情况。与往常一样,请记住,当用户犯错时,这不是他们的错。是您的设计容易出错。我们建议检查分析数据是否存在重复的错误,然后检查(或测试)设计以尝试改进它。重写的错误消息通常是首先要尝试的事情。作为更多的创可贴解决方案,您还可以在用户多次犯相同错误之后,显示指向更详细的帮助信息或文档的链接。结论
错误流的设计应帮助用户以表格的形式纠正错误,并建议他们如何避免更多错误。确保用户可以轻松检测到错误,了解如何修复错误,并在更正相应错误时查看错误消息。消除猜测,让用户继续他们的任务。-------------------------------------------
精选推荐
2020双十一/京东/天猫/淘宝/规范与LOGO源文件
-------------------------------------------