Let main content follow user color settings
C23 is a deliberate omission. Style the colors of the secondary parts of the page, the banner, the menus, the table of contents, and set no text or background color on the main content at all. W3C attaches it to 1.4.8 Visual Presentation, which is Level AAA, and lists it as sufficient there. The mechanism is browser behavior and it is the fact the technique turns on. Where an author has not specified those colors, a reader can change them from the browser with no user stylesheet needed, and where the author has specified them, the browser will not override. So the colors of the main content become entirely the reader's, determined by their own preferences. It is an unusual shape for a rule about contrast, because the author is choosing not to decide rather than choosing a ratio. Modern forced-colors modes address a related need through a different mechanism.
How we find it in an audit
This one is checked by setting colors rather than by reading code. We set text and background colors in browser preferences and reload, then look at which regions changed. Anything with a hard-coded color in the main content stays put, and that is the finding.
How affected users experience it
Readers who need specific color combinations, yellow on black for some low-vision conditions, muted backgrounds for scotopic sensitivity, set them once in the browser and expect the web to follow. A page that hard-codes its body colors overrules that on every article it serves, and the workaround is a user stylesheet, which is a thing almost nobody has.
Passes vs. fails
Passes
header, nav { color: #fff; background: #1a2b44; }
/* main content sets no colors, so the reader's preferences apply */Fails
main { color: #222; background: #fff !important; }Other ways to satisfy this rule
21 guides on this site are filed under 1.4.8 Visual Presentation. W3C lists this one as sufficient for that rule on its own. Implement it correctly, in a way your readers' software actually supports, and the rule is met.
- C12sufficientSize text in percent so it scales
- C13sufficientUse named font sizes that respect user defaults
- C14sufficientSize text in em units, not pixels
- C19sufficientAlign text left or right, never justified
- C20sufficientCap line length with relative column widths
- C21sufficientGive paragraphs breathing room with line spacing
This guide is our interpretation of W3C technique 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. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.