Element

input

Error Type

Potential

Guidelines

  • WCAG 2.0 (Level A)
    Guideline Group3.3 Input Assistance: Help users avoid and correct mistakes.
    Guideline SubgroupSuccess Criteria 3.3.2 Labels or Instructions (A)
  • WCAG 2.0 (Level AA)
    Guideline Group3.3 Input Assistance: Help users avoid and correct mistakes.
    Guideline SubgroupSuccess Criteria 3.3.2 Labels or Instructions (A)
  • WCAG 2.0 (Level AAA)
    Guideline Group3.3 Input Assistance: Help users avoid and correct mistakes.
    Guideline SubgroupSuccess Criteria 3.3.2 Labels or Instructions (A)

Requirement

All input elements, type of "radio", have a label that describes the purpose or function of the control.

Error

input element, type of "radio", label may not describe the purpose or function of the control.

How To Determine

Question Does the input element's label describe the purpose or function of the control?
PASS input element's label describes the purpose or function of the control.
FAIL input element's label does not describe the purpose or function of the control.

Steps To Check

Procedure

1. Check all input elements that have a type attribute value of "radio".
2. The input element must have an explicitly associated label using one or more of the following methods.
3. The input element has an id attribute value that matches the for attribute value of a label element.
4. and/or
5. The input element has a title attribute.
6. and/or
7. The input element is contained by a label element.
8. Check if the label text describes the purpose or function of the control.

Expected Result

1. All input elements, type of "checkbox", have a label that describes the purpose or function of the control.

Failed Result

1. Modify the label text so it describes the purpose or function of the control.

Examples

Pass Examples

Label using for and id describes control.
<?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 #220 - Negative</title>
</head>
<body>
<form action="http://somesite.com/prog/adduser" method="post">
<p>
<label for="texta">birds</label> 
<input id="texta" type="radio" name="mytext" tabindex="1" />
</p>
</form>
</body>
</html>

Fail Examples

Label using for and id does not describe control.
<?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 #220 - Positive</title>
</head>
<body>
<form action="http://somesite.com/prog/adduser" method="post">
<p>
<label for="texta">I was walking down the street.</label> 
<input id="texta" type="radio" name="mytext" tabindex="1" />
</p>
</form>
</body>
</html>
Web site engine's code is copyright © 2023
Inclusive Design Institute