如何写出优秀的错误提示

没有任何系统百分百没有错误。错误来源可能是用户也可能是系统错误。在这两种情况下,正确的处理对用户体验是至关重要的。

优秀的错误提示必备的三个组成部分:

  • 清晰的文字

  • 正确的位置

  • 良好的视觉设计

清晰的文字

1. 错误提示应该是简洁清晰的

错误提示应该清楚的指出问题在哪里,为什么发生,应该怎么处理这个问题。把错误提示想象成是与用户对话——它应该让人感觉是给人看的(避免一些专业用语)。也请确保你的错误提示是有礼貌的、易理解的、友好的、易懂的。

image

2. 错误提示应该是有用的

仅仅描述发生的错误是不够的,还要告诉用户如何简单的解决这个错误。

例如,微软描述了什么是错误的并在错误提示中提供了解决方案,方便用户能立马解决问题。

image

3. 错误提示针对具体情况

很多时候网站对验证状态都只用同一个错误提示:没填写邮箱信息——“输入一个有效的邮箱地址”,你少输了个“@”——“输入一个有效的邮箱地址”。

MailChimp使用了另外一种方法,他们为每种验证状态提供三种错误提示:1,提交表单时检查输入字段是否为空。2,检查是否有“@”和“.”字符(不论如何,“请输入一个有效信息”不是一个好的错误提示,它不够清晰的表明你需要输入的是什么。)告诉你的用户确切的提示而不是用一个通用的提示。

image

4. 错误提示应该是有礼貌的

不要因为你的用户做错了而责怪他们。对你的用户更有礼貌点,让他们感觉方便舒适。这是一个绝佳机会,可以向你的用户展示品牌和通过错误提示添加产品个性。

image

5. 如果可以的话,幽默一点

谨慎在错误提示中运用幽默。首先这个错误提示应该是有实际意义的,然后你可以为了用户体验增加一些幽默元素。

image

错误提示的正确显示位置

一个好的错误提示是你在需要的地方看到他。避免错误的摘要,将错误提示放在与它相关的UI元素旁。

image

为错误提示制造好的视觉引导

错误提示应该在视觉上清晰。利用文字和背景色的对比,用户可以非常轻松的注意到这个提示信息。

通常红色被用来做错误提示,但在某些例子里,黄色或者橘色也会被用在警示中。在这两种情况下,一定要保证错误文字清晰可辨,与背景色对比明显。同时不要忘记特殊人群,为了色盲患者我们在文字旁边提供相关的UI图标。


image

结论

错误提示是个提升用户体验的好机会,展示你们的产品和品牌个性。注意语言、放置位置、视觉设计,这些影响着错误提示优劣。


原文地址

翻译:空格郑

作者:Vitaly Dulenko

推荐阅读更多精彩内容