HTML表格的用法"；“摘要”；属性

HTML4.01（）的规范规定表摘要属性应包含“…表的用途和结构的摘要””，并且给出的示例支持该用法

WebContentAccessibilityGuidelines 2.0（）表示，summary属性的作用是“简要概述数据是如何组织到表中的，或简要说明如何导航表”

wcag1.0（）说了一些类似的话，示例再次显示了描述表的用途和结构的用法

---

另一方面，伊利诺伊州信息技术无障碍中心iCITA（）将该属性的最佳实践描述为“应描述表格的内容或作者打算通过表格中的数据传达的结论”

我怀疑iCITA是否突然选择了这一点，也怀疑是否有其他HTML书籍和指南建议类似的做法

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

然而，我不愿意偏离WCAG经过充分研究的建议

---

因此，我的问题是：如果您在数据表的summary属性中添加了任何内容，您是否输入了目的、结构、内容描述、结论和/或其他内容，以及为什么？基于此属性的真实用户反馈的理由特别受欢迎。

我给出了一个内容描述。把它想象成你可能在标题中看到的文本。该表不应是一个结论，它应支持该结论（在别处提到）

通常，考虑到页面其余部分的内容，该表的目的是明确的。例如，如果你正在讨论与投票模式相关的人口统计变化，那么很明显，为什么你会有一个包含州人口增长率的表格。如果没有，你可以简单地提到它为什么会在那里

---

至于原因，很简单：可访问性。那些使用屏幕阅读器的人依靠这些信息来提供表上下文。你是否被要求让你的网站可以访问将取决于你的雇主或客户。即使不是必需的，也建议使用它（当然也受到依赖它的人的赞赏）。

我在表格中列出了数据试图传达的信息摘要。

我将遵循WCAG指南。您可以尝试的一件事是获得一个屏幕阅读器软件包，闭上眼睛，看看它对您的表格有什么影响，有没有标题和摘要。这将使您很好地了解文本描述中缺少的内容，以帮助传达表中的信息。

我使用

summary

属性来描述表的结构以及行和列之间的关系。它增加了

和

元素和

范围

，

轴

，以及

id

和

标题

属性。使用这些元素和属性可以理解表的结构，但最好在前面有一个简单的描述

---

不要低估了通过简单地看表格，视觉传达的信息量。这就是我试图在

summary

属性中捕获的内容。

summary属性已过时。如果表格标题元素不合适，则将表格放在figure元素中，并在figcaption元素中添加其他信息。轴属性也已过时；相反，在适当的th元素上使用scope

关于摘要：

• 元素表不能显示为标题元素的后代
• table元素上的summary属性已过时。考虑在标题元素或包含表元素的图形元素中描述表的结构；或者，简化表的结构，这样就不需要描述了
• table元素上的align属性已过时。改用CSS
• table元素的width属性已过时。改用CSS
• table元素上的bgcolor属性已过时。改用CSS
• table元素的border属性的值必须是“1”或空字符串。要调整表格边框的厚度，请改用CSS
• table元素上的cellpadding属性已过时。改用CSS
• table元素上的cellspacing属性已过时。改用CSS
• table元素上的frame属性已过时。改用CSS
• table元素上的rules属性已过时。改用CSS

关于轴：

• td元素上的scope属性已过时。改为在th元素上使用scope属性
• td元素上的abbr属性已过时。请考虑用简洁的文本来启动单元格内容，然后在需要时进一步细化。
• td元素上的axis属性已过时。改用scope属性
• td元素上的align属性已过时。改用CSS
• td元素上的width属性已过时。改用CSS
• td元素上的char属性已过时。改用CSS
• td元素上的charoff属性已过时。改用CSS
• td元素上的valign属性已过时。改用CSS
• b

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