2

如何使表格中突出显示的文本符合 508 标准？目前，我将文本包装在一个 em 标签中并添加一个 aria 标签以引起人们对它具有黄色背景的注意。显然，这种替代标记不符合要求，因为屏幕阅读器不会读取它。

<table style="border: solid 1px black;">
    <p>Search results for the term "will"</p>
    <thead>
        <th>first name</th>
        <th>last name</th>
        <th>occupation</th>
    </thead>
    <tbody>
        <tr>
            <td>Joe</td>
            <td><em style="background-color: yellow; font-style: normal;" aria-label="highlighted search term">Will</em>iams-Harver</td>
            <td>sales clerk</td>
        </tr>
        <tr>
            <td><em style="background-color: yellow; font-style: normal;" aria-label="highlighted search term">Will</em></td>
            <td>Stevens</td>
            <td>truck driver</td>
        </tr>
    </tbody>
</table>
4

3 回答 3

2

该表现在符合 508 标准。第 508 节规则意味着，在考虑网页和 Web 应用程序时，第 508 节第 1194.22 节中的一组16 条规则。例如，没有任何规则禁止使用屏幕阅读器无法识别的标记。事实上，他们可能会识别em，但这在考虑一致性时无关紧要。

规则 (c) 规定：“网页的设计应使所有用颜色传达的信息在没有颜色的情况下也可用，例如来自上下文或标记。” 您正在为 使用背景颜色em，但这没关系，因为某些单词以某种方式强调的信息在标记中，在元素的使用中。某些软件是否真正识别该标记并传达其含义不能成为遵守对此事没有任何说明的法律的标准。em

通过设置font-style为normal，您将覆盖em（斜体字体）的常见默认呈现。这意味着当颜色设置被禁用时（例如，通过用户样式表将所有内容变为白底黑字，以满足个人的需要），该em元素将显示为普通文本。这可以被定性为违反规则 (b) 的精神。但在一致性方面，重要的是字母，信息在标记中。

于 2013-11-05T21:41:24.663 回答
1

这似乎是一个可访问性问题：

第 508 节可访问性指南

一些视力低下的人经常关闭样式。所以记住当你放<em>的时候，浏览器会看到一个

元素表示其内容的强调重点。参考

而黄色的风格也达不到他的目的。

试试<mark>。

HTML 标记用于将文本指示为标记或突出显示以供参考，因为它与另一个上下文相关。参考

如果您想遵循这个 w3c 标准，请阅读这篇关于508 合规性可能误报的有趣文章

于 2013-11-05T18:01:53.330 回答
0

在我最近参与的一个项目中，我们希望在视觉上区分旧数据和新更新的数据。我们最终使用粗体红色文本来“突出”已进行的编辑。由于您不能仅以颜色或样式将信息传递给用户，因此我们在表单控件前面添加了“隐藏”文本（如果它被编辑（在后面的代码中使用标签可见性完成））。我们使用 CSS 为视觉用户“隐藏”屏幕外的文本。

当用户禁用 CSS 时，他们不再获得红色粗体文本，但现在会出现隐藏文本。屏幕阅读器也会读取隐藏的文本。

示例：提交者编辑的字段名：

我们还使用图标来提醒用户注意更改，并添加了信息丰富的替代文本，例如“提交者编辑的名字字段”。

希望有帮助！

于 2013-11-21T16:07:34.413 回答