Choosing Color Carefully

(UFIT logo is visible before fading from the screen. The narrator faces the camera.)  
Welcome to Accessibility in 5, a series from UFIT where we explore a quick tip on making your content more accessible in five minutes or less.
(Screen reads Tammy Barber Education and Training)
I'm Tammy Barber, and today's topic is choosing colors carefully. 
When creating online content, color choice is important because colors can capture attention and enhance focus. 
Often, color is intentional to promote a brand or an important effect. 
However, when it comes to accessibility, additional consideration should be made.
The Web Content Accessibility Guideline, or WCAG, recommends that color choices provide distinguishable contrast between backgrounds and fonts. 
In other words, how light or dark backgrounds, fonts, and other essential content are really matters. 
The guideline uses a grade system to measure the degree of contrast between a pair of colors, with three levels of compliance: A, AA and AAA. 
To meet the highest level of compliance, AAA requires a contrast ratio of seven to one.
However, since obtaining the highest level of contrast is not always possible, it is recommended that at least the critical areas, such as headlines and body text, meet the highest standard. 
The University of Florida's policy is to meet the AA standards or higher for accessibility.
Fortunately, there are tools available for designers, developers, and other creators of online content to ensure materials are accessible. 
One commonly used is the Contrast Checker by WebAim. This free resource tests colors against contrast ratios and helps to make sure online materials adhere to the WCAG standard.
Using this tool is easy once you learn a few basics. For instance, if you know the colors’ hex codes are RGB color, just place them in the forefront or background field in Contrast Checker. 
If you do not know the hex code, you can use the eyedropper tool to find the contrast score. 
To do this, click on the color box in Contrast Checker to reveal the eyedropper, then drag it to the color you want to test.
Once your background and forefront colors have been inserted, Contrast Checker will generate a pass or fail grade. 
If the colors need adjustments, you can choose different variations of the colors until the contrast is compliant.
With accessibility, not everything is black and white, nor does it have to be. 
With a tool like Contrast Checker, content can meet the WCAG standard of AA and still be aesthetically appealing. 
Making specific color choices for accessibility is a vital step to ensure that all individuals can access online content.
Since one in twelve people have some sort of color blindness, Content Creators can significantly contribute to inclusivity by providing sufficient contrast in body text, logos, diagrams, and other important information. 
However, low contrast content affects more than those with color blindness. 
People with low vision or cognitive conditions like attention focus issues are also affected when sufficient contrast is lacking.
Taking the steps to check for accessibility will allow most users to readily access online information. Remember though, choosing colors carefully does involve more than just color contrast. 
Something else to consider is the need to communicate information to users through words or icons rather than color alone.
For instance, if a form field turns red, warning online visitors that it has not been completed, individuals with color blindness may not perceive the color change. 
A more effective approach would be to display an X symbol next to the incomplete field, in addition to turning it red. 
This makes the warning accessible to a wider range of users.
Sometimes colors are used to draw attention to information. 
If you choose to use color to indicate importance, it is recommended to also make the word bold or italic so that someone who cannot see color can still recognize the emphasis, just don't forget the color contrast.
Following the WCAG guidelines and intentionally choosing colors to help all web users is the responsible thing to do. 
If you need support or have questions, please contact the Center for Instructional Technology and Training at citt.ufl.edu for a consultation. 
Simply click Request Help.
Thanks for watching Accessibility in Five. 
Tune in next month to learn more about what makes text readable.
(UFIT logo is visible before fading from the screen.)