Element

body

Error Type

Known

Guidelines

Requirement

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

Error

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

Short Description

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

How To Repair

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

Repair Example

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

Steps To Check

Procedure

1. Calculate the color difference and the color brightness difference between the vlink 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 vlink 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 vlink attribute and the bgcolor attribute from the body element.

Examples

Pass Examples

The background color and the vlink 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 #229-2 - Negative</title>
</head>
<body bgcolor="#ffffff" vlink="#000000">
<p>This is some example text.</p>
</body>
</html>

Fail Examples

The background color and the vlink 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 #229-1 - Positive</title>
</head>
<body bgcolor="#ffffff" vlink="#cccccc">
<p>This is some example text.</p>
</body>
</html>
Web site engine's code is copyright © 2023
Inclusive Design Institute