ARIA是可访问富Internet应用程序的缩写。

WAI-ARIA是一种非常强大的技术，它允许开发人员以一种可以被辅助技术理解的方式轻松描述视觉丰富的用户界面的目的、状态和其他功能。WAI-ARIA最终被集成到HTML 5规范的当前工作草案中。

如果你想知道WAI-ARIA是什么，它是一样的。

请注意WAI-ARIA和ARIA指的是同一事物。但是，用WAI- aria来承认其起源于WAI更为正确。

WAI =网页无障碍计划

从外观上看，ARIA用于辅助技术，主要用于屏幕阅读。

读了这篇文章，你的大部分疑虑都会消除

http://www.w3.org/TR/aria-in-html/

WAI-ARIA is a spec defining support for accessible web apps. It defines bunch of markup extensions (mostly as attributes on HTML5 elements), which can be used by the web app developer to provide additional information about the semantics of the various elements to assistive technologies like screen readers. Of course, for ARIA to work, the HTTP user agent that interprets the markup needs to support ARIA, but the spec is created in such a way, as to allow down-level user agents to ignore the ARIA-specific markup safely without affecting the web app's functionality.

下面是ARIA规范中的一个例子:

<ul role="menubar">

  <!-- Rule 2A: "File" label via aria-labelledby -->
  <li role="menuitem" aria-haspopup="true" aria-labelledby="fileLabel"><span id="fileLabel">File</span>
    <ul role="menu">

      <!-- Rule 2C: "New" label via Namefrom:contents -->
      <li role="menuitem" aria-haspopup="false">New</li>
      <li role="menuitem" aria-haspopup="false">Open…</li>
      ...
    </ul>
  </li>
  ...
</ul>

注意外部<ul>元素上的role属性。此属性不会以任何方式影响浏览器在屏幕上呈现标记的方式;然而，支持ARIA的浏览器将向呈现的UI元素添加特定于操作系统的可访问性信息，以便屏幕阅读器可以将其解释为菜单，并在最终用户能够理解的情况下大声读取它(例如，显式的“菜单”音频提示)，并能够与之交互(例如，语音导航)。

我问了一些关于ARIA的问题。但它的内容看起来更有希望解决这个问题。想分享一下吗

什么是ARIA?

If you put effort into making your website accessible to users with a variety of different browsing habits and physical disabilities, you'll likely recognize the role and aria-* attributes. WAI-ARIA (Accessible Rich Internet Applications) is a method of providing ways to define your dynamic web content and applications so that people with disabilities can identify and successfully interact with it. This is done through roles that define the structure of the document or application, or through aria-* attributes defining a widget-role, relationship, state, or property.

在规范中推荐使用ARIA，以使HTML5应用程序更易于访问。在使用语义HTML5元素时，应该设置它们对应的角色。

看看这段ARIA直播视频。

什么是ARIA?

ARIA emerged as a way to address the accessibility problem of using a markup language intended for documents, HTML, to build user interfaces (UI). HTML includes a great many features to deal with documents (P, h3,UL,TABLE) but only basic UI elements such as A, INPUT and BUTTON. Windows and other operating systems support APIs that allow (Assistive Technology) AT to access the functionality of UI controls. Internet Explorer and other browsers map the native HTML elements to the accessibility API, but the html controls are not as rich as the controls common on desktop operating systems, and are not enough for modern web applications Custom controls can extend html elements to provide the rich UI needed for modern web applications. Before ARIA, the browser had no way to expose this extra richness to the accessibility API or AT. The classic example of this issue is adding a click handler to an image. It creates what appears to be a clickable button to a mouse user, but is still just an image to a keyboard or AT user.

The solution was to create a set of attributes that allow developers to extend HTML with UI semantics. The ARIA term for a group of HTML elements that have custom functionality and use ARIA attributes to map these functions to accessibility APIs is a “Widget. ARIA also provides a means for authors to document the role of content itself, which in turn, allows AT to construct alternate navigation mechanisms for the content that are much easier to use than reading the full text or only iterating over a list of the links.

重要的是要记住，在简单的情况下，更倾向于使用原生HTML控件和样式，而不是使用ARIA。也就是说，如果没有必要的话，不要重新发明轮子或复选框。

幸运的是，ARIA标记可以添加到现有站点，而不会改变主流用户的行为。这大大降低了修改和测试网站或应用程序的成本。

是什么?

WAI-ARIA stands for “Web Accessibility Initiative – Accessible Rich Internet Applications”. It is a set of attributes to help enhance the semantics of a web site or web application to help assistive technologies, such as screen readers for the blind, make sense of certain things that are not native to HTML. The information exposed can range from something as simple as telling a screen reader that activating a link or button just showed or hid more items, to widgets as complex as whole menu systems or hierarchical tree views.

这是通过将角色和状态属性应用到HTML 4.01或更高版本的标记来实现的，这些标记与布局或浏览器功能无关，但为辅助技术提供了额外的信息。

One corner stone of WAI-ARIA is the role attribute. It tells the browser to tell the assistive technology that the HTML element used is not actually what the element name suggests, but something else. While it originally is only a div element, this div element may be the container to a list of auto-complete items, in which case a role of “listbox” would be appropriate to use. Likewise, another div that is a child of that container div, and which contains a single option item, should then get a role of “option”. Two divs, but through the roles, totally different meaning. The roles are modeled after commonly used desktop application counterparts.

文档里程碑角色是一个例外，它不会改变相关元素的实际含义，而是提供关于文档中这个特定位置的信息。

第二个基石是WAI-ARIA状态和属性。它们定义了某些本机或WAI-ARIA元素的状态，例如是否折叠或展开某个元素，是否需要一个表单元素，是否附加了一个弹出式菜单等等。它们通常是动态的，并且在web应用程序的整个生命周期中改变它们的值，通常通过JavaScript进行操作。

它不是什么?

WAI-ARIA不打算影响浏览器行为。不像一个真正的按钮元素，例如，一个div，你把“按钮”的角色倒在上面，不会给你键盘的焦点性，一个自动点击处理程序，当空格或Enter被按下，和其他的属性是一个按钮本身的。浏览器本身并不知道角色为“button”的div是按钮，只有它的可访问性API部分知道。

因此，这意味着你必须自己实现键盘导航、聚焦性和其他从桌面应用程序中了解到的行为模式。你可以在这里找到一些高级ARIA技术。

什么时候不应该使用它?

是的，这是正确的，这部分是第一位的!因为使用WAI-ARIA的第一条规则是:除非必须，否则不要使用它!WAI-ARIA越少，使用原生HTML小部件就越可靠，越好!还有一些规则需要遵守，你可以在这里查看。