Defining Column Group Header in a Data Table - Web Experience Toolkit (WET)

Note: Table Source Code Example

Id/Headers attribute, colgroup element and col element was omited intentionally for clarity.

Technique Author

Name: Pierre Dubois

Technique Information

Technology

HTML and XHTML Techniques

Guidelines Reference

Success Criterion 1.3.1 (Info and Relationships)

Technique Title

Defining Column Group Header in a Data Table

Applicability

Use for data tables when the table contain a row header cell.

User Agent Issues

Not Available

Description of Technique

The objective of this technique is to defined a relationship between the colgroup that contain the column used for the row cell header with his key and description cell.

When the table have at least one row cell header, the first colgroup is named a header colgroup.

Examples

Table 1

Table 1
Key Row Header Description Data Data Data
Key Row Header Description Data Data Data
Key Row Header Description Data Data Data
Key Row Header Description Data Data Data
Table Source Code 
<table class="wet-boew-zebra">
	<caption>Table 1</caption>
	<colgroup>
		<col />
		<col />
		<col />
	</colgroup>
	<colgroup>
		<col />
		<col />
		<col />
	</colgroup>
	<tbody>
		<tr>
			<td>Key</td>
			<th>Row Header</th>
			<td>Description</td>
			<td>Data</td>
			<td>Data</td>
			<td>Data</td>
		</tr>
		<tr>
			<td>Key</td>
			<th>Row Header</th>
			<td>Description</td>
			<td>Data</td>
			<td>Data</td>
			<td>Data</td>
		</tr>
		<tr>
			<td>Key</td>
			<th>Row Header</th>
			<td>Description</td>
			<td>Data</td>
			<td>Data</td>
			<td>Data</td>
		</tr>
		<tr>
			<td>Key</td>
			<th>Row Header</th>
			<td>Description</td>
			<td>Data</td>
			<td>Data</td>
			<td>Data</td>
		</tr>
	</tbody>
</table>

Resources

Related Techniques

Test

Procedure

  1. If the table have a row group cell header, check if the first colgroup represent the cell consisting as the heading defintion for a row.

Expected Result

  • #1 is true