7

我了解到该<abbr>标签应该由屏幕阅读器解释，其title属性将在屏幕阅读器读取时替换其内容。但是，当我尝试这样做时，MacOS（Firefox 和 Safari）Voiceover 和 NVDA（Windows 10、Edge 和 Firefox）都不是这样工作的。这是相关的代码部分：

... bla bla bla <abbr title="nervus">N.</abbr> peronaeus ...

（这是医学表达）

IMO 这应该读作“... bla bla bla nervus peronaeus ...”，但读作“... bla bla bla N.”，然后是长时间的沉默（或者屏幕阅读器甚至在它之前停止），显然是因为点，然后是“peronaeus ...” - 没有“nervus”...

我是否正确使用了语法，或者有什么我遗漏的东西？或者，如果这是正确的：我可以添加任何 WAI-ARIA 代码或类似代码以使其按照大多数屏幕阅读器的方式工作吗？

4

3 回答 3

4

您不能真正依赖用户听到title元素的属性。这是关于屏幕阅读器如何处理 HTML 元素的一个很好的资源，对于abbr，条目如下：

如您所见，屏幕阅读器通常只是读出元素内容。由于N.包含一个句号，它只是读出“N”，然后对该句点进行句号。您可以设置屏幕阅读器来阅读title内容，但这是一个可选设置，因此您不应该依赖它。真的没有办法为屏幕阅读器设置内容title。

于 2017-08-19T21:25:23.807 回答
3

abbr标签只是误导。

在您的情况下，您不想只向盲人用户提供信息，而是向忽略看似常见的医学缩写词的人提供信息。不使用屏幕阅读器的非盲人用户需要此信息。

相反，使用盲文显示器的盲人确实喜欢缩写。很多。

如果您想要一种非常有效的方法来处理缩写，请使用词汇表：

 <a href="/glossary/nervus-peronaeus"
        aria-label="Nervus peronaeus"
        title="Nervus peronaeus" class="glossary">N. Peronaeus</a>

对aria-label链接有很好的支持，该title属性可以用来给非屏幕阅读器用户一个提示。

例如，可以将词汇表插入页面底部。

 <a href="#nervus-peronaeus"
        aria-label="Nervus peronaeus"
        title="Nervus peronaeus" class="glossary">N. Peronaeus</a>

我处理缩写的首选方法是不使用它们。

Nervus Peronaeus

清除。简洁的。这似乎微不足道，但是当您认为缩写值得解释时，这对每个人（运动、视觉、认知障碍）都是最好的方法。

当然，对于语言的缩写部分，您不需要解释它们（FBI，NATO，...）。在面向专业人士的医疗网站中，只有“N. peronaeus”一词可能是目标公众语言的一部分。

于 2017-08-20T07:47:30.010 回答
0

另一种方法：在页面的第一个实例上使用完整的术语加上括号中的缩写，然后仅使用其后的缩写。维基百科：“超文本标记语言 (HTML) 是用于创建网页和 Web 应用程序的标准标记语言。” https://en.wikipedia.org/wiki/HTML

于 2018-03-26T21:22:07.950 回答