9

HTML4.01 ( http://www.w3.org/TR/html401/struct/tables.html#adef-summary ) 的规范规定表格摘要属性应包含“......表格用途的摘要和结构......”和给出的例子支持这种用法。

Web 内容可访问性指南 2.0 ( http://www.w3.org/TR/WCAG20-TECHS/H73.html ) 说,summary 属性是“提供数据如何组织成表格或如何浏览表格的简要说明"

WCAG 1.0 ( http://www.w3.org/TR/WCAG10-HTML-TECHS/#table-summary-info ) 说了类似的话,并且这些示例再次显示了用于描述表格的目的和结构的用法。


另一方面,伊利诺伊州信息技术无障碍中心 iCITA ( http://html.cita.uiuc.edu/nav/dtable/dtable-rules.php )将该属性的最佳实践描述为“应该描述表或作者打算通过表中数据传达的结论"

我怀疑 iCITA 是否突然选择了这个,并且还有其他 HTML 书籍和指南建议类似的做法。

在许多方面,这种用法对我来说更有意义,因为明智地使用 thead 和 th 元素以及 scope 和 headers 属性应该足以向无视力的用户描述表格的结构,而没有其他视力正常的用户可以通过快速扫描表格获得复杂表格的要点,以匹配视力正常的用户可以获得的相同级别的信息。

但是,我不愿偏离 WCAG 的经过充分研究的建议。

所以,我的问题是:如果您在数据表的摘要属性中添加任何内容,您是否输入目的、结构、内容描述、结论和/或其他内容,为什么?特别欢迎基于此属性的真实用户反馈的原因。

4

6 回答 6

5

摘要属性已过时。如果表格标题元素不合适,则将表格放在图形元素中,在 figcaption 元素中添加附加信息。轴属性也已过时;而是在适当的 th 元素上使用范围。

来自W3C关于总结:

  • 元素表不能作为标题元素的后代出现。
  • table 元素上的 summary 属性已过时。考虑在标题元素或包含表格元素的图形元素中描述表格的结构;或者,简化表的结构,以便不需要描述。
  • table 元素的 align 属性已过时。改用 CSS。
  • 表格元素的宽度属性已过时。改用 CSS。
  • table 元素上的 bgcolor 属性已过时。改用 CSS。
  • 表格元素的边框属性值必须为“1”或空字符串。要调节表格边框的粗细,请改用 CSS。
  • 表格元素上的 cellpadding 属性已过时。改用 CSS。
  • 表格元素上的 cellspacing 属性已过时。改用 CSS。
  • table 元素上的 frame 属性已过时。改用 CSS。
  • 表格元素的规则属性已过时。改用 CSS。

来自W3C关于轴:

  • td 元素的范围属性已过时。改为在 th 元素上使用 scope 属性。
  • td 元素的 abbr 属性已过时。考虑改为以简洁的文本开始单元格内容,然后根据需要进一步详细说明。
  • td 元素的轴属性已过时。请改用范围属性。
  • td 元素上的 align 属性已过时。改用 CSS。
  • td 元素的 width 属性已过时。改用 CSS。
  • td 元素上的 char 属性已过时。改用 CSS。
  • td 元素上的 charoff 属性已过时。改用 CSS。
  • td 元素上的 valign 属性已过时。改用 CSS。
  • td 元素上的 bgcolor 属性已过时。改用 CSS。
  • td 元素的 height 属性已过时。改用 CSS。
  • td 元素的 nowrap 属性已过时。改用 CSS。
于 2013-04-25T15:04:11.920 回答
3

我使用summary属性来描述表的结构以及行和列之间的关系。它增加了<tbody>and<th>元素和scope, axis, 和idandheaders属性。使用这些元素和属性可以理解表格的结构,但最好在前面有一个简单的描述。

不要低估通过简单地查看表格在视觉上传达了多少信息。这就是我试图在summary属性中捕获的内容。

于 2009-02-20T15:43:22.940 回答
2

我放了一个内容描述。将其视为您可能在标题中看到的文本。该表不应该一个结论,它应该支持这个结论(在别处提到)。

通常,考虑到页面其余部分的内容,表格的目的很明确。例如,如果您正在讨论与投票模式相关的人口统计变化,那么很明显为什么您有一张包含州人口增长率的表格。如果没有,您可以简要说明它存在的原因。

至于为什么,很简单:可访问性。那些使用屏幕阅读器的人依靠这些信息来提供表格上下文。您是否需要使您的网站可访问将取决于您的雇主或客户。即使不需要,也推荐它(并且肯定会受到依赖它的人的赞赏)。

于 2009-02-20T09:54:59.783 回答
2

根据W3C

table 元素的 summary 属性使这些信息可供使用屏幕阅读器的人使用;信息不直观地显示。

当表结构复杂时(例如,当有几组行或列标题,或者当有多组列或行时),摘要很有用。对于包含多列或多行数据的简单数据表,摘要也可能会有所帮助。

无论表格是否包括标题元素,都可以使用摘要属性。如果两者都使用,摘要不应重复标题。

在 HTML5 中,summary属性已过时。因此,假设我们使用以下 HTML 表格,取自Tables - W3C

<TABLE border="1"
          summary="This table gives some statistics about fruit
                   flies: average height and weight, and percentage
                   with red eyes (for both males and females).">
<CAPTION><EM>A test table with merged cells</EM></CAPTION>
<TR><TH rowspan="2"><TH colspan="2">Average
    <TH rowspan="2">Red<BR>eyes
<TR><TH>height<TH>weight
<TR><TH>Males<TD>1.9<TD>0.003<TD>40%
<TR><TH>Females<TD>1.7<TD>0.002<TD>43%
</TABLE>

并使用W3C Validator测试一切是否正常。然后我们会得到以下错误

table 元素上的 summary 属性已过时。考虑在标题元素或包含表格的图形元素中描述表格的结构;或者,简化表的结构,以便不需要描述。

W3C 验证器表摘要错误

所以,我会使用标题标签而不是摘要并写一个简单的描述(几行文字用于解释和详细说明表格)。

于 2020-01-22T11:30:29.697 回答
1

我包含了表中数据试图传达的信息的摘要。

于 2009-02-20T10:09:04.960 回答
0

我会遵循 WCAG 指南。您可以尝试的一件事是获取屏幕阅读器软件包,闭上眼睛,看看它对您的表格的描述,无论是否带有标题和摘要。这应该可以让您很好地了解文本描述中缺少的内容,以帮助传达表格中的信息。

于 2009-02-20T15:31:44.577 回答