Web Accessibility Checker : Check Details

Element

input

Error Type

Potential

Guidelines

WCAG 2.0 (Level A)
3.3 Input Assistance: Help users avoid and correct mistakes.
Success Criteria 3.3.2 Labels or Instructions (A)
WCAG 2.0 (Level AA)
3.3 Input Assistance: Help users avoid and correct mistakes.
Success Criteria 3.3.2 Labels or Instructions (A)
WCAG 2.0 (Level AAA)
3.3 Input Assistance: Help users avoid and correct mistakes.
Success Criteria 3.3.2 Labels or Instructions (A)

Requirement

Each label describes its asssociated input element.

Error

label may not describe its associated control.

Short Description

Each label must describe its associated input element.

How To Determine

Question	Does this label describe its associated control?
PASS	`label` describes its associated control.
FAIL	`label` does not describe its associated control.

Steps To Check

Procedure

1. Check all input elements and view their associated label.
2. Note: For information on what constitutes an associated label please see test 57.

Expected Result

1. Each label is expected to describe its associated input element.

Failed Result

1. Modify the label text so it describes the purpose of the input element.

Examples

Pass Examples

label does describe its associated input element.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/xhtml; charset=UTF-8" />
<title>ATRC Testfile - Check #189 - Negative</title>
</head>
<body>

<form action="http://www.test.com" method="post">
<p>
<label for="name">First name: </label>
<input type="text" name="firstname" id="name"/>
</p>
</form>


</body>
</html>

Fail Examples

label does not describe its associated input element.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/xhtml; charset=UTF-8" />
<title>ATRC Testfile - Check #189 - Positive</title>
</head>
<body>

<form action="http://www.test.com" method="post">
<p>
<label for="name">shoe size:</label>
<input type="text" name="firstname" id="name"/>
</p>
</form>

</body>
</html>