Web Accessibility Checker : Check Details

Element

img

Error Type

Known

Guidelines

Section 508
A - text equivalents
WCAG 2.0 (Level A)
1.1 Text Altrernatives: Provide text alternatives for any non-text content
Success Criteria 1.1.1 Non-text Content (A)
WCAG 2.0 (Level AA)
1.1 Text Alternatives: Provide text alternatives for any non-text content
Success Criteria 1.1.1 Non-text Content (A)
WCAG 2.0 (Level AAA)
1.1 Text Alternatives: Provide text alternatives for all non-text content
Success Criteria 1.1.1 Non-text Content (A)

Requirement

Alt text for all img elements used as source anchors is not empty when there is no other text in the anchor.

Error

Image used as anchor is missing valid Alt text.

Short Description

img element cannot have alt attribute value of null or whitespace if the img element is contained by an A element and there is no other link text.

Rationale

If an image is used as a link then it must have alternate (ALT) text that describes the link destination. The Alt text can't be null or all spaces.

How To Repair

Add Alt text that identifies the purpose or function of the image.

Steps To Check

Procedure

1. Check each img element that occurs within a source a (anchor) element.
2. View the Alt text for the image.
3. Check if the a (anchor) element contains any other text.

Expected Result

1. Alt text for all img elements used as source anchors is not empty when there is no other text in the anchor.

Failed Result

1. Modify the Alt text so it is not empty.

Examples

Pass Examples

img is contained by A element, anchor has no other text and Alt text is not empty.

<?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>
<title>OAC Testfile - Check #7 - Negative</title>
</head>
<body>
<p><a href="rex.html"><img src="rex.jpg" alt="a story about Rex the cat"/></a></p>
</body>
</html>

Fail Examples

img is contained by A element, anchor has no other text and Alt text is empty.

<?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>
<title>OAC Testfile - Check #7 - Positive</title>
</head>
<body>
<p><a href="rex.html"><img src="rex.jpg" alt=""/></a></p>
</body>
</html>