Web Accessibility Checker : Check Details

Element

body

Error Type

Known

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 input element has only one associated label.

Error

input element has more than one associated label.

Short Description

input element must have only one associated label element.

How To Repair

Remove or modify the label elements so there is only one associated label for each form control.

Steps To Check

Procedure

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

Expected Result

1. Each input element has only one associated label.

Failed Result

1. Remove or modify the label elements so there is only one label per input element.

Examples

Pass Examples

input has only 1 associated label.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html xml:lang="en-US" lang="en">
<head>
<title>OAC Testfile - Check #187 - Negative</title>
</head>
<body>

<form>
<label for="name">First name: </label>
<input type="text" name="firstname" id="name"/>
</form>


</body>
</html>

Fail Examples

input has 2 associated labels.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
<html xml:lang="en-US" lang="en">
<head>
<title>OAC Testfile - Check #187 - Positive</title>
</head>
<body>

<form>
<label for="name">First name: </label>
<input type="text" name="firstname" id="name"/>
<label for="name">Enter your first name: </label>
</form>

</body>
</html>