aria和role

一.摘要

目前互联网应用日益增强，其中大部分是通过混合技术（AJAX、DHTML、JavaScript 和 SVG）创建或自定义一些模拟桌面GUI程序的的 Web widget 小组件来增强 Web 应用程序的交互，但部分类似Dialog 的对话框、弹出层，模拟select 的下拉菜单等小组件并没能提供所需的语义作支持，残障人士有可能无法读懂当前信息。

屏幕读取器、语音识别软件和屏幕键盘均通过特定的语义标识（title、button~）读取网页组件本质信息，而WAI-ARIA 角色标准在语义化标识约定方面起至关重要的作用。现在不但Firefox、Safari 4.0、Google 早已支持 WAI-ARIA，而且IE8 也开始部分支持，各种的JavaScript库支持WAI-ARIA将会是一个趋势。

二.介绍

role的作用是描述一个非标准的tag的实际作用。比如用div做button，那么设置div 的 role="button"，辅助工具就可以认出这实际上是个button。

aria的意思是Accessible Rich Internet Application。可以看出，它用来标识页面中涉及到动态交互的地方，这些交互通常是由js和相关技术来实现的，例如浮出层，对话框弹出，下拉列表以及伪元素等。

aria-*的作用就是描述这个tag在可视化的情境中的具体信息。

aria由一套属性组成，属性分为role以及对应的states和properties，aria将html元素分为六种role，每种有对应的states和properties，但有一些是共用的。