可访问性和所有这些JavaScript框架

我已经研究了一些JavaScript框架，比如Backbone.js和Batman.js有一段时间了，虽然我真的很喜欢它们，但我有一件琐碎的事情一直在重复。这个问题是可访问性

作为一名web开发人员，我一直在努力使我的网站和应用程序具有可访问性，特别是使用渐进增强的思想

很明显，这些新的JS框架并没有优雅地降级，所以我想知道其他开发人员对这个问题有什么想法，你对此做了什么。毕竟，网站/应用程序的可访问性并不是一件可选择的事情，因为它是许多国家法律的一部分

也许我只是对这个问题过于热心，没有意识到在可访问性方面已经取得了多大进展。

任何需要javascript才能从中获取内容的网页都可能会遇到与可访问性相关的挑战。JavaScript框架的可访问性无疑是一个争论的问题，尽管事实上，任何web应用程序在动态提供内容时都会遇到缺点，而不管所使用的框架是什么

没有什么灵丹妙药可以确保您的站点可以访问，我当然不能解释每个JavaScript框架。以下是关于如何在使用JavaScript时防止站点完全不可访问的一些想法：

• 遵循的指导原则，从和一般

• 避免使用需要完全通过javascript生成页面UI、控件和/或内容的框架，如，或使用自己专有标记的框架，如。您越能坚持使用静态（-ish）、语义HTML内容，您的境况就越好

• 考虑使用诸如和属性来指示页面中的动态区域。随着时间的推移，辅助设备支持越来越多的aria角色，因此当您可以适当地将这些aria属性添加到应用程序中时，使用这些aria属性是有意义的
  对于JS库，检查它们的源代码，看看它们是否输出了任何aria角色。他们可能无法完全接近，但这将表明他们正在考虑使用辅助设备

• 只要有可能，就将JavaScript视为一种增强，而不是必要的。尝试提供其他方法或工作流来访问不需要动态页面更新的重要信息

• 与您的用户一起测试和验证您的应用程序！与使用辅助设备或使用web软件有其他困难的人进行一些用户测试。没有什么比观看真人使用网站更能帮助你证明你的网站是可访问的

最后一点是最重要的，尽管许多人试图逃避它。不管采用哪种技术，事实仍然是，您正在开发一个人们将使用的应用程序。没有任何机器或理论能够完美地验证您的应用程序是否可用，但无论如何，您并不是在为机器构建应用程序。对吧？：）

我在我的最新网站中使用了一个js框架（在我的例子中是spine.js）。不过，我还是要确保非js浏览器（当然不要过于热心：想想SEO）可以浏览我的网站并消化内容

作为一个例子，我将使用一个显示产品的搜索页面。产品可以分页、过滤、排序。当然，这是广义思想的一个例子

PREREQ：使用一个可以同时呈现服务器端和客户端的模板引擎。（我用胡子）。这确保了您可以通过服务器端模板在不使用js的情况下渲染模型，并通过客户端模板在使用js的情况下渲染模型

最初：使用服务器端胡须模板渲染产品。还包括一个“bootstrapJSON”-对象，该对象包含JSON格式的相同产品

最初：所有链接（产品详细信息页面、分页、排序、筛选）都是真正的服务器端URL（没有hashbang URL）

最终的结果是，页面可以100%导航，无需使用JS即可进行分页、排序和过滤

所有分页、排序和筛选URL都会导致向服务器发出请求，这反过来又会导致呈现一组新的产品。这里没什么特别的

JS已启用-加载时：

• 获取bootstrapJSON并从中创建产品模型（使用您的js框架特性来实现这一点）
• 之后，使用相同的胡须模板重新发布产品，但现在在客户端执行。（再次使用js框架）
• 在视觉上，什么都不应该改变（在使用相同的模板在相同的模型上完成所有服务器端和客户端渲染之后），但至少现在客户端模型和视图之间存在绑定
• 将URL转换为hashbang URL。（例如：/products/#sort price asc）并使用js框架功能连接事件

现在，每个（过滤、分页、排序）url都会导致客户端状态的更改，这可能会导致js框架向服务器发出ajax请求，以返回新产品（JSON格式）。在客户机上再次重新提交此文件将导致更新视图

代码的逻辑部分用于处理6中的ajax请求。服务器端上的代码与4中使用的代码完全相同。区分ajax调用和普通请求，并分别以JSON或html（使用mustache服务器端）显示产品

编辑：更新日期2013年1月 由于这个问题/答案得到了一些合理的关注，我想我会分享去年一些密切相关的aha时刻：

• 抛出JSON并使用您选择的客户端mvc（上面的步骤6和步骤7）在客户端呈现JSON可能需要相当高的cpu成本。当然，这在移动设备上尤其明显

• 我