屏幕阅读器究竟是什么？我应该如何处理我的网站？

Question

很抱歉，如果这是一个太天真的问题，但究竟什么是屏幕阅读器？在设计网页（html文档）时应该如何考虑它们？

进行谷歌搜索并没有多大帮助...维基百科的条目太笼统了。

我是否应该在html标记中添加任何内容以特别处理屏幕阅读器？

Answer 1

屏幕阅读器通常用于使具有视觉障碍的用户可以访问计算机，例如如果你是盲人，你将无法看到一个网站，但有了软件，你可以“阅读”给你。

我所知道的最常见的屏幕阅读器是JAWS screen reader。

JAWS是L J ob A ccess W ith S peech（因此名称）的简称尝试确保您的网站或Web应用程序可访问时使用的常用工具。例如。为美国政府创建网站需要确保根据“康复法案”第508节确保您的内容可访问：http://www.section508.gov/

您可能需要的所有信息都在该网站上，但一些快速提示将是：

• 为具有alt属性
的图片添加信息性描述
• 使用<TH>标记正确定义表格标题并使用scope属性
• 确保在禁用CSS时您的网站/应用仍以可读方式呈现

Answer 2

屏幕阅读器是一种“读取”文档（在您的情况下是一个网页）并以视觉障碍（例如失明）的人可以轻松消费的方式输出的软件。

屏幕阅读器只能理解文本（和一些格式）。以下是您可以（而且应该）做的事情，以改善盲人或几乎盲人的可访问性：

• 使用<strong>和<em>代码，而不是非描述性<b>或<i>。如果计算机正在朗读它，它可以强调这些词。
• 始终在图片上包含alt属性。您甚至可以将其留空（也称为 null - alt=""）;这表示图像不是必需的/装饰性的。否则，请放置图像的文字说明。
• 辅助功能软件通常会忽略title属性。实际上，只有那些可以使用电脑鼠标的人才能阅读它，所以请避免使用它。
• 转动CSS并查看您的页面。如果没有意义，你应该重新考虑布局。
• ARIA角色（通过role属性）很有帮助。例如，如果您使链接看起来像按钮，辅助技术会提供不同的交互。因此，通过正确设置role，使用辅助技术的人可以按照您的意图使用该元素。在这种情况下，您需要设置role="button"
• 使用具有语义含义的标记（例如section，article，nav，aside，header，以及更常见的{{1}你使用CSS设置样式的h1...6和div而不是{标签}。这可以让软件勾勒出你的页面，盲人可以直接跳到主要内容，就像你可以用眼睛扫描一样。
• 与最后一个相关;使用span和time以及abbr等鲜为人知的标记，而不是另一个CSS类。

这仅适用于屏幕阅读器。甚至不考虑聋人 - 查看您的视频和音频的字幕（使用新的HTML5 address和<audio>代码）。

请注意，我不是无障碍专家（我也不是盲人，所以我不会从经验中说话）。 W3C有可访问性标准，可能比我的标准更合适（以及a list of quick tips）。

Answer 3

你的问题有两个问题：

1. 屏幕阅读器是一种软件，可以读取屏幕并将其转换为视障人士可以使用的内容，如音频或盲文。就网络而言，它会读取DOM，而不是实际屏幕。

2. 您需要做的事情非常简单：让您的应用程序易于理解为屏幕阅读器。例如，通过向alt提供图像来执行此操作。在W3C上有一个名为WCAG的屏幕阅读器标准。你真正需要做的主要取决于你的观众。如果您的网站上不太可能有这种残疾人，那么您可能不得不为此工作做更少的工作。