Alert: Meet DEI's 2022 Trusted Testers!

Learn more about DEI's Trusted Tester for Web Pilot Course...Read more

Use Good Color Contrast

Contact the Accessible Media Coordinator

Robert Starr
Accessible Media Coordinator

Assistive Technology Initiative
MS: 6A11
Voice: 703-993-5644
Fax: 703-993-4743
rstarr@gmu.edu

Contact the IT Accessibility Coordinator

Kristine Neuber
IT Accessibility Coordinator

Assistive Technology Initiative
MS: 6A11
Voice: 703-993-9815
Fax: 703-993-4743
kneuber@gmu.edu

Have Assistive Technology Questions? Contact Us!

Jackie Servello
Assistive Technology Specialist

Assistive Technology Initiative
MS: 6A11
Voice: 703-993-4329
Fax: 703-993-4743
jservell@gmu.edu

Have questions? Contact the ATI:

Assistive Technology Initiative
MS: 6A11
Voice: 703-993-4329
Fax: 703-993-4743
ati@gmu.edu

Good color contrast draws interest to important content on your course site.

 

Why is this important?

It also benefits individuals who may have colorblindness or those with low vision. The Web Content Accessibility Guidelines (WCAG 1.4.3*) states that the contrast ratio for small text (~12 pixels or below) should be at least 4.5:1. For large text (~18 pixels or above) is 3:1.

To check the color contrast in your course site, do the following:

 

ADDITIONAL GUIDANCE FOR COLOR CONTRAST: Meaningful information should NOT be conveyed by color alone.

  • E.g., the image below shows a web form with required fields identified by red text. If an individual is unable to see the color red, they would have difficulty filling out the form. A simple fix would be to add an asterisk(*) next to the required fields. This would then provide users who are unable to see red an additional piece of information to identify what is required.

require form fields shown in red