JavaScript 和辅助功能

Question

作为一名网络开发人员，我从事的许多项目都属于政府的范畴，因此受到 508 Accessibility 的约束法律，有时还有W3C 无障碍指南。 在满足这些要求的同时，JavaScript 可以使用到什么程度呢？

沿着这些思路，JavaScript，特别是 AJAX 和使用 jQuery 之类的包来执行诸如显示模式对话、弹出窗口等功能，在多大程度上受到 JAWS、Orca 等现代辅助软件的支持？ 过去，规则类似于“如果它在 Lynx 中不起作用，那么它也不适用于屏幕阅读器”。 这仍然是事实吗？或者这些领域是否取得了更多进展？

编辑：共识似乎是只要存在非 javascript 后备，javascript 就可以，但是屏幕阅读器软件对 AJAX 的支持似乎仍然不确定。 如果有人对此有具体经验，那将是最有帮助的。

Answer 1

如果可访问性是您最关心的问题，请始终使用符合标准的 HTML（选择文档类型定义并坚持使用）来启动网站。 如果它是一个 Web 应用程序（表单提交等），请确保表单仅使用 HTTP GET 和 POST 即可工作。 一旦您拥有了完整的网站/应用程序，只要网站仍然可以运行，您就可以添加一些 CSS 和 JavaScript，无论其中一个或全部关闭。

这里最重要的概念是渐进增强。 您使用 CSS/JavaScript 添加了额外的功能，但是您的网站/应用程序无需也可以完美运行。

用于测试 508、WAI，CSS 关闭，JavaScript 关闭尝试使用 Web Developer 插件。

Answer 2

我认为答案实际上在于你如何构建事物。 JQuery 具有不引人注目的能力，因此易于访问。 诀窍是在 AJAX 调用周围提供冗余，以便没有 JavaScript 的浏览器仍然可以使用您的服务。 换句话说，无论你有 JavaScript 响应、对话框等，你都需要有一个降级的等价物。

如果您考虑到可访问性并且正确测试了两种用例（JavaScript 与非 JavaScript），您应该能够编写满足这两种受众的应用程序。

示例 ($(document).ready 调用为了清晰和简洁而省略：

<script>
  $("#hello").click(function(){
    alert("Hi");
  });
</script>
<a href="/say_hello.htm" id="hello">Say Hello</a>

一个简单的示例，但基本上，如果支持 JavaScript，这只会评估单击 JavaScript 事件。否则，它将像普通链接一样执行并转到 say_hello.htm - 您的作为开发人员的工作是确保这两种结果都得到适当的处理，

希望有所帮助！

Answer 3

渐进式增强当然是一种途径，但不引人注目并不是 JavaScript 可访问性的全部和最终目的，因为屏幕阅读器倾向于使用浏览器作为其工作的基础。 由于这些浏览器支持 JavaScript，因此页面上的脚本仍然会运行。 这是 AJAX 的一个特殊问题，因为单击页面的一个部分可能会更改屏幕阅读器不知道的页面的另一部分。

然而，随着 AJAX 的成熟，使其易于访问的方法正在出现。 查看 WAI-ARIA 了解使 AJAX 易于访问的现代方法，以及 Google 的 AxsJAX 了解实现它的好方法。

---

Answer 4

请参阅

• http://juicystudio.com/article/making-ajax -work-with-screen-readers.php
• http://juicystudio.com/article/improving-ajax-applications-for-jaws-users.php
• http://www.paciellogroup.com/blog/?p=15
• http://www-03.ibm.com/able/resources/ajaxaccessibility.html

您也可以看看 FlashAid，尽管它远非完美的解决方案。 （但是，如果您使用渐进式增强，并且仅在 Flash 存在且用户没有使用辅助功能 API 时使用 AJAX，那么对于 Windows，您可能有一个合理的解决方案。）

从长远来看，WAI-ARIA 是解决方案。 它在 JAWS 10（测试版）和 Firevox 中得到了一定程度的支持，但这对于当今的所有用户来说肯定是不够的。

Answer 5

JQuery 具有不引人注目的能力，因此易于访问。 诀窍是在 AJAX 调用周围提供冗余，以便没有 JavaScript 的浏览器仍然可以使用您的服务。 换句话说，无论您在哪里有 JavaScript 响应、对话框等，您都需要有一个降级的等价物。

重用代码的一种方法是让“简单”页面调用可自行调用的“函数”（或用于服务器端逻辑的任何内容），返回 JSON 或 XML。

例如：
/static/myform.asp（在服务器端，“包含”与/ajax/myform.asp相同的逻辑）
这样你就可以使用 asp 作为 django 的模板。

当然，使用功能齐全的花哨框架，您可以使这变得更加容易（想象一下在 django 中为同一视图提供一个 html 和一个 xml “模板”），但同样的想法也适用。

完成此操作后，使用 jQuery 迭代文档上的所有锚点并使用锚点自己的链接添加 onclick 事件，替换 /static/ajax/ 可以让您的生活更轻松。

谁能想到这会造成太大负担的原因吗？ 想知道这个“设计理念”是否存在严重缺陷。

Answer 6

我认为接受的答案虽然在当时还不错，但现在已经过时了。 （写这个答案时已经有十年了。WCAG 2.1 几周前完成......）

W3C WAI-创作设计模式实践文档包含常见小部件的各种示例，这些小部件需要 javaScript 以便向辅助技术传达正确的语义、状态和角色。

只要您在用户激活页面内更新之前小心地为屏幕阅读器提供有关页面内更新内容的相关语义线索，就可以使 AJAX 变得可访问。 您可能还需要通知屏幕阅读器之后实际发生的更改，例如 aria-live 区域可能会宣布“已加载 20 个新项目”或其他内容。 这是通过 javaScript 实现的。

如果您的可访问性知识停留在“渐进增强”，并且您将上面接受的答案视为该职位的基本原理，那么您很可能需要更新。 这些天事情进展很快。