跳到内容

ADA合规网站无障碍指南:指南和资源

奥斯汀金丝雀

2019年7月29日

使您的网站ADA合规和访问与我们的清单

牧师;博客;可访问性;ADA合规网站无障碍指南:指南和资源

在设计或更新网站时,迎合大多数用户的需求和品味似乎是谨慎的。然而,看似简单的美学或设计选择可能会使整个人群无法有效地参与您的网站和内容。

这不仅仅是一种有效的设计,以确保你的网站对所有用户都是平等的,这是ADA网站合规的法律要求。

截至2012年,美国人口普查局报告称5670万美国人(占美国人口的18.7%)有身体或认知残疾。随着网络的普及,越来越多的公司因未能为残疾用户提供无障碍的网站和数字服务而被起诉。

在美国,对残疾人的主要法律保护来自1990年的《美国残疾人法案》(ADA),该法案除其他外,要求各组织为所有用户提供公平的商品和服务。

如果不创建无障碍网站,将面临沉重的财政惩罚,而且很有可能影响你的底线——全球残疾用户市场超过10亿,每年的消费能力为6万亿美元。

在这里,我们将更仔细地研究ADA网站的可访问性——确保您的网站符合规定的方法,以及有效地将这些原则付诸实践的网站示例。

ADA网站无障碍标准

1990年,老布什总统签署了《美国残疾人法》。图片由AData

美国残疾人法案它可以追溯到网络的早期,但它仍然是衡量数字商品和服务可访问性的标准。

《美国残疾人法》第三章要求各组织创建不妨碍残疾用户获取向公众提供的服务的工具和平台。例如,公司必须公平地提供餐馆和其他“公共设施”(如酒店、电影院和游乐园)的商品和服务。根据第三章考虑的最新案例,罗伯斯诉达美乐比萨公司(2019年)认为这家披萨公司没有创造移动和网络体验,让残疾用户可以利用他们的送货服务。

由于ADA没有提供任何具体的指导方针或网站可访问性要求(因为它可以追溯到1990年),万维网联盟(W3C)创建了他们自己的标准:WebWCAG 2.0.W3C的标准强调了网站所有元素的可访问设计选项,从幕后的HTML代码到设计调色板中使用的颜色。WCAG仍然是确保网站遵守ADA的最受欢迎的框架,联邦政府正在努力采用WCAG标准作为网站可访问性的法律标准。

如何确保你的网站是合规的

WCAG 2.0被设计成一系列可测试的语句,用于评估网站的内容和表现是否满足所有用户的需求。WCAG要求站点是“可感知的、可操作的、可理解的和健壮的”。

在这里,我们将回顾下面引用的WCAG 2.0标准,并提供在您自己的网站上解决这些要求的技巧:

“信息和用户界面组件必须以用户能够感知的方式呈现给他们。”

可感知的

根据WCAG的说法,“信息和用户界面组件必须以用户可以感知的方式呈现给他们。”对于可感知性,有三个主要因素需要考虑:文本替代品的可用性、站点和内容的适应性以及内容的可区分性。

文本的替代品

用户必须能够访问网站上所有非文本内容的文本选项。(例如,图像、视频)。使用HTML的Alt-Text属性来为站点的所有视觉元素提供详细的描述,包括图像、图表和以视觉为中心的上下文变化(例如,区分站点的不同部分)。

设计提示:使用转录服务为视频创建封闭的字幕牧师.一定要留出足够的时间在转录服务上周转——虽然有些网站可能需要几天才能回复你的字幕,Rev提供三个小时的周转时间(取决于内容的性质)。

适应性

用户应该能够以多种不同的方式访问内容,包括使用辅助工具,如屏幕阅读器。

设计提示:使用简单的格式组织内容,如大纲或结构化的演练。

可区分的

用户应该能够识别网站的哪些元素最符合他们的需求。站点的元素和部分应该明确定义,无论是在前端还是在HTML标签和结构中。

设计提示:使用对比来突出网站元素之间的差异。

“用户界面组件和导航必须可操作。”

可操作的

WCAG 2.0的第二部分认为“用户界面组件和导航必须是可操作的。”换句话说,站点必须能够被所有用户导航和使用,无论他们的认知或机械能力如何。这里的主要问题包括通航性;完成任务的时间;并避免诱发癫痫的弹出窗口和其他网站元素。

键盘通航

不能操作鼠标的用户应该获得基于键盘的导航选项

设计提示:允许标签从一个节移动到另一个节。如果可能的话,使用视觉提示来突出显示光标的当前位置或焦点部分。

足够的时间

用户必须能够按照自己的节奏访问媒体,包括视频和互动内容。

设计技巧:为完成任务提供充足的时间,无论是填写表格还是选择购买物品等更复杂的任务。允许对定时任务(如视频回放)进行暂停等操作,并允许更改显示速度。

避免癫痫
应该警告容易癫痫发作的用户注意闪光元素。

设计提示:使用多个弹出警告,或者完全避免弹出警告。

“信息和用户界面的操作必须是易懂的。”

可以理解的

WCAG的第三部分认为“用户界面的信息和操作必须是可理解的。”所有用户都应该能够识别站点的主要组织组件,并通过一致的交互模式进行导航。

可读的

每个网页的默认语言应该在底层代码中指定。

设计技巧:在HTML内容的页眉中定义每个网页的默认语言。支持翻译不常见的单词和口语短语。此外,如果内容的阅读水平特别高,提供难度较低的文本版本是标准。

可预测的

页面上的内容应该遵循一个中心组织,当用户使用或关注页面的特定元素时,该组织不会改变。

设计技巧:确保在站点中使用一致的导航模式。另外,当用户访问特定元素或输入字段时,不要改变站点的整个焦点。

输入的援助

Web开发人员应该提供错误纠正和错误检测机制,以帮助用户向表单或其他输入点输入信息。

设计提示:在可能的情况下,为输入字段使用预测性文本,以便在检测到用户输入错误时提供替代方案。此外,为网站的所有区域提供全面的、基于文本的帮助,特别是那些用户必须输入信息的区域。

“内容必须足够健壮,能够被各种各样的用户代理(包括辅助技术)可靠地解释。”

健壮的

WCAG 2.0的最后一部分认为“内容必须足够健壮,能够被各种各样的用户代理(包括辅助技术)可靠地解释。”

兼容的

在这里,“健壮”意味着“全面”——也就是说,一个网站的内容应该以足够多的方式来表示,它可以被格式化以适应各种各样的用户需求和浏览模式。

设计提示:确保所有网站内容是完整的,并以全面的方式提供服务,包括所有相关的,相关的内容。

优秀的合规网站的例子

值得庆幸的是,现在越来越容易找到这样的网站完全符合ADA和WCAG 2.0。也许并不奇怪,W3C网站符合这个要求。但研究那些很好地处理WCAG特定方面的网站也很有帮助:

Dropbox的主页揭示了一个看似简单的设计选择如何从根本上提高所有用户浏览网站的能力。通过在他们的设计调色板中使用粗体、对比鲜明的颜色来区分网站的各个部分,这个文件共享服务可以帮助用户快速识别相关的网站元素。

Dropbox的当前主页。

Udacity的在线课程提供深入的指导,在许多情况下,还提供广泛主题的认证。他们的课程以视频为主,所有视频都配有英文字幕。Udacity的用户还可以改变给定视频的播放速度,让那些需要更多时间来阅读给定材料的人更容易观看到视频。

Udacity的课程平台提供法语字幕。

YouTube的视频播放器完全符合ada标准,为视频创作者提供了许多不同的选项,可以在视频中添加字幕和字幕。用户可以在播放器中从头开始创建标题,也可以上传。txt或。srt格式的完整标题文件。虽然它可能不适合更复杂的字幕,比如有多个说话者的音频,但youtube也为那些寻求更程序化解决方案的人提供自动转录。

YouTube的封闭字幕选项,包括他们的翻译选项(目前在测试版)。

卫斯理的使命是澳大利亚一家提供广泛社区服务的非营利组织,他们设计的网站让键盘导航变得轻而易举。标签引导用户浏览网站上的相关表单和字段。此外,该网站的结构非常清晰——各个部分讲述了一个故事,并很好地连接在一起——网站的大部分区域都可以从主页访问

键盘导航在卫斯理使命的网站上的行动-光标在“基督徒生活”在工具栏部分。

网站可以考虑的另一个选择是追求以web应用程序为中心的设计方法。渐进式网络应用程序-比如福布斯网站-结构内容和交互像本地应用程序,简单,静态导航选项;离线访问;甚至还可以选择将网站的特定页面保存为文本或图像文件,保存在计算机或设备上,以供以后查看。

翻了两页《福布斯》网站在手机上查看,显示了web应用程序对不同格式的适应性。

把它们结合在一起

请记住,您正在为所有用户,他们中的许多人在浏览网页时很难导航我们许多人认为理所当然的简单元素。使用提供的检查表来帮助确保您的网站达到或超过ADA的标准。

查看及下载符合《美国残疾人法》规定的网站检查表,以测试您的网站是否符合WCAG 2.0网站可访问性检查程序。

经济实惠,转录速度快。100%的保证。