我在使用 NVDA 屏幕阅读器时遇到问题，因为它将在一个块中的同一行上读取所有元素。
例如，使用以下代码：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Title</title>
<style>
nav > ul > li {
list-style: none;
display:inline-block;
}
</style>
</head>
<body>
<h1>Title 1</h1>
<nav role="navigation">
<ul>
<li>
<a href="#">Link 1</a>
</li>
<li>
<a href="#">Link 2</a>
</li>
<li>
<a href="#">Link 3</a>
</li>
<li>
<a href="#">Link 4</a>
</li>
</ul>
</nav>
</body>
</html>
这将在一行中显示所有导航链接，这在视觉上是正确的，但 NVDA 在浏览模式下，当使用箭头键滚动时，会将所有链接一起阅读。用户不能在每个单独的链接之间移动，这意味着不可能停留在一个链接上并选择它。
段落中间的链接也会发生同样的情况：
<p>NVDA will not stop on <a href="#">This link</a> so a user can select it.</a>
在我的导航示例中，更改样式使每个链接位于单独的行上：
nav > ul > li {
list-style: none; …我正在使用 CSS 内容从字体集生成图标。问题是屏幕阅读器，尤其是 JAW，也在读出内容！
所以如下：
<span class="uxf-icon uxf-search"></span>
和：
.uxf-search::before {
content: ";"
}
因此屏幕阅读器实际上会读出“分号”。有没有办法阻止它这样做？我知道 say:none CSS 标签实际上不起作用！
css accessibility screen-readers wai-aria jaws-screen-reader
我正在处理的代码需要通过 Tenon.io 的测试，它标记了 SVG 中发生的问题，特别是测试 ID 75（这个“id”被多次使用）。这是失败的，因为 SVG 对类似元素具有相同的 id，因为它们是由同一个程序（我相信是 Illustrator）生成的，并且页面上出现了多个。我认为 SVG 中的任何内容都是无关紧要的，不应被屏幕阅读器或 Tenon.io 的爬虫标记甚至遍历。
我已经测试了 VoiceOver 中出现此问题的页面，但它被忽略了。其他屏幕阅读器也会这样做吗？是否有任何屏幕阅读器遍历 SVG DOM 的风险？
我在包含新的应用程序图标时遇到问题。我已经做的是以下内容：
我存档并验证了我的应用程序，并得到了分辨率为 120x120 px、152x152 px 和 167x167 px 的图标丢失的信息。所以我创建了那个 PNG 文件并将它存储在 Finder 的一个文件夹中。
然后我在项目导航器（Xcode 8.2）中选择根节点，转到“常规”选项卡并打开“应用程序图标和启动图像”披露。在那里我点击了箭头图标。资产管理器显示为选中条目“AppIcon”。到目前为止一切顺利。
现在文档说我必须将我的 PNG 文件从 Finder 拖放到该资产表中。
但我的问题是我是屏幕阅读器用户，所以我无法使用鼠标来处理此类操作。这就是为什么我想问是否有使用键盘快捷键或导入菜单的替代方法，或者我是否可以通过使用文本编辑器编辑 Xcode 项目文件来手动包含 PNG 文件？非常感谢您的帮助！
我使用:before绑定到特定类的伪元素在p标签前添加符号，CSS 如下所示：
td > p.markerclass1:before {
position: absolute;
left: -1rem;
content: '*';
}
我在 Wordpress 主题中使用它，用户可以p在其中为编辑器中的标签选择该类，以便将该符号放在当前段落的左侧。
但是，该网站应该可以访问，并且屏幕阅读器（至少是 NVDA，我正在使用它进行测试）正在读取我不想要的伪元素和包含的符号。但由于此元素不在 HTML 代码中，因此我无法添加aria-hidden = 'true'以对屏幕阅读器隐藏它。
知道我该怎么做才能让屏幕阅读器忽略这些伪元素吗？
以以下标记为例：
<label for="email">Email</label>
<input type="email" placeholder="foo@bar.baz" id="email" />
<label for="cc">Credit card</label>
<input type="input" placeholder="XXXX XXXX XXXX XXXX" id="cc" />屏幕阅读器会读取类似“电子邮件字段，foo at bar dot com”、“信用卡 XXXX 空间 XXXX 空间 ...”之类的内容吗？如果是，我想这不是最好的用户体验，最好避免以这种方式使用占位符。是否有指南或示例说明如何向用户提供简短提示，以帮助用户以适用于所有用户的易于理解的格式输入数据？
在我的网页上，我有一个div（如下所示），其中包含我希望屏幕阅读器阅读的文本。
超文本标记语言
<div tabIndex={0}>
"text needs to be read"
</div>
我什至不需要提供咏叹调标签就可以听到文本被读取。不过，我听说“文字需要组读”。我想知道如何避免说“团体”？我没有为 div 标签设置组角色。
这是另一个更清晰地描述问题的例子
<span class="jw-icon jw-icon-inline jw-button-color jw-reset jw-text-live" tabindex="-1" data-clicked="true">Live</span>
在任何浏览器中运行上面的代码片段。它使屏幕阅读器将其宣布为“Live，group”。有什么办法可以减轻这种行为。预期的行为应该像屏幕阅读器应将其读作“实时”
这两种屏幕阅读器技术在表单上是否有任何区别，一种比另一种更受鼓励：
<label for="titleInput">Title</label>
<input type="text" id="titleInput" name="title" value="">
<div>Title</div>
<input type="text" aria-label="Title" name="title" value="">第一种方法一直是设置它的方法，但是自从引入 WAI-ARIA 后，我开始思考使用aria-label表单是否比使用<label for="x">.
我已经实现了聚焦第一个选项卡的要求（基本上是<a>我已经实现了关注模式对话框中存在的
当使用 NVDA 屏幕阅读器测试该功能时，我们发现在读取对话框标签和描述（由 aria-labelledby 和 aria-scribedby 指向）后，它会读取聚焦的选项卡元素。但是，之后它会继续从模态标题开始读取整个模态对话框内容。这不是我们想要的阅读行为。
如果我们将焦点放在模式对话框内的第一个输入元素上，而不是 tab( <a>) 元素上，它就可以正常工作。NVDA 在读取焦点输入元素后暂停。仅当我们使用 Tab 键导航时才会读出更多元素。这是我们想要的阅读行为，但我们不想聚焦输入元素。
演示链接可以在这里找到： https: //codepen.io/kaashan/pen/KOmGYe 。使用的代码来自 W3.org 模式对话框的可访问性指南，进行了少量修改以显示选项卡并将第一个选项卡元素集中在模式打开上。
我使用 NVDA2019.1.1 版本以及最新版本的 Chrome 和 Firefox 浏览器进行测试。
有人可以帮助解释在读取焦点 tab( <a>) 元素后应该做什么来暂停 NVDA 吗？
我想知道使用Twitter Bootstrap框架和FontAwesome图标字体的屏幕阅读器可访问性.
我正在看两种不同的图标情况:
1)图标具有屏幕阅读器将拾取的帮助文本:
<a href="#" class="btn btn-default" role="button"><span class="fa fa-pencil"></span> Edit</a>
2)没有任何帮助文本的独立图标:
<a href="#" class="btn btn-default" role="button" title="Edit"><span class="fa fa-pencil"></span></a>
理想情况下,在这两种情况下,屏幕阅读器都会宣布元素是"编辑"按钮.
Per FontAwesome的网站:
与其他图标字体不同,Font Awesome不会绊倒屏幕阅读器.
我没有看到任何speech与FontAwesome或Bootstrap相关的css标签,也不清楚屏幕阅读器如何对这些情况做出反应.
我也知道aria-hidden和Bootstrap .sr-only,并且必须有一种理想的方法来处理这两种情况.
编辑:添加title="Edit到示例2.
使用aria-label="Edit"超过标准有什么优势title="Edit"？
编辑2:我遇到了这篇文章,解释了不同用途实现的优缺点.
css accessibility screen-readers twitter-bootstrap font-awesome