如何使用听觉CSS？

Question

我读到一个地方说不再使用听觉样式表？有什么东西取代了它们吗？我确定 某些东西 被用来让视障人士的生活变得更轻松？
如果听觉CSS还在使用，有没有办法指定在特定地方应该说什么，类似于使用图像"alt"？例如，我正在为我的徽标使用 iconfont。我希望能够让用户听到我公司的名字，但是因为它只是用一个跨度完成的，所以在那个特定的跨度中没有地方可以指示单词（我在这里假设系统读取单词显示在屏幕上，而不是所有代码，所以很明显，如果有实际文本可供阅读，这样效果会更好）。也许包括一个内容：'whatever text you want' is added somehow?

要点是我正在为客户开发一个关于歌剧的网站，客户希望每个人都可以访问该内容。显然，有视力障碍的人会特别想听到的东西。

Answer 1

根据 W3，它在 CSS 2 中定义 - 但已被 CSS3 弃用。您还可以查看语音模块：http://www.w3.org/TR/css3-speech
您可以使用另一个 span 仅针对屏幕 reader 的特定内容，它看起来像：

<span aria-hidden="true">Here could be your company name</span>

来源：http://www.456bereastreet.com/archive/201205/hiding_visible_content_from_screen_readers_with_aria-hidden/

Answer 2

1.有听觉的替代品吗？

自 CSS3 起，听觉样式表确实已被弃用。 Firefox 等主流浏览器 removed the implementation a while ago. There is still a speech media included, but I haven't seen any implementations so far (it just seems to be a proposal 此时）。

许多有视力障碍的人使用 screen readers and to a lesser degree refreshable braille displays 来查看内容，因此您通常不必担心直接执行语音。重要的一点是：

人们必须能够使用标签键
所有相关的丰富内容（例如图像等）都需要有对应的文本。
你的 html 应该是语义化的（看看 aria attributes）

2。如何使图标字体（和其他不易辨认的项目）易于访问？

在 bulletproof accessible font icons 的这篇文章中，他们提出了一个很好的解决方案：

由于字符没有任何直接语义，您可以将它们包含在 span 的 :before 伪类中：

.logo:before {
    font-family: YourIconFontFamily;
    content: "★";
}

然后在span中直接包含公司名称：

<span class="logo">Your company<span>

如何使用听觉CSS？

How to use Aural CSS?

css

accessibility

stylesheet