如何显示网页出错消息
  • 提交:admin
  • 时间:08-07-29 16:50
  • 更新:08-08-29 15:16
本章前面禁忌中描写了有关网站和基于Web的应用程序中书写文本的方法——包括出错消息,都是难于阅读。在一些网站设计中,出错消息的易读性被更严重的问题蒙上了阴影:用户甚至没有注意到出错消息。造成这种现象最普遍的原因是一些下列情况的组合:
·错误的位置:位于人们无法看到的远处的角落里。
·没有错误标记:只有文本,没有停止标记,大的感叹号,红色的“X”一类的记号。
·字体太小或者太普通:消息中的文本与页面中的其他文本看起来一样。
·不闪烁也不移动:只是显示文本,没有做任何特别处理来引起用户注意。
以客户端的内部Web应用程序的登录页面为例。如果登录信息无效,登录页面重复显示,并显示一条出错消息。你能发现这条消息吗?它在页面的左上角。消息的位置,尺寸和颜色都使这条消息不容易被看到。错误输入PIN号码的人或许会浪费几秒钟——或者更多,弄不清为什么他们还在登录界面。
Citibank的在线银行服务显示更不容易看见的出错消息。例如,如果消费者在在线账单支付表彰中输入无效的数据,那么会显示一条出错消息。你能找到这条出错消息吗?提示:消息甚至不在网页中,它在浏览器的状态条中,在左侧,字体小而普通。这条消息不是很有帮助:“Error on page(页面中有错误)”。
在一些禁忌的后面,我展示了一个来自Russell Stover旧网站的例子,它是关于文本颜色与背景色对比不强烈的例子。当时没有涉及显示的注册出错消息难以阅读的问题,它出现在表单的顶部,位于页面的左边。在这个位置显示出错消息似乎是合理的,但是正在注意提交按钮或者文本框的用户会忽略这条对比不强烈的文本消息。
如果在这个位置显示的消息用更大字体、使用与背景色对比强烈的颜色、或者被放在一个与背景颜色不同的区域里、而且带有出错标记,那么或许这条消息十分醒目。然而,在这个位置上,颜色对比又不强烈,我保证许多访问者最初都忽略了这条消息,而且感到惊讶,为什么点击提交按钮后又重新显示表单。
解决之道
在我解释如何向用户呈现容易引起注意的出错消息之前,让我们来观察一个在这方面做得很好的网站。娱乐器材网站中有一个由许多部分组成的表单,该表单用于商品订购。当消费者试图提交包含无效数据的表单时,和前面的例子一样,表单与出错消息一起重新显示。然而,出错消息在独立区域中用红色字体显示,因此不容易被忽略。另外,错误的数据输入框用红色突出显示,而且还用星号做了标记。没有人能够看不见这条消息。
我们来思考一下Russell Stover网站和内部Web应用程序中显示的出错消息有什么问题。二者都将消息旋转在见面的左上方,这似乎是摆放出错消息的好地方。有一条众所周知的图形用户界面(GUI)设计原则,即重要的数据和设置应该位于窗口的左上方(Johnson,2000)。
然而,这条原则不适用于见面中的出错消息,原因如下:
·当Web浏览器显示页面时,页面内容不在窗口的顶部,它位于浏览器控件的下方。网页左上方的项目会被浏览器的混乱控件和网页中的元素“隐藏”起来。
·GUI原则涉及当一个窗口出现时,用户通常首先注视哪里。但是我们正在讨论的出错消息与用户刚刚填写完毕并提交的表单显示在相同的页面中的情况。当用户提交表单时,他们没有注视页面的左上方;他们正在注视提交按钮或者表单本身。
当页面再次显示表单时,用户可能没有看见左上方的出错消息,相反,他们感到惊讶,为什么没有继续前进到下一步。
修改前面提到的内部Web应用程序的登录页面,将出错消息移动到用户将要注视的地方同时标记需要重新输入的文本框。即使只有PIN是无效的数据,为了安全,系统也要求用户全部重新输入。因此,我将出错消息放在ID部分并突出显示全部文本框。
为了修改RussellStover.com网站中的禁忌,我缩短了出错消息,而且将它放在出错的文本框旁边,同样,我也将需要重新输入的文本框突出显示。
出错消息容易引人注意的原则
在观察了避免和纠正这个禁忌的例子之后,现在我们可以考虑确保用户注意到网页中的出错消息的原则:
·放在用户正在注视的地方 人类的边缘视觉不好,而且随着年龄的增长越来越糟糕。昼将出错消息放在当错误出现时人们正在注视的地方。
·放在离错误近的地方 如果错误出现在页面的特定文本框或者控件上,那么将出错消息放在其附近。
·使用红色 红色通常代表某事物有问题,因此红色是一种用来表示“错误!”的颜色。
·使用错误标记 如果可能,用代表错误的标记开始每一条出错消息。觉的错误标记是一个大的红色的“X”、一个停止标记、或者是一个大感叹号。
这些都是使出错消息引人注意的标准技术,然而,有时候你需要“重炮”:从桌面软件上借鉴过来的技术(Johnson,2000),这些技术使出错消息几乎不可能被忽略:
·鸣叫 发出简短的声音,提醒用户有错误出现。很明显,最好使用用户平台上的标准“错误”声音。
·暂时地闪烁或者摆动 对于固定的物体来说,人类的边缘视觉非常糟糕。然而,由于人类在必须躲避食肉动物的环境中不断进化,因此在注意到变化的和移动的物体时,人类的边缘视觉很好。我们主动而迅速地直接注视吸引我们注意的任何事物。因此,闪烁和动画可以用来引起人们对出错消息的注意。但是,如果闪烁和动画持续不断,那么它们都是干扰因素,因此总是在大约半秒之后停止。如果你无法停止它们,就不要使用。
·使用对话框 可以在对话框中显示出错消息,对话框是浏览器弹出来的或者在用户的界面上获得的小窗口。可能是真正的对话框,也可能是比较小的、不显示的控件的浏览器窗口。
这些对于桌面软件技术是有效的,但是在网站中几乎不可行,它们在Web应用程序中更常见,Web应用程序在许多方面都与桌面应用程序相类似。

相关主题:
网页书写错误和语法错误
请拨打热线:0571-86586571

文章推荐

    Loading...

人气排行

    Loading...
建站经验 - 业内新闻 - 优化技术 - 网络营销 - 官方论坛 - 建站套餐 - 网站建设单价 - 增值服务 - 建站流程
网站优化套餐 - 网站推广增值服务 - 网站推广流程 - 网站设计 - 设计精选 - 企业网站 - 政府网站 - 电子商务网站 - 行业门户网站

关于我们 - 诚聘英才 - 合作伙伴 - 联系我们 - 杭州网站建设
[ 简体中文 ] [ blue ] 管理模式
Copyright ©2005 - 2008 杭州尚线网络技术有限公司
Processed in 0.005(s) 浙ICP备07025542号