WebAIM - Web Accessibility In Mind

E-mail List Archives

High Contrast Control Option

for

From: Jordan Wilson
Date: Jan 5, 2015 8:30AM

We are currently planning a site and one of the options we¹ve chosen to
implement is a High Contrast control in accordance with WCAG 2.0 Technique
G174

This allows us some greater design/color flexibility for the site which we
were having difficulty with because the brand colors are slightly under
contrast. I wanted to ask the list if they had any suggestions or cautions
on implementing this technique.

You can see examples of the technique at these two sites:
http://www.mills-peninsula.org/accessibility.html

http://www.northeastmedicalgroup.org/


The High Contrast button is in the top right of both pages, selecting it
changes all CSS colors in the site to a separate high contrast version
(the same site, just different CSS)

To make sure that our High Contrast option is accessible to users, we
thought to implement four considerations:

1. Ensure the switch control is a prominent, permanent and high contrast
element on the page.
2. Place the control toward the beginning of the tab order so that
keyboard users will find it efficiently
3. Feature the option on the site accessibility page, so that users are
aware of it and understand how to use it.
4. Cookie the setting, so that users who enable it default to High
Contrast on return visits.

Are there any opinions of users out there about implementing this
technique? Does anyone have experience / recommendations for implementing
it properly?

Here¹s the link to the WCAG description of the technique:
http://www.w3.org/TR/2014/NOTE-WCAG20-TECHS-20140916/G174


Thanks for you help!