标签: wai-aria

使用此代码:

<ul class="tabs-nav" role="tablist" >
       <li role="tab"><a href="#newspane"  id="tab-newnews">Latest News</a></li>
       <li role="tab"><a href="#presspane" id="tab-press"  >Press Releases</a></li>
</ul>

<div>
     <div id="pane-newnews" role="tabpanel" aria-labelledby="tab-newnews" aria-hidden="false">
        <p>Lorem</p>          
     </div>

     <div id="pane-press" role="tabpanel" aria-labelledby="tab-press" aria-hidden="true">
         <p>Ipsem</p>                     
     </div>
 </div>

我在W3C验证器上收到此错误:

"元素div上属性角色的错误值列表"

我已经翻过文档中的每一块石头,发现没有理由不能验证.谁能解释我做错了什么？

谢谢!

我试图让我的ember.js应用程序更容易访问,并通过Apple的内置VoiceOver实用程序进行测试.我正在根据我的观点添加ariaRoles并添加导航目的不明确的aria-label属性.我在关注模态警报时遇到了问题,因为读者的注意力集中在模态背后的页面项上.有没有人有经验处理专注于屏幕阅读器的模态警报？我的印象是在我的视图中声明"ariaRole:'alertDialog'"为这样的对话设置了适当的角色,并且这个角色的焦点行为可能在屏幕阅读器之间有所不同.谢谢!!!

当用户列出地标区域时，也会显示aria-hidden设置为true的ARIA地标角色。（使用JAWS时：Jaws key+ CTRL+ ;）

例：

<div role="region" aria-label="tools menu" aria-hidden="true">....</div>

仅在单击“工具菜单”按钮时显示

我的问题是

1. 有没有一种方法可以在用户列出地标角色时不显示此信息？
2. 当我使用地标性角色进入该区域时，大白鲨并没有宣布该特定区域是隐藏的。可能出了什么问题？我正在使用Jaws 12.0
3. 它按预期工作吗？

如果定义内容主要部分的最语义和最易访问的方式是标准<main>元素，那么使用 ARIA 地标似乎是多余的。添加role="main"元素真的有必要吗？

因此，HTML代码是这样的：

<div style="visibility: hidden; display: none; right: 0px;"> 
<img id="processing" src="PT_LOADING.gif" alt="Processing... please wait" title=""> </div>

即使提供了ALT文本，在更改样式以显示图标时（可见性：可见），也不会在出现加载图标的时间间隔内读取该文本。

角色=警报不是可行的解决方案，因为这不是警报

使用屏幕阅读器用户<nav>的嵌套<ul>列表增强网站地标的语义可访问性的最佳做法是什么？（aria-label 和 list level 目前并非所有屏幕阅读器都能发音）

我在 iOS 9 上使用 Voiceover、Android 5 上的 Talkback 和 Win10（在 Firefox 中）上的 NVDA 2016-1 进行了测试。我在屏幕阅读器应用程序中使用了（大部分）默认设置。

我认为以下列表应该是为屏幕阅读器用户准备的最佳选择：

演示代码 1

<nav>
  <ul aria-label="product navigation">
    <li><a href="product-a.html">Product A</a>
      <ul aria-label="sub menu Product A">
        <li><a href="product-a-spec.html">Specifications</a></li>
        <li><a href="product-a-acce.html">Accessories</a></li>
      </ul>
    </li>
    <li><a href="product-b.html">Product B</a>
      <ul aria-label="sub menu Product B">
        <li><a href="product-b-spec.html">Specifications</a></li>
        <li><a href="product-b-acce.html">Accessories</a></li>
      </ul>
    </li>
  </ul>
</nav>

预期结果：屏幕阅读器这样说：

• 导航地标的起点
• 具有两个元素的开始列表级别 1 “产品导航”
• “产品 A”链接
• 具有两个元素的起始列表级别 2 “子菜单产品 A”
• “规格”链接
• “附件”链接 …

我已经浏览了《难以置信的可访问对话框》 v3的代码，我注意到他们正在使用<h1>标签

<div id="modal" aria-hidden="false" aria-labelledby="modalTitle" aria-describedby="modalDescription" role="dialog">
    <div id="modalDescription" class="screen-reader-offscreen">...</div>
    <h1 id="modalTitle">...</h1>
    <p>...</p>
    <form name="form1" onsubmit="return false;">...</form>
</div>

这让我思考，这实际上在语义上是正确的吗？我的意思是每个人都在说<h1>文档中应该只有1 个。

请注意，在先前版本的对话框中，他们给对话框一个role="document"使用<h1>ok imho 的对话框

我有以下代码（来自此处）：

<div role="menubar">
    <ul role="menu" aria-label="functions" id="appmenu">
            <li role="menuitem" aria-haspopup="true" tabindex="0" aria-expanded="false">
                File
                <ul role="menu">
                            <li role="menuitem" tabindex="-1">New</li>
                            <li role="menuitem" tabindex="-1">Open</li>
                            <li role="menuitem" tabindex="-1">Print</li>
                    </ul>
            </li>
            <li role="menuitem" aria-haspopup="true" tabindex="-1" aria-expanded="false">
                Edit
                <ul role="menu">
                            <li role="menuitem" tabindex="-1">Undo</li>
                            <li role="menuitem" tabindex="-1">Redo</li>
                            <li role="menuitem" tabindex="-1">Cut</li>
                            <li role="menuitem" tabindex="-1">Copy</li>
                            <li role="menuitem" tabindex="-1">Paste</li>
                    </ul>
            </li>
            <li role="menuitem" aria-haspopup="true" tabindex="-1" aria-expanded="false">
                    Format
                    <ul role="menu">
                            <li role="menuitem" tabindex="-1">Font</li>
                            <li role="menuitem" tabindex="-1">Text</li>
                    </ul>
            </li>
            <li role="menuitem" aria-haspopup="true" tabindex="-1" aria-expanded="false">
                View
                <ul role="menu">
                    <li role="menuitem" tabindex="-1">100%</li> …

屏幕阅读器的重音由<html lang="[language]">元素控制。当 lang 属性设置为 "de" 时，一些英语单词如 "email" 发音为 "Emil"（德语名字）。有没有办法将 aria-label 中单个单词的重音切换为另一种语言或其他众所周知的解决方法来实现这一点？

就像是

<button aria-label="(lang=en:E-Mail) schreiben">

我正在使用 Unicode 星号显示产品评级。iOS VoiceOver 无法正确朗读此内容，因此我想我会aria-label在我的跨度上使用它来告诉屏幕阅读器它的含义。

<span aria-label="4.0 stars out of 5, 123 ratings">????? 4.0 (123)</span>

它不起作用。iOS VoiceOveraria-label完全忽略了我的。

我究竟做错了什么？我怎样才能解决这个问题？