网页可及性狂野
现在更疯狂!

请注意

本文介绍了各种各样的错误,误解,对对,错综复杂,一般傻现代可访问性的方面虽然大多数可访问性问题是由于缺乏知识,有时最令人震惊的错误是由善意的开发者只是误解了可访问性的概念或把有限的理解一个极端的水平,因此web可访问性狂野我们希望提供一个概览的许多细节方面的可访问性经常被误解和误用,希望在未来可以正确实现。

如果你有意见或补充的问题,请在我们的博客

Alt文本错误

尽管规则# 1 web可访问性,失踪的和不恰当的实现替代文本仍然是最网页可及性问题的方面在技术层面上,添加alt文本死了简单,理解的替代文本可能相当困难。

描述性的alt文本

我们继续看到图像描述的替代文本任何时候包含一个替代文本描述图像的替代文本可能不是最优,往往是坏的替代文本必须传达内容功能的形象,应该很少形象的描述而不是提供形象的样子,alt文本应该传达图片的内容是什么,它做什么。

这种误解导致,alt = "子弹",alt = "红色箭头",alt = "纠结的顶部的页脚”,alt = "蓝色角落阴影”等不到无用的替代文本这也证明在alt文本包含文件名(alt = " logo . gif ")。

更进一步,开发人员常常通过alt文本传达一个图像的存在:

一只猫的形象
alt = "我的猫的形象”

它并不重要,大多数图像被称为图像如果是绝对至关重要的识别形象绘画或照片,那么这应该是替代文本的一部分,不过这应该是例外,而不是规律。

“微笑姐”图像

网络充满了装饰图像可访问性的目的通常很难区分图像真正装饰和表达内容许多图像用于提高内容或提供一种情绪或感觉或设计主题的页面这些图像往往是错误的替代文本。

微笑的女士? ? ?
alt = "微笑女士? ? ?”

许多这些类型的图像实际上是比信息更装饰大多数屏幕阅读器用户倾向于认为他们并不真正在乎的心情,感觉,或网站的美学——他们希望没有这些重要内容无关的不太重要的信息。

握手
alt="Our business promises the best service you will find on the planetOur team is professionally trained to offer excellent customer service throughout the contract negotiation processCustomer satisfaction is our top priority and is guaranteed."

然而,这变得更加困难当设计师将努力在战略选择和定位图像来传达的东西再次,虽然最终的内容来确定作者和alt文本提供了多少,我们的建议是宁可极简主义,通常,这意味着alt = " "这些类型的图像

链接的图片

也许增长最快的可访问性问题近年来一直是令人担忧的趋势,有关图像丢失的替代文本。

在上面的实例中,下面的图像和文本是单独的链接图像在这种情况下必须有替代文本如果一个图像内唯一一个链接或如果它是一个按钮,它必须有足够的替代文本提供用户如果激活链接或按钮将做什么这是真的,即使替代文本是一样的相邻的文本In the example above (a representation of something very prevalent in online stores), the best solution is to simply combine the image and the text into one link and give the image empty alt text (alt = " "),因为现在充分提供了选择的文本图像和链接的功能。

此外,由于屏幕阅读器识别链接,您不需要识别链接的图片和链接换句话说,避免alt = "链接到苹果Iphone "

复杂的图片

复杂图像的内容,比如图表和图形,不能总是充分提供替代文本How long is too long for alternative text? If you were forced to listen to it in a screen reader and it becomes even slightly burdensome, it is too long如果对你来说是不够的,100个字符是一个很好的措施。

longdesc属性旨在提供长描述页面的URL(例如,longdesc = " chartdata.html "),不应包含实际的长描述(例如,longdesc = "这个图表……”)。

图表显示销售增加
alt = "销售稳步增长在过去9年从500万年的1996到1600万年的2004人”

此外,有时包括复杂的图像,但图像的实际内容是相当简单的在这些情况下,不要责怪自己提供完整的长描述包含所有可能的数据点,试图解决的可访问性只是提供一个简短的总结中数据的替代文本可能会足够了在上面的示例中,如果你不认为典型的网站访问者会关心销售在2001年是1300万年,那么为什么要提供这个数据在文本吗?

辅助功能选项很少是一个很好的解决方案

上述声明当然是一种泛化,但通常辅助功能选项和偏好(如字体调整部件,高对比度设置,等等)显示一个贫穷或noncommited决定在设计过程中如果你的网站访客的默认字体大小可能太小,然后做出一个适当的大小如果你对比不足,解决它辅助功能选项通常和偏好来容纳一个弱点在默认网站的可访问性或表明,开发人员不能选择选项,而力量决定由他的网站访客。

任何时间提供了一个可访问性的选择,它可能受益的一组用户同时将缺点几乎所有其他用户字体调整选项可能有用的低视力患者没有屏幕放大或增加字体,但这种选择将降低页面万博体育官网网址其他人所有浏览器都允许大小或缩放页面的内容——为什么重复这个浏览器功能?

直到用户代理…

他们做的事。

Web内容可访问性指南1.0提供几个检查点,只有有效,直到用户代理自动做一些占检查点的问题被解决在几乎所有情况下,这些检查站可以忽略这包括检查点要求表单字段的默认文本(例如,“在这里输入你的名字”),相邻之间放置non-linked可打印字符链接,并提供冗余的文字链接的图像地图的热点地区。

可访问性>合规

可访问性领域的一个共同的主题是一个信念,遵守一套准则意味着你万博体育官网网址你可以完全第508节完全兼容,例如,在万博体育官网网址指导方针和标准,甚至WCAG指南,应该作为工具,而不是作为一个真正的措施的可访问性虽然指南可能帮助我们确定一个页面IN万博体育官网网址,他们不能也永远不会能够告诉我们如果我们的页面万博体育官网网址。

我们看到许多情况下,指导方针(特别是第508节)所以字面上可访问性存在We've seen it suggested that you can't provide a page that lists resource links without an option to skip over these "repetitive navigation links"和你不能提供一个Word或Excel文档作为基于web页面或变质的数据表因为你不能为用户提供一个链接免费得到这些项目Nonsense! The goal of guidelines is to support accessibility, but when extremists focus more on compliance than on accessibility, accessibility is ultimately what suffers.

支持键盘和tabindex

不要使用它们。

他们几乎总是导致易访问性的降低即使实现正确(罕见),他们通常用于占贫穷设计决策例如,自然导航顺序是不合逻辑的tabindex用于修复它吗或在页面内搜索并不普遍,所以accesskey实现提供更快的访问吗accesskey的好处和tabindex很少超过他们引入的问题。

隐藏的内容屏幕阅读器

WebAIM也许是第一个介绍视觉的方法隐藏内容,但允许它被屏幕阅读器阅读(用CSS隐藏的内容显示:没有可见性:隐藏不读大多数屏幕阅读器)当前这些技术的实现,然而,现在导致一些令人烦恼的趋势。

只展示内容时屏幕阅读器用户应该只做额外的内容已经明显的呈现给用户有几个标准设计实践,导致非常明确的视觉现象可能不是最初明显屏幕阅读器用户访问内容以线性的方式例如,在这个网站,搜索输入框每一页的顶部尽管显然是明显可见的标签是不提供的邻近的“搜索”按钮作为视觉标签在这种情况下,一个隐藏的标签,表明文本框的功能页面的顶部的面包屑是一种设计元素,通常是众所周知的,因为他们的整体视觉呈现,屏幕阅读器用户无法获得的东西隐藏在这种情况下,我们增加了“你在这里:“文本立即面包屑前提示屏幕阅读器用户接下来会发生什么最后,谷歌广告每一页的底部很明显是广告的用户对于屏幕阅读器用户来说,我们确定广告的开始块。

隐藏文本不应使用屏幕阅读器用户提供功能或内容可能有用的其他用户不使用屏幕阅读器正如上面提到的,当内容或功能是提供一个特定的用户组,它通常会降低其他用户的可访问性。

修复屏幕阅读器缺陷

屏幕阅读器通常吸虽然非常强大的技术,他们遭受病菌,不一致,有时不合逻辑的奇怪这是特别明显的方式读取一些文本和页面元素例如,WebAIM犹他州立大学主办机构或一般通常是由大多数屏幕阅读器阅读“oosoo”一些开发商,当遇到这样的屏幕阅读器奇怪会试图纠正这些问题,方法如替换文本通常的图像的alt文本“Ess你”。

For the most part, you should ignore such deficiencies in screen readers and focus on how accessibility SHOULD be provided屏幕阅读器正在改善——这不是开发商工作占了他们目前的弱点。

不当关联形式的细节


Do you know what the previous form elements are for? Probably not当组单选按钮和复选框的目的是没有出现过的标签自己,然后是一个自定义字段和传说是必要的。

下面的单选按钮需要自定义字段和传说?


因为屏幕阅读器阅读之前的传说每一个表单元素中的自定义字段,传说应该简洁、准确。

屏幕阅读器通常利用一个“形成模式“当完成web表单当在形式模式,只有相关的表单元素及其正确标签确定当用户通过导航的形式因此,任何指令和暗示不属于一种标签或一个自定义字段的传说不可能阅读。

我极其重要的指令,但因为我不是在一个标签或传说,屏幕阅读器用户可能不会听到我。

一定要把重要的形式说明和提示标志等所需的表单字段,数据格式要求等表单前,在一个表单元素标签,或在一个自定义字段的传说。

标题属性

title属性,根据定义,可用于提供咨询信息它应该:

  • 没有提供重要信息或信息可访问性的必要条件。
  • 不提供相同的信息,可在文本或替代文本。
  • 不存在明显的如果咨询标题不提供额外的、有用的信息,它可以被删除。
  • 小心使用小链接和导航项,因为标题提示可能覆盖潜在的项目。
  • 不是用作替代文本替换,表单标签、表头等。
  • 始终使用框架元件(例如,<框架标题= "导航" >)

title属性不是读对于大多数元素默认情况下在大多数屏幕阅读器异常的框架元件和表单元素没有标签当一个表单元素没有标签,但有一个标题,标题通常是阅读这种方法,然而,通常是一个滥用标题——如果标题属性是必要的,以确保表单元素的可访问性,那么它肯定是包含多简单咨询信息一种更好的方法是插入一个相关的标签,如果有必要,可以用CSS隐藏标签。

布局表

只要他们不引入一个不合逻辑的或自然的阅读/导航顺序,布局表对易访问性几乎没有影响虽然有很多原因不是最优布局表,可访问性并不是其中之一。

摘要(<表汇总= " ....”)不应使用布局表因为总结可能显示为一个浏览器工具提示,这可能会导致混乱的用户想象一下把你的鼠标放在导航项定位布局表,看到工具提示的“表用于布局导航项目。”

无形的联系集中

正如之前记录的,没有风格的链接大纲:0它让焦点指示器,虚线或行军蚁的周围集中链接和按钮,看不见。

不合规的HTML ! =在万博体育官网网址

W3C验证器显示1858错误。一段时间以前,我收到了一封匿名电子邮件从网站访问者说,“我真不敢相信你声称关心可访问性和现在的自己时易访问性专家页面甚至不通过W3C验证器!”具有讽刺意味的是,他并没有说明哪一个页面没有验证(如果你找到它,请让我知道)。

虽然任何热爱易访问性应该提倡支持可访问性标准兼容的代码,而适当的代码,有许多页面很破,不一致的HTML完全万博体育官网网址另一方面,我相信在万有符合XHTML页面很博体育官网网址(尽管这些更难得到)。

可访问性语句和合规徽章

我们不需要任何讨厌的徽章!

除非有法律原因确定站点的可访问性水平或遵守的指导方针,标准和工具,几乎没有用处添加可访问性语句和徽章(如W3C,鲍比(安息吧),第508节,等等,图标或符号)到您的网站虽然开发人员可能在合规感到自豪并想传福音标准和工具,这样做对一个网站的每一页介绍了不必要的复杂性和开销当然,如果你的典型的网站访问者知道“W3C WAI-AAA WCAG 1.0”是什么意思,然后页面复杂度可能是你最不担心的:-)