Asqatasun v4 - Summary

Asqatasun v4 - AccessiWeb 2.2 - Rule 3.4.4

Summary

This test consists in checking whether the contrast ratio between text and its background is at least 4.5:1 for the bold textual elements with a font size superior to 14px.

Business description

Criterion : 3.4

Test : 3.4.4

Test description :

On each Web page, from 120% of the default font size (or 1.2em), do bold text and image of text pass one of the conditions below (except in special cases)?

Level : Gold

Technical description

Scope : page

Decision level : semidecidable

Algorithm

Selection

Set1

All the textual elements from the DOM with a font-size superior to 14px and bold

Set2

All the hidden textual elements from the DOM with a font-size superior to 14px and bold

Set3

All the img tags

Process

Test1

For each element of Set1, the contrast ratio is computed (regarding the contrast ratio definition) to check whether it is superior to 4.5.

For each element returning false in Test1, if the "ALTERNATIVE_CONTRAST_MECHANISM" is set to true by the user, raise a Message1, raise a Message2 instead.

If an element has a contrast ratio that cannot be determined (background defined with an image or a gradient), raise a Message3

Test2

For each element of Set2, the contrast ratio is computed (regarding the contrast ratio definition) to check whether it is superior to 4.5.

For each element returning false in Test2, raise a Message4

Message1 : Bad Contrast
Message2 : Bad Contrast But Alternative Contrast Mechanism Present On Page
Message3 : Not Treated Background Color
Message4 : Bad Contrast on Hidden Element

Analysis

Not Applicable

Passed

Failed

Pre-qualified

Notes

  1. By approximation, we consider that 1.2em of the default font size is equivalent to 14 px.
  2. The background color ("background" css property), the font color ("color" css property), the font size ("font-size" css property) and the font weight ("font-weight css property) are determined while fetching the page, through the javacript script. Each html element is analyzed to extract these info, as well as whether it is displayed ("display" css property equals to "none" or "visibility" css property equals to "hidden") and whether it is a textual node.