Question

我有一个带有大量食谱的简单网络应用程序，我正在努力让使用屏幕阅读器的用户可以访问它。

烹饪温度通常简单地表示为C（摄氏度）和F（华氏度）。

屏幕阅读器将这些视为字母，我认为这有点令人困惑，因为我们正在谈论温度。

我的目标是保持这样一句话：

<p> Turn the oven on to 350 F </p>。

不幸的是，屏幕阅读器将其读作：

"Turn the oven on to three hundred and fifty f"。

我希望屏幕阅读器像这样发音：

"Turn the oven on to 350 degrees Fahrenheit"

是否有可能以某种方式明确指示屏幕阅读器如何阅读特定的字母或单词？是否可以使用ARIA表示法实现，或者我是否只有一个黑客，我有一个看不见的句子：

<p> Turn the oven on to 350 degrees Fahrenheit </p>

Answer 1

它应该表示为 °C （和°F，直到美国加入这个星球的其他国家^^）。只有开尔文度没有a° 它应该有助于屏幕读者理解它是一个单元，虽然我没有测试它们。否则，带有abbr元素的@ boby212解决方案是WCAG 2.0技术：Providing definitions for abbreviations by using the abbr and acronym elements

Answer 2

使用abbr标记。

<p> Turn the oven on to 350 <abbr title="Fahrenheit">F</abbr> </p>.

但是你的屏幕阅读器应该配置为说缩写。

设置你的大白鲨： - ＆GT;公用事业＆gt;设置中心 - ＆GT; web / HTML / PDF＆gt;阅读＆gt; expand缩写。

Answer 3

我是一名屏幕阅读器用户，据我所知这是不可能的。即使有可能也没有必要。任何有足够知识使用屏幕阅读器的人也可以通过上下文告诉为什么在数字后面有F或C.只是因为这听起来让你感到困惑并不意味着长时间使用屏幕阅读器的人会感到困惑。

Answer 4

好吧，只是发布另一种解决此问题和类似问题的方法（比如在表格标题中使用单个字母作为记分板）您可以做的是@ boby212说并使用<abbr title="celsius">°C</abbr>，但正如一般情况下，一些屏幕阅读器默认宣布缩写。

..所以另一种方法是使用ARIA并替换像这样的视觉缩写：

<p>Put the oven on 250<span aria-hidden="true">C</span><span class="visually-hidden">Celsius</span>.

然后用CSS隐藏.visually-hidden，如下所示：

.visually-hidden{
  position: absolute;
  left: -999em;
}

正如我所说，这也可以用于表格或显示3个字母的月份，以及更多用例。希望这有助于将来的情况。

如何让屏幕阅读器读取C / F为Celsius / Fahrenheit？

4 个答案: