SIA-R66Text outside widget has enhanced contrast
This rule tests conformance of the following accessibility requirements:
This rule checks that the highest possible contrast of text nodes outside widgets meets the enhanced contrast requirement.
This rule applies to every visible text node that is a child in the flat tree of an element in the HTML namespace, except if the text node has an ancestor in the flat tree for which one of the following is true:
- the ancestor is disabled, and has a semantic role that inherits from
- the ancestor is used in the accessible name of a disabled element with a semantic role that inherits from
- The highest possible contrast ratio between the foreground and background colors of the text node is at least 7.0:1 or 4.5:1 if the text node is large scale.
This rule makes the following assumptions:
Text nodes are not used for logotypes.
This rule has the following accessibility support concern:
- Different user agents have different levels of support for CSS. This can cause contrast issues in one user agent that do not appear in another.
This dark gray text has a contrast ratio of 12.6:1 on the white background:
<p style="color: #333; background: #FFF;">Some text in a human language</p>
18pt large black text has a contrast ratio of 4.6:1 on the gray background:
<p style="color: #000; font-size:18pt; background: #777;"> Some text in a human language </p>
This light gray text has a contrast ratio of 5.7:1 on the white background:
<p style="color: #666; background: white;">Some text in English</p>
This text is not visible:
<p style="display: none">Some invisible text in English</p>
This text is not part of a text node:
<p> <img scr="https://picsum.photos/100" alt="example" /> </p>
This document includes material copied from or derived from https://www.w3.org/WAI/standards-guidelines/act/rules/09o5cg/proposed/. Copyright © 2023 W3C® (MIT, ERCIM, Keio, Beihang).