Web Accessibility Checker : Check Details

Element

body

Error Type

Known

Guidelines

Stanca Act
Requirement 6: Visual Contrast

Requirement

The contrast between link text and background color is greater than WAI ERT color algorithm threshold.

Error

Poor contrast between link text and background color (WAI ERT algorithm).

Short Description

The contrast between link text and background color must be greater than the WAI ERT color algorithm threshold.

How To Repair

Change either the link attribute value or the bgcolor attribute value of the body element so the contrast surpasses the WAI ERT color algorithm threshold.

Repair Example

<body link="#000000" bgcolor="#ffffff">

Steps To Check

Procedure

1. Calculate the color difference and the color brightness difference between the link attribute value and the bgcolor attribute value of the body element.
2. The color difference can be determined using the following formula:
3. (maximum (Red value 1, Red value 2) - minimum (Red value 1, Red value 2)) + (maximum (Green value 1, Green value 2) - minimum (Green value 1, Green value 2)) + (maximum (Blue value 1, Blue value 2) - minimum (Blue value 1, Blue value 2))
4. The color brightness difference can be determined using the following formula:
5. ((Red value X 299) + (Green value X 587) + (Blue value X 114)) / 1000

Expected Result

1. The color difference is expected to be greater than 124.
2. The color brigheness difference is expected to be greater than 499.

Failed Result

1. Change either the link attribute value or the bgcolor attribute value of the body element so the colors exceed the WAI ERT algorithm threshold
2. Another way to pass this test is to remove the link attribute and the bgcolor attribute from the body element.

Examples

Pass Examples

The background color and the link color surpass the WAI ERT color algorithm threshold.

<?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 #227-2 - Negative</title>
</head>
<body bgcolor="#ffffff" link="#000000">
<p>This is some example text.</p>
</body>
</html>

Fail Examples

The background color and the link color do not surpass the WAI ERT color algorithm threshold.

<?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 #227-1 - Positive</title>
</head>
<body bgcolor="#ffffff" link="#cccccc">
<p>This is some example text.</p>
</body>
</html>