Web Accessibility Checker : Check Details

Element

input

Error Type

Known

Guidelines

WCAG 2.0 (Level A)
1.3 Ensure that information and structure can be separated from presentation
Success Criteria 1.3.1 Info and Relationships (A)
WCAG 2.0 (Level AA)
1.3 Adaptable: Create content that can be presented in different ways (for example simpler layout) without losing information or structure.
Success Criteria 1.3.1 Info and Relationships (A)
WCAG 2.0 (Level AAA)
1.3 Adaptable: Create content that can be presented in different ways without losing information or structure.
Success Criteria 1.3.1 Info and Relationships (A)

Requirement

All input elements, type of "radio", have a label containing text.

Error

input element, type of "radio", has no text in label.

Short Description

input element that contains a type attribute value of "radio" must have text in its associated label.

How To Repair

Add text to the input element's associated label that describes 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 contains text.

Expected Result

1. All input elements, type of "radio", have a label containing text.

Failed Result

1. Add text to the label that describes the purpose or function of the control.

Examples

Pass Examples

Label using for and id contains text.

<?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 #204 - Negative</title>
</head>
<body>
<form action="http://www.test.com/testing" method="post">
<p>
<label for="radioa">birds</label> 
<input id="radioa" type="radio" name="aradio" tabindex="1" />
</p>
</form>
</body>
</html>

Fail Examples

Label using for and id does not contain text.

<?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 #204 - Positive</title>
</head>
<body>
<form action="http://www.test.com/testing" method="post">
<p>
<label for="radioa"></label> 
<input id="radioa" type="radio" name="aradio" tabindex="1" />
</p>
</form>
</body>
</html>