it-swarm.cn

常见的Web应用程序可用性陷阱?

关于Web应用程序可用性的一些常见错误是什么?

75
tobeannounced

没有指定延迟的CSS/Javascript下拉菜单,因此您会遇到“对角线问题”(通过 Jakob Nielsen

alt text

81
jessegavin

不将 可单击标签放在复选框上 和其他表单字段。

很容易做到请参见HTML <label> 标记。

74
Patrick McElhaney

表单验证设计不良。

当我提交未通过验证的表单并且应用程序执行以下任何操作时,我讨厌

  • 重新加载表单时,字段为空白。在iPhone上注册网络应用程序时,这发生在我身上。我很生气,因为那里有8个田地。
  • 每个表单提交仅显示一个验证错误。
  • 在表单顶部不显示错误摘要。
  • 不能在视觉上突出显示无效的字段输入。
74
jessegavin

表单上的“主要”与“次要”操作按钮设计不佳。

http://www.lukew.com/resources/articles/psactions.asp

alt text

55
jessegavin

用户使用浏览器(或鼠标)上的后退和前进按钮。他们也使用刷新按钮。因此,请注意您网站上的表单帖子。

没人喜欢这个...

enter image description here

刷新数据发布到的页面时,将出现此对话框。幸运的是,可以通过使用 method =“ get” 来避免这种情况,或者在需要时使用method =“ post”紧随其后的是重定向。如果出于长度或安全原因必须使用帖子,则重定向应使用与表单操作不同的URL,以避免出现此消息。

52
Steve Wortham

JavaScript链接。您不能单击鼠标中键打开javascript:loadPage(34576)的新标签。

43
Casey Chu

不需要时在注册表格中询问必填个人信息。

例子 :

  • 在该信息无用的网站上询问地址
  • 强制输入“真实”名称
  • ...

使此信息成为强制性信息是获取充满“ dummy”,“ [email protected]”等真正受污染的数据库的最佳方法,因为大多数人不喜欢在不必要时提供此类信息。

而且,无法修改任何这些信息是一个非常糟糕的设计。

37
Julien N

锚上的target =“ _ blank”是最常见的一种,也是我最讨厌的一种。我认为在某些情况下这是有道理的。

这是一个众所周知的Web设计十大错误列表: http://www.useit.com/alertbox/9605.html

30
Nacho

后退按钮的功能被禁用或更改为用户期望的功能时。我在使用自定义对话框/灯箱/ iframe的应用程序上看到了很多。

30
jessegavin

让我寻找“忘记密码?”链接,然后单击它,然后向我发送密码明文1个 一旦找到它。我们亲爱的Jeff Atwood在“ 您存储的密码可能不正确 ”中对此进行了很好的介绍。

1个 诚然,这部分更多是 编程问题 ,但是我也认为这是可用性问题。

26
Jared Harley

使用复选框作为单选按钮,反之亦然。

24
Gelatin

无处可关闭您的帐户,或者让您很难找到关闭帐户的位置。

理想情况下,您需要一个“帐户”部分或类似的措词,在该页面上,除了您要在那里的所有其他内容外,还有一个标有清晰标签的链接或按钮,上面写着“关闭我的帐户”。您可以在其后跟随一个页面,该页面询问用户为什么离开或邀请他们提供反馈,但是与实际“关闭我的帐户”(或删除,删除等)号召性用语相比,所有这些东西都应被取消优先级。

22
Rahul
  • 具有超级严格验证的字段。例如,如果您输入邮政编码,则“ V5X4O4”有效,但“ V5X 4O4”无效。

  • 没有文字标签或标题的图标(是否悬停)。

  • 如果标题被截断,我想您应该能够在悬停时看到带有完整标题的工具提示。

  • 当最终用户混淆了重要的按钮而倾向于广告或促销材料时。考虑一下贝宝的“无帐户继续”按钮。

    • 无需许可即可播放的音频!大声笑-而且,没有静音按钮。
21
Motolix

禁用JavaScript后,网站无法正常降级。

19
GSto

这个问题有点笼统,实际上更多的是讨论。

我可以贡献我一遍又一遍的东西:

具有“清除所有”按钮的表单。

  • 其中一些甚至设计相同的“提交”和“清除所有”按钮,使它们的权重相等。
  • 更不用说我已经看到了一些示例(现在没有特定的链接...),其中“清除”在左侧,“提交”在右侧,导致某些用户按第一个离开最后一个字段时最接近其光标的按钮。

我完全没有理由使用“清除”按钮,但是如果您绝对坚持,则只需使用一个非常细微的链接,即可为用户提供一个简单而明显的操作。

18
Dan Barak

必须注册才能执行一些实际上不需要注册的基本操作。或者允许“一键式”注册方法。
用户应有权决定。我最终在如此多的网站上拥有大量的“一次性使用”帐户!

一些不需要的示例:

  • 下载文件(有多少个“代码”网站要求您注册以允许您下载示例文件?)
  • 搜索(是的,某些论坛禁止搜索未注册的用户)
  • 访问文章(免费访问)
  • ...
17
Julien N

具有浮动状态栏的站点

例如 Meebo Bar 。这些令人讨厌,很少提供有用的功能。他们占用不必要的空间并弹出分散注意力的气球。

16
Gelatin

正在“创造”并将搜索栏塞在标签/链接/等后面。如果您提供搜索功能,则只需在其上方提供一个框即可,而无需寻找它!

16
agartzke

我最大的烦恼是由于某种原因或许多不正确支持电子邮件地址加号的网站。很多时候,网站不会在'@'之前用'+'验证电子邮件地址。最糟糕的是,当网站接受该地址,但随后却无法正确转义和/或取消转义数据,并试图将电子邮件发送到地址中带有空格或将'+'的两边粉碎在一起时。

这个用PHP编写的免费验证程序 据说遵循所有RFC及其相关的勘误表。

15
waymost

许多网站没有为访问的链接使用不同的颜色。

Jakob Nielsen: 更改访问链接的颜色

12
Marc Dong

在安全的HTTPS连接上运行但从HTTP连接加载内容的Web应用程序。一方面,这完全可以,但是对于IE)用户(特别是我(通常不是我)),安全警告很尴尬,给用户造成困惑...

不仅在每个页面上关闭都非常麻烦,而且措辞也很笨拙,并且IE(6&7)与IE8 +的按钮操作有所不同

旧IE对话框:

alt text

新的IE对话框:

alt text

因此,如果作为用户“您只想加载整个页面”(例如,您正在寻找“离开”按钮)...则为默认设置 Yes 在IE6和IE7中,但非默认值 No 在IE8 +中。

注意:我作为开发人员完全知道该对话框的用途,甚至是Microsoft为何更改该对话框的原因,但对于最终用户而言,这只会使他们感到困惑,尤其是在IE8中。最终用户会看到一个对话框,询问“权限”,“确认”等,并希望单击“确定”或“是”选项,因为他们没有阅读该对话框。可以争辩说用户应该阅读它,但是如果开发人员确保他们完全避免使用混合内容,那将更加容易。

12
scunliffe

必须搜索注销链接。我登录到一个页面,完成后,我必须搜索注销按钮或链接。

12
thursdaysgeek

最近,我注意到一些我从未考虑过的可用性问题:

将鼠标悬停以使操作可用。例如,在Twitter.com上,将鼠标悬停在Tweet上将显示转推和回复命令。

这根本就根本不适用于基于触摸的设备。没有悬停!

我的另一个烦恼是没有在新标签中打开外部链接的网站。看,我在树上浏览。我希望我要使用的每个域都代表一个分支,完成后,我将关闭选项卡。我当然不希望单击“返回”十次以向上分支。

11
Swizec

隐藏用户想要的东西,而是给他们您想要他们想要的东西。

客户支持就是一个例子。某些公司没有显示带有电话号码/邮件等的大框,而是显示FAQ)作为获得帮助的一种方式,并且该页面上没有任何联系信息。

11
googletorp

站点的菜单结构在您滚动时可以在屏幕的两边“上下浮动”。我可以看到他们这样做的原因,但是它常常让人分心,而且不如“光滑”正如设计师显然希望的那样。

在这里可以看到我要引用的示例: http://www.deluxe-menu.com/floatable-menu-sample.html

9
Sk93

两次显示接受答案的质量检查网站。

8
Gelatin

List Apart有Aza Raskin的文章:“切勿在撤消时使用警告”。

http://www.alistapart.com/articles/neveruseawarning/

用户倾向于忽略或不喜欢“警告”弹出窗口,但是为用户提供“撤消”的机会更加用户友好。

7
mg1075

验证码

尽管这些天很流行,但它们也被视为可访问性问题,尤其是对于无法识别他们不知道的单词(甚至甚至没有键盘上诸如ýáěíč的特殊字符)的人

就个人而言,我宁愿使用简单的理性问题来实现此功能

示例:请输入数字11之后的下一个整数

6
user3409

占用大量CPU和内存的网站

我通常会打开许多​​选项卡,其中包含来自各种邮件列表的编程问题/答案,并且其中许多站点都有一些繁琐的javascript(安装了adblock,但仍然有繁琐的站点)。使用Chrome,我终于可以看到导致它的选项卡。

全新改进的Google图像搜索使我的CPU负担很重,占用了数百兆字节。大量资源匮乏。

5
neoneye

如果将鼠标光标放在页面上的静态元素会改变颜色,但是如果单击它们,则什么也不做。在同一个联盟中:可点击区域仅限于文本的超链接或按钮。

4
Tommy Carlier

从根URI重定向到子目录或子域(不删除/添加www)。

0
Gelatin