如何使用Aural CSS?

时间:2015-04-09 17:20:45

标签: css stylesheet accessibility

  1. 我读过一个不再使用听觉样式表的地方了吗?有什么东西可以取代它们吗?我确定某些正在被用来为视障人士提供便利吗?

  2. 如果仍在使用听觉CSS,是否有办法指定在特定地点应该说什么,类似于使用" alt"对于图像?例如,我使用iconfont作为我的徽标。我希望能够让用户听到我公司的名字,但由于它只是用一个跨度来完成,因此在那个特定的范围内没有任何地方可以指出这些字眼(I&I)假设这里系统读取屏幕上显示的单词,而不是所有带有它的代码,所以显然如果要读取实际文本,这会更好。也许包含一个内容:'您想要的任何文字'是以某种方式添加的?

  3. 要点是我在一个关于歌剧的网站上为客户工作,客户希望每个人都可以访问这些内容。显然,有视力障碍的人会特别想要事情。

2 个答案:

答案 0 :(得分:3)

<强> 1。是否有替代听力?

自CSS3起,Aural样式表确实已被弃用。主要浏览器,如Firefox removed the implementation a while ago。仍然有一个speech媒体,但到目前为止我还没有看到任何实现(此时它似乎只是a proposal。)

许多有视力障碍的人使用screen readers和较小程度refreshable braille displays来查看内容,因此您通常不必担心直接实施语音。这项工作的重点是:

<强> 2。如何使图标字体(和其他不易读的项目)可访问?

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

由于角色没有任何直接的语义含义,您可以将它们包含在:before的{​​{1}}伪类中:

span

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

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

答案 1 :(得分:0)

  1. 根据W3,它在CSS 2中定义 - 但已经被CSS3弃用了。您还可以查看语音模块:http://www.w3.org/TR/css3-speech

  2. 您只能为屏幕阅读器使用具有特定内容的其他span,如下所示:

    <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/