Access 5.1.2.2

From Htmlpedia
Jump to: navigation, search

Access: [5.1.2.2]: data <table> missing row/column headers (1 col) (Priority 1)

Cause:

Data tables must include headers for each row and column. Use the "headers" attribute to attach labels to table rows and columns via the "id" attribute. This creates a link between headings and their associated data cells.

Example:

Bad
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html lang="en">
<head>
<title>aert1.0/5.1.2</title>
</head>
<body>

<table summary="This data table is missing one column headers">
	<caption>This data table is missing one column headers</caption>
	
	<tr>
		<th>age</th><td>height</td><th>weight</th>
	</tr>
	<tr>
		<td>10</td><td>1.3 m</td><td>50 kg.</td>
	</tr>
	<tr>
		<td>15</td><td>1.8 m</td><td>75 kg.</td>
	</tr>
	<tr>
		<td>20</td><td>2.1 m</td><td>100 kg.</td>
	</tr>
</table>

</body>
</html>
Good
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html lang="en">
<head>
<title>aert1.0/5.1.2</title>
</head>
<body>

<table summary="This data table is missing one column headers">
	<caption>This data table is missing one column headers</caption>
	
	<tr>
		<th>age</th><th>height</th><th>weight</th>
	</tr>
	<tr>
		<td>10</td><td>1.3 m</td><td>50 kg.</td>
	</tr>
	<tr>
		<td>15</td><td>1.8 m</td><td>75 kg.</td>
	</tr>
	<tr>
		<td>20</td><td>2.1 m</td><td>100 kg.</td>
	</tr>
</table>

</body>
</html>

Solution:

References: