Accessibility Testing Procedure

Color Contrast

Guideline

The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following:

• Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1;
• Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement.
• Logotypes: Text that is part of a logo or brand name has no minimum contrast requirement.

Intent

The intent of this regulation is to provide enough contrast between text and its background so that it can be read by people with moderately low vision (who do not use contrast-enhancing assistive technology). For people without color deficiencies, hue and saturation have minimal or no effect on legibility as assessed by reading performance (Knoblauch et al., 1991). Color deficiencies can affect luminance contrast somewhat. Therefore, in the recommendation, the contrast is calculated in such a way that color is not a key factor so that people who have a color vision deficit will also have adequate contrast between the text and the background.

Text that is decorative and conveys no information is excluded. For example, if random words are used to create a background and the words could be rearranged or substituted without changing meaning, then it would be decorative and would not need to meet this criterion.

Text that is larger and has wider character strokes is easier to read at lower contrast. The contrast requirement for larger text is therefore lower. 18 point text or 14 point bold text is judged to be large enough to require a lower contrast ratio. "18 point" and "bold" can both have different meanings in different fonts but, except for very thin or unusual fonts, they should be sufficient.

Because different image editing applications default to different pixel densities (e.g. 72 PPI or 96 PPI), specifying point sizes for fonts from within an image editing application can be unreliable when it comes to presenting text at a specific size. When creating images of large-scale text, authors should ensure that the text in the resulting image is roughly equivalent to 1.2 and 1.5 em or to 120% or 150% of the default size for body text. For example, for a 72 PPI image, an author would need to use approximately 19 pt and 24 pt font sizes in order to successfully present images of large-scale text to a user.

The previously-mentioned contrast requirements for text also apply to images of text (text that has been rendered into pixels and then stored in an image format).

This requirement applies to situations in which images of text were intended to be understood as text. Incidental text, such as in photographs that happen to include a street sign, are not included. Nor is text that for some reason is designed to be invisible to all viewers. Stylized text, such as in corporate logos, should be treated in terms of its function on the page, which may or may not warrant including the content in the text alternative. Corporate visual guidelines beyond logo and logotype are not included in the exception.

In this provision there is an exception that reads "that are part of a picture that contains significant other visual content,". This exception is intended to separate pictures that have text in them from images of text that are done to replace text in order to get a particular look.

Images of text do not scale as well as text because they tend to pixelate. It is also harder to change foreground and background contrast and color combinations for images of text, which is necessary for some users. Therefore, we suggest using text wherever possible, and when not, consider supplying an image of higher resolution.

The minimum contrast success criterion (1.4.3) applies to text in the page, including placeholder text and text that is shown when a pointer is hovering over an object or when an object has keyboard focus. If any of these are used in a page, the text needs to provide sufficient contrast.

Although this regulation only applies to text, similar issues occur for content presented in charts, graphs, diagrams, and other non-text-based information. Content presented in this manner should also have good contrast to ensure that more users can access the information.

Note: Generally speaking, the color value of #767676 is the lightest color gray text can be on a white background in order to meet the AA standard for this guideline.

Finding Applicable Components

• Visually examine all appearances of meaningful text and images of meaningful text displayed on the page for areas that may have low background to foreground contrast.

Inspecting and Using Components

• Use the WebAIM Color Contrast Checker to determine the contrast ratio between the foreground and background colors.
  • For Web text: Inspect the foreground and background elements with the browser developer tools and use the color values present in the WebAIM Color Contrast Checker.
  • For Image text: Using the Color Contrast Analyzer application, use the colour picker tool to select foreground and background colors from the screen.
• Analyze the page using DeQue's Attest browser extension.
  • For Image text: Using the Color Contrast Analyzer application, use the colour picker tool to select foreground and background colors from the screen.

Section 508/WCAG 2.0 Failure Conditions

• An instance of colors/shades for discerning between background and foreground content having contrast ratios of less than 4.5:1 for normal text or 3:1 for large text.
  • Fails 1194.31(b): Use with low vision.
  • Fails 1.4.3 Contrast (Minimum).

Reporting Test Results

• Any failure in Section 508 Failure Conditions results in: Fails Baseline Requirement #9.
• Colors/shades for discerning between background and foreground content have contrast ratios of 4.5:1 for normal text, a ratio of 3:1 for large text, or better then: Passes Baseline Requirement #9.

For sharing test results between Agencies, the results of Section 508 Conditions and Reporting Test Results must be reported.