设计屏幕阅读器兼容性

概观

屏幕阅读器将数字文本转换为合成语音它们使用户能够听到内容并使用键盘进行导航该技术可帮助盲人或视力低下的人使用与其他人相同的独立性和隐私性的信息技术屏幕阅读器也被具有某些认知或学习障碍的人使用,或者仅仅喜欢音频内容而不是文本的用户除了网络,屏幕阅读器还可以处理文档,电子表格和用户的操作系统。

屏幕阅读器阅读内容与人类不同声音听起来有点机器人和单调经验丰富的用户通常喜欢将阅读速度提高到每分钟300字或更多 - 远远超出没有经验的听众可以轻易理解的内容习惯于屏幕阅读器需要时间,但一旦用户习惯了它,他们就可以以令人敬畏的个人的速度比赛内容。

文件语言

由于每种语言都有自己的发音规则,因此屏幕阅读器需要知道它应该“说话”哪种语言。网页指定文档语言属性<HTML>标记,以包含整个文档您正在阅读的页面现在使用<html lang =“en”>,“en”是英语的代码这也便于内容的自动翻译(看到完整清单代码。)

有时文字穿插着外国短语例如:

  • 在马坦萨斯,我们尝试了一道菜ropa vieja- 字面意思是“旧衣服”。
  • “这就是生活,”当哈罗德看着他的沃尔沃从悬崖上翻滚时,他叹了口气。
  • 在罗马,艾伦对一部名为电影的电影感到震惊La Donna Nella Doccia

在这种情况下,属性通常应用于a<跨度>标签这标志着暂时偏离先前指定的文档语言以下是上述三个段落的代码:

  • 在马坦萨斯,我们尝试了一道菜<span lang =“es”> ropa vieja </ span>- 字面意思是“旧衣服”。
  • <span lang =“fr”>“C'est la vie”,</ span>当哈罗德看着他的沃尔沃从悬崖上翻滚时,他叹了口气。
  • 在罗马,艾伦对一部名为电影的电影感到震惊<span lang =“it”> La Donna Nella Doccia </ span>
不正确的成本 属性

当用一种语言的文本与另一种语言的发音规则一起阅读时,结果会接近滑稽的口音这是一段英文文本录音是一个屏幕阅读器,发音这个文本就像它有郎= “CS”(捷克)。

如今没有互联网,大多数人都难以想象生活一些人认为,自古腾堡在十五世纪的印刷机上以来,没有任何其他单一发明具有更大的革命性现在,只需点击鼠标,世界就可以“触手可及” - 也就是说,如果你可以使用鼠标......并看到屏幕..并且听到音频 - 换句话说,如果你没有任何类型的残疾。

属性几乎可以应用于任何HTML元素虽然它本身没有任何视觉上的变化,但它确实为CSS提供了方便的钩子一个共同的约定(本网站共享)是斜体外国短语CSS轻松处理这个问题:

span[lang] { font-style: italic; }

上面的CSS用字体表示每个文本<跨度>有一个属性或者,它可以用HTML完成,如下所示:

<em lang =“de”> Alles klar,Herr Kommissar?</ em>

这将立即指定语言并应用浏览器默认值<EM>斜体样式而不添加CSS声明。

Content Linearization

音频接口向用户呈现线性内容,一次一个项目这与大多数人使用可视界面的方式形成对比有视觉的用户几乎可以即时扫描整个屏幕,理解整体布局,艺术风格和内容的其他宏观层面屏幕阅读器用户无法快速理解这些宏观层面的方面从头到尾通过内容的线性进展有点像自动电话菜单系统,其不会立即显示所有选项用户必须以逐步的方式通过这些系统音频接口是Web内容的线性化版本的洞察力是一个重要的,它应该指导Web开发人员在工程和设计过程中。

适应屏幕阅读器之间的差异

所有屏幕阅读器共享相似的功能和功能但是,键盘快捷键,语音以及调出链接,图像等的方式因它们而异由于用户将习惯于他们首选的屏幕阅读器惯例,因此这些差异通常不会影响编码实践关键是要遵守可访问性标准和普遍接受的可访问性技术。

屏幕阅读器如何阅读内容

一般来说:

  • 屏幕阅读器暂停:
    • 分号
    • 逗号
    • 问号
    • 感叹号
    • 段落结尾
  • 如果有足够的元音/辅音是可发音的,屏幕阅读器会尝试发音首字母缩略词否则,他们拼出这些字母。
    • NASA发音为一个单词。
    • SQL发音为“续集”,即使有些人说“S”QL.”
    • NSF发音为“N.小号F。”
    • 网址发音为“U.[RL.”
  • 用户可以暂停屏幕阅读器并返回重复单词或段落他们甚至可以让屏幕阅读器逐字读取单词,屏幕阅读器大喊/强调大写字母。
  • 屏幕阅读器在您键入时会大声读出字母,但对密码字段说“星号”或“星号”。
  • 屏幕阅读器宣布页面标题(<TITLE>首次加载网页时,HTML标记中的元素。
  • 屏幕阅读器将阅读替代文本图像,如果存在alt文本JAWS在替代文本之前加上“graphic”一词。如果图像是链接,JAWS在替代文本之前加上“图形链接”。
  • 屏幕阅读器忽略没有替代文本的图像并且什么都不说,但是用户可以设置他们的首选项来读取文件名。
  • 如果没有替代文本的图像是链接,屏幕阅读器通常会读取链接目的地(HREFattribute in the HTML markup) or may read the image file name.
  • 屏幕阅读器宣布标题并确定标题级别例如,NVDA和JAWS就在之前<H1>标题为“标题级别1”的标题。
  • 一旦页面在浏览器中完成加载,一些屏幕阅读器就会宣布页面上的链接数量。
  • 如果链接目的地与链接本身在同一页面上,JAWS表示“相同页面链接”,对于先前访问过的链接,JAWS表示“访问链接”。
  • 表导航模式下的屏幕阅读器通知用户a中有多少行和列数据表
  • 用户可以在表格导航模式下从单元格到单元格的任何方向导航如果表格被正确标记,屏幕阅读器将在用户输入每个新单元格时读取列和/或行标题。
  • 屏幕阅读器会在用户输入表单时通知他们用户可以选择进入表单导航模式。
  • 屏幕阅读器可能会被同形异义词所取代例如,这个词可以发音为“芦苇”或“红色”,具体取决于具体情况:“我要读报纸”vs“我已经阅读了报纸。”诸如“我每天都阅读报纸”这样的句子对所有读者都是模棱两可的 - 人类和屏幕读者都是如此这个单词内容另一个例子:“我感到满足”(意思是满意,重点是第二个音节[con帐篷])vs“WebAIM.org有一些非常棒的内容”(意思是主题,重点是第一个音节[CON-帐篷])。
  • 屏幕阅读器可能会也可能不会读出标点符号,具体取决于用户的详细程度设置确保在任何一种情况下都能传达您的意图要了解标点符号的价值,请考虑以下句子:
    • 我们吃,爷爷!
    • 我要感谢我的父母,教皇和特蕾莎修女。
    • 他在烹饪,孩子和猫咪中找到了灵感。
注意

某些浏览器似乎可以更好地使用某些屏幕阅读器以下是我们推荐的配对:

重要

第一次使用任何屏幕阅读器可能会让人感到困惑和沮丧对于有视力的用户来说,使用音频接口几乎总是有点迷失方向此外,网页上的大部分内容似乎都在万国体育网站,实际上问题可能是新用户根本不知道如何使用屏幕阅读器。

认真想要了解屏幕阅读器内容如何发声的开发人员需要与定期使用屏幕阅读器的人密切合作,或者花时间学习如何有效使用屏幕阅读器但是,使用屏幕阅读器测试可访问性最好使用默认或最低限度的自定义设置和有限的导航技术这允许分析页面的基本可访问性,而不依赖于屏幕阅读器高级用户采用的策略。