web无障碍检测_Web无障碍标准给设计者的概述

web无障碍检测

The term Accessibility covers a vast field of standards that comes with a confusing myriad of acronyms. In this post, I assume I don’t need to convince you to care about accessibility (check out one of my former manager’s articles if you still need a push!). I jump straight into attempting to summarize the basic structure of Web Accessibility Standards to provide beginners with a high-level starting point to dive into the topic. I highly recommend checking out the free edX course (I found it very helpful) or the W3C resources if you want to dig deeper.

“ 可访问性”一词涵盖了广泛的标准领域，其中包含许多令人困惑的首字母缩写词。 在这篇文章中，我假设我不需要说服您关心可访问性(如果您仍然需要推动，请查看我前任经理的文章之一 )。 我直接尝试总结Web Accessibility Standards的基本结构，以为初学者提供一个深入探讨该主题的高起点。 我强烈建议您查看免费的edX课程 (我发现它非常有帮助)或W3C资源，如果您想更深入的话。

Web accessibility means that websites, tools, and technologies are designed and developed so that people with disabilities can use them. More specifically, it is so people can perceive, understand, navigate, and interact with the Web as well as contribute to the Web. Additionally it is also helpful for people without disabilities such as people with “situational limitations” such as in bright sunlight or in an environment where they cannot listen to audio.

Web可访问性是指设计和开发网站，工具和技术，以便残障人士可以使用它们。 更具体地说，它使人们可以感知 ， 理解 ， 导航和与Web 交互以及为Web 做出贡献 。 此外，它对于无障碍人士(例如有“处境限制”的人，例如在阳光直射或无法听音频的环境中)也很有帮助。

Web Accessibility Initiative (WAI) is seen by most as the standard in Web Accessibility. WAI made up of three primary components. ATAG for development, WCAG for content and UAAG for users. WAI is developed by the Accessibility Guidelines Working Group (AG WG) that is part of the World Wide Web Consortium (W3C).

Web Accessibility Initiative(WAI)在大多数情况下被视为Web Accessibility的标准。 WAI由三个主要部分组成 。 用于开发的ATAG ，用于内容的WCAG和用于用户的UAAG 。 WAI由无障碍准则工作组(AG WG)开发，该工作组是万维网联盟(W3C)的一部分。

Let’s take a look at each of these three sections:

让我们看一下这三个部分：

WCAG (WCAG)

Web Content Accessibility Guidelines (WCAG) addresses web content, and is used by developers, authoring tools, and accessibility evaluation tools. Something that is neat about WCAG standards is that it is backwards compatible, meaning something that is compliant with the latest version (2.1) would also pass (2.0).

Web内容可访问性指南(WCAG)处理Web内容，并由开发人员，创作工具和可访问性评估工具使用。 WCAG标准的优点在于它是向后兼容的 ，这意味着符合最新版本(2.1)的东西也可以通过(2.0)。

WCAG is one of the most common standards for UX and Product designers as it applies to all the content. There is a simple rating system for all the guidelines under WCAG:

WCAG是UX和产品设计师最常用的标准之一，因为它适用于所有内容。 WCAG下的所有指南都有一个简单的评分系统：

A级(最低) (Level A (minimum))

The most basic web accessibility features. The website MUST satisfy this checkpoint. Otherwise, one or more groups will find it impossible to access information in the document. Satisfying this checkpoint is a basic requirement for some groups to be able to use web documents.

最基本的Web无障碍功能。 网站必须满足此检查点。 否则，一个或多个组将无法访问文档中的信息。 满足此检查点是某些组能够使用Web文档的基本要求。

AA级(中档) (Level AA (mid-range))

Deals with the biggest and most common barriers for disabled users. Website SHOULD satisfy this checkpoint. Otherwise, one or more groups will find it difficult to access information in the document. Satisfying this checkpoint will remove significant barriers to accessing Web documents.

解决残障用户最大和最常见的障碍。 网站应满足该检查点。 否则，一个或多个组将很难访问文档中的信息。 满足此检查点将消除访问Web文档的重大障碍。

AAA级(最高) (Level AAA (highest))

The highest level of web accessibility. A website MAY address this checkpoint. Otherwise, one or more groups will find it somewhat difficult to access information in the document. Satisfying this checkpoint will improve access to web documents.

最高级别的Web可访问性。 一个网站可以解决这个检查点。 否则，一个或多个组将发现访问文档中的信息有些困难。 满足此检查点将改善对Web文档的访问。

Certain products (such as ones for many federal agencies) may have to meet a specific level of compliance. There tends to be a grey area for private businesses, but generally the more compliant the score, the more accessible a product is to the general public.

某些产品(例如许多联邦机构的产品)可能必须满足特定的合规水平。 私营企业往往会有一个灰色地带，但是通常分数越合规，产品对公众的访问就越容易。

通用WCAG 2.0准则的摘要如下： (A summary of the general WCAG 2.0 Guidelines are as follows:)

(*indicates Cognitive Accessibility Success Criteria)

(*表示认知辅助功能成功标准)

1.可感知的 (1. Perceivable)

Text Alternatives: Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.

替代文本：为任何非文本内容提供替代文本，以便可以将其更改为人们需要的其他形式，例如大字体，盲文，语音，符号或更简单的语言。

Time-based Media: Provide alternatives for time-based media (commonly videos) such as captions, described audio or a media alternative.

基于时间的媒体：提供基于时间的媒体(通常是视频)的替代方案，例如字幕，描述的音频或替代性媒体。

Adaptable*: Create content that can be presented in different ways (for example simpler layout) without losing information or structure. This includes considerations for, proper labeling, consideration for different screen sizes etc.

适应性强*：创建可以以不同方式(例如，更简单的布局)呈现的内容而不会丢失信息或结构。 这包括考虑因素，适当的标签，考虑不同的屏幕尺寸等。

Distinguishable: Make it easier for users to see and hear content including separating foreground from background. This includes common UI decisions such as contrast and text size in addition to audio considerations like background noise.

可分辨：使用户更容易查看和收听内容，包括将前景与背景分开。 除了音频注意事项(例如背景噪音)之外，这还包括常见的UI决定(例如对比度和文本大小)。

2.可操作 (2. Operable)

Keyboard Accessible: Make all functionality available from a keyboard. This mostly refers to the ability to move focus to and from all components of the page using a keyboard interface.

可访问键盘：使所有功能都可通过键盘使用。 这主要是指使用键盘界面在页面的所有组件之间移动焦点的能力。

Enough Time*: Provide users enough time to read and use content. This includes moving, blinking, scrolling, or auto-updating information as well as interruptions and time-outs.

足够的时间* ：为用户提供足够的时间来阅读和使用内容。 这包括移动，闪烁，滚动或自动更新信息以及中断和超时。

Seizures and Physical Reactions: Do not design content in a way that is known to cause seizures or physical reactions. This generally means limiting flashes and motion animation to below the approved threshold.

癫痫发作和身体React：请勿以已知会引起癫痫发作或身体React的方式设计内容。 这通常意味着将闪光和动作动画限制在批准的阈值以下。

Navigable*: Provide ways to help users navigate, find content, and determine where they are. This includes important UI decisions like information architecture, focus order, and proper titles, headers and labelling.

可导航*：提供方法来帮助用户导航，查找内容并确定他们在哪里。 这包括重要的UI决策，例如信息体系结构，焦点顺序以及正确的标题，标题和标签。

Input Modalities: Make it easier for users to operate functionality through various inputs beyond keyboard. An example of this is consideration for the minimum size of touch targets.

输入方式：使用户更容易通过键盘以外的各种输入来操作功能。 例如，考虑触摸目标的最小尺寸。

3.可理解的 (3. Understandable)

Readable*: Make text content readable and understandable. This could be as simple as identifying the human language of a page but can also include advanced standards such as identifying and explaining idioms or abbreviations.

可读*：使文本内容可读和可理解。 这可以像识别页面的人类语言一样简单，但也可以包括高级标准，例如识别和解释习惯用语或缩写。

Predictable*: Make Web pages appear and operate in predictable ways. This includes predictable interactions from components and consistent form of navigation.

可预测的*：使网页以可预测的方式显示和操作。 这包括来自组件的可预测的交互作用和一致的导航形式。

Input Assistance*: Help users avoid and correct mistakes. This includes identifying input errors and providing helpful, timely and relevant instructions or suggestions.

输入协助*：帮助用户避免和纠正错误。 这包括识别输入错误，并提供有用，及时和相关的指示或建议。

4.坚固 (4. Robust)

Compatible: Maximize compatibility with current and future user agents. This is mostly work for the developers to make sure the product is built in a way that supports assistive technologies.

兼容：最大化与当前和将来的用户代理的兼容性。 对于开发人员而言，这主要是为了确保以支持辅助技术的方式构建产品。

ATAG (ATAG)

Authoring Tool Accessibility Guidelines (ATAG) addresses authoring tools -software and services that “authors” (web developers, designers, writers, etc.) use to produce web content (static web pages, dynamic web applications, etc.). Some good example of these are popular social media sites, forums and wikis.

创作工具可访问性指南(ATAG)解决了创作工具-“作者”(网络开发人员，设计人员，作家等)用来产生Web内容(静态网页，动态Web应用程序等)的软件和服务。 其中一个很好的例子是流行的社交媒体网站，论坛和Wiki。

ATAG is split into two parts that make the authoring tools themselves accessible, so that people with disabilities can create web content, and help authors create more accessible web content — specifically: enable, support, and promote the production of content that conforms to WCAG.

ATAG分为两个部分，使编写工具本身可以访问，因此残疾人可以创建Web内容， 并帮助作者创建更多可访问的Web内容-特别是：启用，支持和促进符合WCAG的内容的生产。

A部分：使创作工具用户界面可访问 (Part A: Make the authoring tool user interface accessible)

The authoring tool user interface must:

创作工具用户界面必须：

• Ensure that web-based and non-web functionality is accessible
  确保可访问基于Web的功能和非Web功能

Editing-views are perceivable

可以看到编辑视图

• Make alternative content available to authors
  向作者提供替代内容
• Ensure that editing-view presentation can be [programmatically determined]
  确保可以以编程方式确定编辑视图的演示文稿

Editing-views are operable

编辑视图是可操作的

• Provide keyboard access to authoring features
  提供键盘访问创作功能
• Provide authors with enough time
  为作者提供足够的时间
• Help authors avoid flashing content that could cause seizures
  帮助作者避免出现可能引起癫痫发作的内容闪烁
• Enhance navigation and editing via content structure
  通过内容结构增强导航和编辑
• Provide text search of the content
  提供内容的文本搜索
• Allow users to manage preference settings
  允许用户管理首选项设置
• Ensure that previews are at least as accessible as user agents
  确保预览与用户代理至少具有相同的访问权限

Editing-views are understandable

编辑视图是可以理解的

• Help authors avoid and correct mistakes
  帮助作者避免和纠正错误
• Document the user interface, including all accessibility features
  记录用户界面，包括所有辅助功能

B部分：支持可访问内容的制作 (Part B: Support the production of accessible content)

When fully automatic processes produce accessible content

当全自动过程产生可访问的内容时

• Ensure that automatically-specified content is accessible and accessibility information is preserved
  确保可以访问自动指定的内容，并保留可访问性信息

Authors are supported in producing accessible content

支持作者制作可访问的内容

• Ensure that accessible content production is possible
  确保可以制作无障碍内容
• Guide authors to produce accessible content
  指导作者制作可访问的内容
• Assist authors with managing alternative content for non-text content, accessible templates and accessible pre-authored content
  协助作者管理非文本内容，可访问模板和可访问预先创作内容的替代内容

Authors are supported in improving the accessibility of existing content

支持作者改善现有内容的可访问性

• Assist authors in checking for and repairing accessibility problems
  协助作者检查和修复可访问性问题

Authoring tools promote and integrate their accessibility features

创作工具促进和集成其辅助功能

• Ensure the availability of features that support the production of accessible content and documentation promotes the production of accessible content
  确保支持可访问内容的产生的功能的可用性，文档可促进可访问内容的产生

UAAG (UAAG)

User Agent Accessibility Guidelines (UAAG) addresses web browsers and media players, including some aspects of assistive technologies.

用户代理可访问性指南(UAAG)针对Web浏览器和媒体播放器，包括辅助技术的某些方面。

UAAG documents explain how to make user agents accessible to people with disabilities. User agents include browsers, browser extensions, media players, readers and other applications that render web content.

UAAG文件解释了如何使残疾人士可以访问用户代理。 用户代理包括浏览器，浏览器扩展，媒体播放器，阅读器和其他呈现Web内容的应用程序。

Some accessibility needs are better met in the browser than in the web content, such as text customization, preferences, and user interface accessibility. A user agent that follows UAAG 2.0 will improve accessibility through its own user interface and its ability to communicate with other technologies, including assistive technologies.

在浏览器中，比在Web内容中更好地满足了一些可访问性需求，例如文本自定义，首选项和用户界面可访问性。 遵循UAAG 2.0的用户代理将通过其自己的用户界面以及与包括辅助技术在内的其他技术进行通信的能力来改善可访问性。

Unless you work on a user agent product such as a browser, you will probably not be required to be familiar with these standards. They are somewhat similar to WCAG with five base principles of Perceivable, Operable, Understandable, Programmatic Access and Specifications & Conventions. If you would like to see the detailed list of guidelines, here is a link to the UAAG 2.0 Guidelines.

除非您使用诸如浏览器之类的用户代理产品，否则可能不需要您熟悉这些标准。 它们与WCAG有点相似，具有可感知，可操作，可理解，程序访问以及规范和约定的五个基本原则。 如果您想查看准则的详细列表，请访问UAAG 2.0准则的链接。

最后说明 (Final Note)

A final note here is while many of the guidelines are presented like a checklist, any resource you encounter on this topic will warn you against just looking at these criteria like boxes to be ticked off. Certain exercises such as Microsoft’s Inclusive Design Activities tend to work much better at identifying with the users these criteria target and result in more empathetic and effective design decisions. Learning more about different assistive technologies and interacting with their users is a great place to start.

最后要注意的是，虽然许多准则都像清单一样显示，但是您在该主题上遇到的任何资源都将警告您不要仅查看这些准则(例如要勾选的框)。 诸如Microsoft的Inclusive Design Activities之类的某些练习在与用户确定这些标准目标方面趋向于更好地工作，并导致更具同理心和有效的设计决策。 了解有关不同辅助技术的更多信息并与他们的用户互动是一个很好的起点。

Lastly, I can’t end this article on web accessibility without mentioning that one of the most important jobs of people working in product is to get buy in. This Medium Article by Timothy Whalin does a better job than I at explaining how to get support for accessible design. Each organization is responsible for developing and adhering to their own accessibility policy, so knowing the guidelines is only a single step in the process towards more accessible design.

最后，我在结束关于Web可访问性的文章之前不得不提到，从事产品工作的人们最重要的工作之一就是购买产品。 Timothy Whalin撰写的这篇中篇文章在解释如何获得对可访问设计的支持方面比我做得更好。 每个组织都有责任制定并遵守自己的可访问性政策 ，因此，了解准则只是朝着更易于访问的设计迈出的一步。

Thanks for reading. I am still very new to many of these topics but wanted to consolidate some of the information I came across into a single source that can act as a springboard for further learning. Open to all suggestions and feedback.

谢谢阅读。 我对其中的许多主题还是很陌生，但想将我遇到的一些信息整合到一个单一的来源中，以作为进一步学习的跳板。 开放给所有建议和反馈。

P.S. I hope to cover an overview of other common acronyms in web accessibility in a future article as I wanted to keep this one short(ish). For example what are the differences (or similarities) between ADA, 508, EN 301 549 and ISO/IEC 40500:2012 compliance? How do technical guidelines such as ARIA, ACT and EARL fit in? Stay tuned!

PS：我希望在以后的文章中概述Web访问中的其他常见缩写词，因为我想简短一点。 例如，ADA，508，EN 301549和ISO / IEC 40500：2012遵从性之间有什么区别(或相似之处)？ ARIA，ACT和EARL等技术准则如何适用？ 敬请关注！

翻译自: https://uxdesign.cc/web-accessibility-standards-an-overview-for-designers-1a4d39f2fe5e

web无障碍检测