html 中的可访问性：专注和说话？答案

【问题标题】：Accessibility in html: focus and speak?html 中的可访问性：专注和说话？
【发布时间】：2017-11-01 02:47:30
【问题描述】：

我在 iOS 中使用 UIWebView 处理以下 html 代码：

  <body>
    <p><strong>IMPORTANT:</strong> This is desc text.</p>
...
    </body>

我想要集中注意力并说“重要提示：这是描述文本。”在具有可访问性的同时，如果我使用以下内容，请只专注并说“重要”

    <body>
    <p aria-selected="true" ><strong>IMPORTANT:</strong> This is desc text.</p>
...
    </body>

如果我使用以下内容，可以集中注意力但不会说重要

    <body>
    <p aria-selected="true" ><strong aria-hidden="true">IMPORTANT:</strong> This is desc text.</p>
...
    </body>

【问题讨论】：

标签： ios webview accessibility wai-aria

【解决方案1】：

您错误地使用了aria-selected。它应该只在（复杂的）小部件角色中使用，以指示小部件的哪个部分具有焦点。正确使用的例子是菜单或标签列表。

如果您想关注文档的一部分以使其立即发布，请使用tabindex="0" 或tabindex="-1"（取决于您是否希望在文档中切换时关注该元素），然后使用element.focus()在适当的时候。

<body>
<p tabindex="0" ><strong>IMPORTANT:</strong> This is desc text.</p>
...
<script>
...
// When the element should be focussed
element.focus();
...
</script>
</body>

但是，您可能更愿意使用role="alert" 来获取自动宣布的信息，而无需设置焦点。

【讨论】：

我尝试了您的解决方案但失败了。
它是怎么失败的？你能创造一个小提琴吗？

【解决方案2】：

如果您想关注可以使用的任何元素tabindex="0"，tabindex 定义了您希望元素获得焦点的顺序。

如果你想阅读任何文本，你可以使用 aria-label 属性来实现它。

例如：如果您想阅读“重要提示：这是描述文本”。只需使用 aria-label="重要这是描述文本。"

【讨论】：