Techniques for WCAG 2.0

Skip to Content (Press Enter)

-

G156: Using a technology that has commonly-available user agents that can change the foreground and background of blocks of text

Applicability

All technologies

This technique relates to:

User Agent and Assistive Technology Support Notes

Most browsers allow the user to change the color settings to override Web author's CSS and HTML color schemes. This includes IE, all versions of Firefox, Mozilla, and Opera after version 6.

When specified colors are overridden in Firefox and Netscape, most Javascript pop-up boxes and drop-down menus become unusable. Pop-up boxes gain a transparent background, superimposing the text of the box on the text of the page, and drop-down menus either become transparent or gain a dark-grey background.

IE 6 will not override background colors in the browser unless the same background color has also been selected in the system settings.

Description

Some people with cognitive disabilities require specific color combinations of foreground text and background to help them successfully understand the contents of the Web page. Most popular browsers provide the option to change colors settings globally within the browser. In this case the colors selected by the user override the foreground and background colors specified by the Web author.

In order to meet this success criteria, the Web author would design the page so that it works with browsers that have these controls, and the author does not override these controls.

Note that overriding the foreground and background colors of all text on a page may hide visual clues to the grouping and organization of the Web page, making it much more difficult to understand and use. This technique may not be appropriate when background colors are used to delineate areas of the page. This technique may be appropriate for technologies and user agents that do not alter border colors when background colors are overridden. If background colors are used to delineate areas of the page, "C23: Specifying text and background colors of secondary content such as banners, features and navigation in CSS while not specifying text and background colors of the main content (CSS) " may be used to permit the user to control the colors of the main text while retaining the visual structure of the Web page.

Examples

Resources

Resources are for information purposes only, no endorsement implied.

Tests

Procedure

  1. Open the Web page in a browser that allows users to change colors of HTML content.

  2. Change the foreground and background colors in the browser settings so they are different than those specified in the content.

  3. Return to the page and check that that the new specified foreground text and background colors in the browser override the colors specified in the content.

Expected Results