Usage of the HTML Table "summary" attribute

Question

The specification of HTML4.01 (http://www.w3.org/TR/html401/struct/tables.html#adef-summary) states that the table summary attribute should contain "... a summary of the table's purpose and structure ..." and the examples given support that usage.

The Web Content Accessibility Guidelines 2.0 (http://www.w3.org/TR/WCAG20-TECHS/H73.html) says the the summary attribute is "to provide a brief overview of how data has been organized into a table or a brief explanation of how to navigate the table"

WCAG 1.0 (http://www.w3.org/TR/WCAG10-HTML-TECHS/#table-summary-info) says something similar and again the examples show the usage as describing the purpose and structure of the table.

---

On the other hand, the Illinois Center for Information Technology Accessibility iCITA (http://html.cita.uiuc.edu/nav/dtable/dtable-rules.php) describes best practice for the attribute as "should describe the content of the table or the conclusion the author intends to convey through the data in the table"

I doubt that iCITA have picked this out of the blue, and that there are other HTML books and guides that advise a similar practice.

In many ways, such usage makes more sense to me, since judicious use of the thead and th elements along with the scope and headers attributes should be sufficient to describe the structure of the table to a non-sighted user, whereas there is no other way for a non-sighted user to gain the gist of a complex table to match the same level of information a sighted user could obtain via a quick scan of the table.

However, I am loath to diverge from the well-researched advice of the WCAG.

So, my question is: If you put anything in the summary attribute of data tables, do you enter purpose, structure, content description, conclusion, and/or something else, and why? Reasons based on feedback from real users of this attribute are particularly welcome.

Answer 1

The summary attribute is obsolete. If a table caption element is not appropriate, then put the table in a figure element add additional information in a figcaption element. The axis attribute is also obsolete; use scope on appropriate th elements, instead.

From W3C regarding summary:

• The element table must not appear as a descendant of the caption element.
• The summary attribute on the table element is obsolete. Consider describing the structure of the table in a caption element or in a figure element containing the table element; or, simplify the structue of the table so that no description is needed.
• The align attribute on the table element is obsolete. Use CSS instead.
• The width attribute on the table element is obsolete. Use CSS instead.
• The bgcolor attribute on the table element is obsolete. Use CSS instead.
• The value of the border attribute on the table element must be either “1” or the empty string. To regulate the thickness of table borders, Use CSS instead.
• The cellpadding attribute on the table element is obsolete. Use CSS instead.
• The cellspacing attribute on the table element is obsolete. Use CSS instead.
• The frame attribute on the table element is obsolete. Use CSS instead.
• The rules attribute on the table element is obsolete. Use CSS instead.

From W3C regarding axis:

• The scope attribute on the td element is obsolete. Use the scope attribute on a th element instead.
• The abbr attribute on the td element is obsolete. Consider instead beginning the cell contents with concise text, followed by further elaboration if needed.
• The axis attribute on the td element is obsolete. Use the scope attribute instead.
• The align attribute on the td element is obsolete. Use CSS instead.
• The width attribute on the td element is obsolete. Use CSS instead.
• The char attribute on the td element is obsolete. Use CSS instead.
• The charoff attribute on the td element is obsolete. Use CSS instead.
• The valign attribute on the td element is obsolete. Use CSS instead.
• The bgcolor attribute on the td element is obsolete. Use CSS instead.
• The height attribute on the td element is obsolete. Use CSS instead.
• The nowrap attribute on the td element is obsolete. Use CSS instead.

Answer 2

I use the summary attribute to describe the structure of the table and the relationships of the rows and columns to each other. It augments the <tbody> and <th> elements and scope, axis, and id and headers attributes. It is possible to understand the structure of the table using those elements and attributes, but it's nice to have a plain-speak description right up front.

Don't underestimate how much information is being conveyed visually by simply looking at the table. This is what I try to capture in the summary attribute.

Answer 3

I put a content description. Think of it as text that you might see in a caption. The table shouldn't be a conclusion, it should support the conclusion (which is mentioned elsewhere).

Usualy the purpose of the table is clear given the content of the rest of the page. For example, if you're discussing changes in demographics as it relates to voting patterns, it's obvious why you have a table with state population growth rates there. If not, you might make a brief mention of why it's there.

As to why, it's simple: accessibility. Those who use screen readers rely on this information to give the table context. Whether or not you are required to make your site accessible will depend on your employer or client. Even if not required, it's recommended (and certainly appreciated by those who rely upon it).