我正在尝试使表格可访问.我应该让我的输入双双disabled和aria-disabled属性,或只是一个？
<label for="textbox1">Input</label>
<input id="textbox1" type="text" name="Text Box" disabled>
或者像这样？
<label for="textbox1">Input</label>
<input id="textbox1" type="text" name="Text Box" aria-disabled="true">
或者像这样？
<label for="textbox1">Input</label>
<input id="textbox1" type="text" name="Text Box" aria-disabled="true" disabled>
我有aria-haspopup适合子菜单的良好权限(例如弹出上下文菜单或子级菜单).它用于jQuery UI Selectmenu,也用于这个很棒的例子.
我无法弄清楚的是,是否aria-haspopup适用于以下两个例子:
target="_blank"是aria-haspopup在这些情况下,合适吗？如果没有,是否应该使用ARIA属性？
ngAria(一个辅助功能模块)正在为我的Angular Material项目添加一个不必要的bower导入 - 现在它正在抛出警告:
节点上缺少可访问性所需的属性"aria-label"
我只添加了ngAria,因为它似乎是ngMaterial所必需的.我的应用程序不需要屏幕阅读器可访问性.
无论如何,我如何从ngMaterial中删除ngAria？或者至少禁用所有警告.
编辑: 似乎禁用ngAria警告的唯一简单方法是console.warn = function() {};关闭浏览器的警告(我不建议这样做,因为它可能会隐藏与咏叹调无关的警告)
我有兴趣了解HTML5 <main>元素和ARIA地标角色属性之间的关系以及可能的区别role="main".
我的印象是<main>元素的目的是将ARIA roll属性映射role="main"到特定的HTML元素.但这总结了吗？
<main>比如说,使用过度是否有好处<div role="main">？或者,现在和可预见的未来,这些结果会产生相同的结果吗？
任何有关比较以下示例的见解将不胜感激:
<body>
<main>
<p>Paragraph</p>
<main>
</body>
<body>
<main role="main">
<p>Paragraph</p>
<main>
</body>
<body>
<div role="main">
<p>Paragraph</p>
<div>
</body>
我正在开发一个从Bootstrap框架扩展的设计系统.其中一个关键目标是可访问性.实现Bootstrap选项卡时,我发现它们适用role="presentation"于导航列表中的列表项.
所以我从Bootstrap模板中放了一小块测试HTML:
<ul class="nav nav-tabs">
<li role="presentation" class="active"><a href="#">Home</a></li>
<li role="presentation"><a href="#">Profile</a></li>
<li role="presentation"><a href="#">Messages</a></li>
</ul>
<ul class="nav nav-tabs">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Profile</a></li>
<li><a href="#">Messages</a></li>
</ul>
ARIA规范说,演示文稿的作用是:
预期用途是当元素用于更改页面外观但没有元素类型隐含的所有功能,交互或结构相关性时,
在我看来,这些<li>元素与使用辅助功能设备的人具有结构相关性,因为它们会告诉您存在多少个选项卡.例如,如果您发现第三个选项卡保存了您感兴趣的信息,导航到列表并知道有三个选项卡可以让您更快地获得所需内容.
此外,当使用ChromeVox访问该测试HTML时,列表会以相同的方式发布.所以似乎role没有任何实际效果.
我用Google搜索了这个问题,但没有找到任何关于它的讨论.那么,有谁知道为什么这是Bootstrap框架的一部分？
jQuery Grid插件插入以下HTML:
<td role="gridcell" style="" aria-describedby="list_createdBy">Sam</td>
'aria-describedby'属性是什么意思？
我有动态文本绑定到HTML页面上的ARIA-LABEL.这是一个有角度的2应用程序.我使用的是这样的:aria-label ="{productDetails？.ProductName}}的产品详细信息"
但是我收到一个错误 - 无法绑定到'aria-label',因为它不是'div'的已知属性.
这有什么解决方法吗？
在浏览了一些谷歌和其他SO文章之后,我决定明白地问我的问题,希望得到一个简单直接的答案.
在讨论中添加另一个步骤不透明度:0与可见性具有完全相同的效果:隐藏:我理解display:none并visibility:hidden隐藏屏幕阅读器之类的元素,但是怎么样opacity:0？
链接问题的答案之一中的表格指出不透明度参与taborder,那么这是否意味着它将被映射到可访问性API？
设置一个巨大的负片text-indent通常作为下拉菜单的替代display: none和visibility: hidden提供,但我想在没有JavaScript的情况下淡入淡出我的菜单,同时确保我不会将它们隐藏在屏幕阅读器中.
如何使用WAI-ARIA通知屏幕阅读器现在可以看到div？
如果我们得到了HTML
<div id="foo">Present main content</div>
<div id="bar" style="display: none;">Hidden content</div>
然后我们
$('#foo').hide();
$('#bar').show();
我们如何通知屏幕阅读器他们应该通知用户现在可见的div(或者可能自动关注现在可见的div)？
我目前正致力于使用ARIA标签制作一个可访问的网站.在我看来,像aria-invalid我这样的CSS的目标是优秀的选择器,而不是使用.error类.
这样做的好处是更精简,更有意义的HTML,我更容易从CSS(和JS)中获取.也就是说,我没有在其他地方看到过这种情况,所以我怀疑利用辅助功能标签进行样式设计会有缺点.我怀疑使用不受约束的属性选择器会降低性能较低的CSS,但还有其他缺点吗？
wai-aria ×10
html ×6
css ×2
html5 ×2
javascript ×2
angular ×1
html-input ×1
opacity ×1
xhtml ×1