理解WAI-ARIA
W3C的WAI-ARIA（Web Accessibility Initiative誷 Accessible Rich Internet Applications）套件是一套独立的规范，它弥补了HTML 4中的不足，帮助Web应用程序和Web页面变得更具可访问性。
假设你已经编写了一个滑动条控件。在HTML 4中没有本地的滑动条，因此你只是用一些HTML元素（一个<input>和一些图像），并且附加了一些JavaScript代码来使其外观像一个滑动条，并实现相关功能。没有办法告诉操作系统，该小挂件的角色就是一个滑动条，以及它当前的状态和值是多少。如果操作系统不能理解重要的信息，像屏幕阅读器这样的辅助性技术也无法将其传达给用户。
ARIA的目标是，通过引入浏览器和辅助性技术能够识别的一系列的新属性，来弥补这种情况。
广州网站建设,网站建设,广州网页设计,广州网站设计
理论上讲，你可以使用陈旧的HTML，再向其添加ARIA：
- <font size="+5" color="red">I should be a heading</font>
从而得到：
- <font size="+5" color="red" role="heading" aria-level="2">
- I should be a heading</font>
上述代码告诉用户代理，这段文本是标题，层级为2。因为HTML已经用一种绝对有效和语义化的方式定义了这种结构：
- <h2>I AM a heading</h2>
开发者可能会忘了添加必要的ARIA属性，而使用了正确的<h2>元素，该元素有内建的“标题性”和内建的层级，从而健壮很多。ARIA对于开发者来说并不是万能药和救命稻草，可以让他们开始滥用标记并把所有内容置于<div>和<span>之外。尽可能地使用正确的标记，并且只有在正确的语义无法表示的情况下（例如，HTML 4中的滑块条示例），才使用ARIA。
ARIA规范说：“我们期望，随着时间的流逝，主语言将会通过改进，能够为之前只能使用WAI-ARIA声明的那些对象提供语义。当给定功能的本地语义变得可用时，开发者应该开始使用本地功能，并且停止使用WAI-ARIA来实现该功能”。
因此，像HTML 5<nav>这样的内容不需要添加ARIA role= navigation，因为它应该（在理想的情况下）已经内建了该功能。然而，HTML 5还很新，而ARIA已经在辅助性技术中得到了一些支持。因此，使用内建的元素加上ARIA信息，应该无伤大雅，并且它还可以帮助那些依赖于辅助性技术的用户。位于html5.validator.nu的HTML 5验证器，既能够验证ARIA，也能够验证HTML 5（而HTML 4验证器会把ARIA信息报告为一个错误，因为HTML 4比ARIA出现得早）。
ARIA文档结构和重要角色
WAI-ARIA定义了几种角色，告诉辅助性技术一个文档的重要部分和结构。其中一些如下：
application
article
banner
complementary
contentinfo
document
form
heading
main
navigation
search
从ARIA的视角来看一个简单的页面，你可能会看到图2.18所示的情况。
广州网站建设,网站建设,广州网页设计,广州网站设计
 |
其中的一些明显地和HTML 5元素匹配，例如<article>、<form>、<header>和<nav>。
其他的没有如此明显的一一对应。例如role=banner，通常包含这样的内容，站点赞助商的标志或标识，以及特定于站点的搜索工具。一个banner通常出现在页面的顶部，并且通常横跨整个页面的宽度。这最初似乎对应于HTML 5的<header>，但是正如你看到的，一个页面上可能有多个<header>。因此，“页面页眉”是唯一允许拥有role=banner的。
类似地，contentinfo定义为包含了关于父文档的信息的一个大块可感知区域。这个区域内的信息的示例包括版权和到隐私声明的链接。这听起来像是<footer>，但是在带有多个页脚的一个页面中，这只是“页面页脚”，而不是每个页脚。
role=main定义了页面的“主内容区域”。我们在第1章中讨论了如何用算法来推导它，但是由于辅助性技术现在可以使用ARIA，对于要用来组织主内容的元素，添加这个角色是有意义的。我们甚至可以在理解属性选择器的浏览器中将其用作CSS的钩子：
- div[role=main] {color:red; background-color:yellow;
- font-family: "Comic Sans MS", cursive; ... }
现在我们得到了想要的状态：可访问性和漂亮的外观共建和谐页面。
组合ARIA和HTML 5
我们推荐你考虑对HTML 5附加使用ARIA，作为改善可访问性的传统方法，而且对验证也没有害处（参见下面关于屏幕阅读器的提示）。然而我们在本书中没有这么做（因为我们在介绍HTML 5，而不是ARIA）。
ARIA资源
在HTML 5和ARIA的规范中，有一个有用的交叉引用，参见dev. w3. org/html5/spec/embedded-content-0.html#annotationsfor-assistive-technology-products-aria。Paciello Group的Steve Faulkner给出了没有构建到HTML 5中的ARIA信息的一个列表，位于www.paciellogroup.com/blog/?p=585。
要了解ARIA的更多信息，参见Gez Lemon的“Introduction to WAI-ARIA”，位于dev.opera.com/articles/view/introduction-to-wai-aria/，并且可以访问The Paciello Group的博客(www.paciellogroup.com/blog/)。两本值得推荐的图书是Wendy Chisholm和Matt May编写的《Universal Design for Web Applications》(O誖eilly)，以及Todd Parker et al编写的《Designing with Progressive Enhancement: Building the Web that Works for Everyone》(New Riders)，它们都是关于ARIA的实用资料。ARIA规范本身位于www.w3.org/WAI/PF/aria/。
