Question

我正在做Web无障碍工作。但是当我在iOS11中使用画外音时，我发现焦点不好。在那之前没有问题。

请参见下面的示例。

<a href="#test">skip</a>
[focus O]
1) <div id="test" tabindex="-1">test1</div>
2) <div id="test" tabindex="-1"><span>test1</span></div>
3) <div id="test" tabindex="-1"><img src="url" alt="test"></div>

[focus X]
1) <div id="test" tabindex="-1">test1<img src="url" alt="test"></div>
2) <div id="test" tabindex="-1">test1<span>test2</span></div>

如果一个元素中有两个以上元素，那么似乎没有。

这是什么原因？

有什么解决办法吗？

Answer 1

试图理解您的问题。我不确定您的“焦点O”和“焦点X”是什么意思。我认为“ O”是一个很好的例子，“ X”是一个不好的例子。

VoiceOver将导航到DOM中的每个元素，因此在您的“ X”示例中，VO将停止在<div>test1<div>上，然后停止在嵌入式<img>上。在第二个示例中，VO将停止在<div>test1<div>上，然后停止在嵌入式<span>上。

如果要更改此行为，可以将role="text"添加到<div>，因此您的“ X”示例为：

<div id="test" tabindex="-1" role="text">test1<img src="url" alt="test"></div>
<div id="test" tabindex="-1" role="text">test1<span>test2</span></div>

这将使整个<div>成为一个焦点区域，并将所有文本读取为一个。但是，这也将失去图像作用。您会听到图片的alt文字，但不会听到宣布的图片角色。

为什么不专注于iOS11？

1 个答案: