Web Accessibility Checker : Check Details

Element

Error Type

Known

Guidelines

BITV 1.0 (Level 2)
Level 2
10.5 Until user agents (including assistive technologies) render adjacent links distinctly, include non-link, printable characters (surrounded by spaces) between adjacent links.
WCAG 1.0 (Level AAA)
Priority 3
10.5 Until user agents (including assistive technologies) render adjacent links distinctly, include non-link, printable characters (surrounded by spaces) between adjacent links.

Requirement

Include non-link, printable characters (surrounded by spaces) between adjacent links.

Error

Adjacent links are not separated properly.

Short Description

Adjacent links must be separated by printable characters. [Editor's Note - Define adjacent link? Printable characters always?]

How To Repair

Insert printable characters (surrounded by spaces) between adjacent links.

Repair Example

<a href="dogs">dogs</a> | <a href="cats">cats</a>

Steps To Check

Procedure

1. Check each a (anchor) element for a following a (anchor) element.
2. If two a (anchor) elements are adjacent then check if there is a printable character (not tab or 'space') between the 2 elements.

Expected Result

1. Adjacent a (anchor) elements are expected to have at least one printable character between them.

Failed Result

1. Add a printable character between the adjacent characters.

Examples

Pass Examples

Adjacent links with separator characters.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
<html lang="en">
<head>
<title>OAC Testfile - Check #134 - Negative</title>
</head>
<body>
<a href="dogs">dogs</a> | <a href="cats">cats</a> | <a href="birds">birds</a> | <a href="snakes">snakes</a>
</body>
</html>

Fail Examples

Adjacent links that do not contain separator characters.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
<html lang="en">
<head>
<title>OAC Testfile - Check #134 - Positive</title>
</head>
<body>
<a href="dogs">dogs</a> <a href="cats">cats</a> <a href="birds">birds</a> <a href="snakes">snakes</a>
</body>
</html>