Captions and summaries

Two seldom-used table additions that enable you to provide explanations of a table’s contents
are the caption element and the summary attribute. The former is usually placed
directly after the table start tag, and enables you to provide a means of associating the
table’s title with the table itself. Obviously, this also helps users—particularly those with
screen readers. After reading the caption, the screen reader will go on to read the table
headers (see the “Using table headers” section later in this chapter). Without the caption,
the table’s contents might be relatively meaningless.
By default, most browsers center captions horizontally, and some set their contents in bold
type, but these default styles can be overridden with CSS.
The summary attribute, which is invisible in browsers, is used by screen readers to give the
user an overview of the table’s contents prior to accessing the content. The contents of
the summary attribute should be kept succinct, highlighting the most important aspects of
the table contents, letting the user know what to anticipate.
Many suggest that summaries should be included on all tables, but this isn’t necessarily the
case. A summary should be used only when it performs the task for which it’s designed: to
make available a succinct summary of data within a table. Should you be using tables for
layout (which I don’t recommend), there’s little point including summaries within each layout
table—after all, someone using a screen reader is hardly going to jump for joy upon
hearing, for the umpteenth time, “This table is used for laying out the web page.”
Summaries should save time, not waste it.