什么是HTML5 ARIA?

什么是HTML5 ARIA?我不知道如何实施它。

142589 次浏览
小开

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

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

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

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

WAI =网页无障碍计划

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

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

< a href = " http://www.w3.org/TR/aria-in-html/ " rel = " noreferrer > http://www.w3.org/TR/aria-in-html/ < / >

小开
最佳答案

wai - aria是一个规范，定义了对可访问web应用程序的支持。它定义了一堆标记扩展(主要是HTML5元素上的属性)，web应用程序开发人员可以使用这些扩展为屏幕阅读器等辅助技术提供关于各种元素语义的附加信息。当然，为了让ARIA工作，解释标记的HTTP用户代理需要支持ARIA，但是规范是以这样一种方式创建的，以允许底层用户代理安全地忽略特定于ARIA的标记，而不影响web应用程序的功能。

下面是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?

如果你努力让不同浏览习惯和身体残疾的用户都能访问你的网站，你可能会认识到role和aria-*属性。WAI-ARIA(可访问的富互联网应用程序)是一种提供定义动态web内容和应用程序的方法，以便残疾人士可以识别并成功地与之交互。这可以通过定义文档或应用程序结构的角色来实现，或者通过定义小部件角色、关系、状态或属性的aria-*属性来实现。

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

并看到这个You tube视频 ARIA现场。

小开

什么是ARIA?

ARIA的出现是为了解决使用用于文档的标记语言(HTML)来构建用户界面(UI)的可访问性问题。HTML包含许多处理文档的特性(P, h3,UL,TABLE)，但只有基本的UI元素，如a, INPUT和BUTTON。Windows和其他操作系统支持api，允许(辅助技术)AT访问UI控件的功能。Internet Explorer和其他浏览器将原生HTML元素映射到可访问性API，但是HTML控件不像桌面操作系统上常见的控件那样丰富，对于现代web应用程序来说也不够。自定义控件可以扩展HTML元素，以提供现代web应用程序所需的丰富UI。在ARIA之前，浏览器没有办法将这种额外的丰富性暴露给可访问性API或AT。这个问题的经典示例是向图像添加单击处理程序。它创建了一个对鼠标用户来说似乎是可点击的按钮，但对键盘或AT用户来说仍然只是一个图像。

解决方案是创建一组属性，允许开发人员使用UI语义扩展HTML。具有自定义功能并使用ARIA属性将这些功能映射到可访问性api的一组HTML元素的ARIA术语是“小部件”。ARIA还为作者提供了一种记录内容本身角色的方法，这反过来又允许AT为内容构建替代导航机制，这种机制比阅读全文或仅在链接列表上迭代要容易得多。

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

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

小开

是什么?

WAI-ARIA代表“无障碍网页计划-无障碍富互联网应用程序”。它是一组属性，用于帮助增强网站或web应用程序的语义，以帮助辅助技术(如盲人屏幕阅读器)理解某些不是原生HTML的东西。暴露的信息可以是简单的告诉屏幕阅读器激活一个链接或按钮只是显示或隐藏了更多的项，也可以是复杂的小部件，比如整个菜单系统或分层树视图。

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

WAI-ARIA的一个基石是角色属性。它告诉浏览器告诉辅助技术，所使用的HTML元素实际上不是元素名称所暗示的，而是其他东西。虽然它最初只是一个div元素，但这个div元素可能是一个自动完成项目列表的容器，在这种情况下，“listbox”的角色将是合适的。同样地，另一个div是该容器div的子div，它包含一个选项项，然后应该获得“option”的角色。两个div，但通过角色，完全不同的意义。这些角色是根据常用的桌面应用程序对应的角色建模的。

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

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

它不是什么?

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

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

什么时候不应该使用它?

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


提交答案