Tip:
Highlight text to annotate it
X
Welcome to part four of LSNTAP's Web Accessibility series! Today is all about color contrast.
The people we're concerned with in this section are the colorblind. Colorblindness affects
roughly one in ten men and a very few women Most predominant is red/green colorblindness,
meaning that a person can't distinguish between the two. For example, where most normally-sighted
people would see this, a person with red/green colorblindness would see this.
What we're getting at here is that you should avoid using color as the sole method for conveying
information. A graph like this is okay, as long as the sections are also labeled. When
you do use color to convey information, try to choose colors that a colorblind person
is likely to be able to tell apart, like blue and red. Your best bet is black and white,
which provide maximum contrast. WCAG says that you should have at least a
color contrast ratio of 4.5 to 1, but that a ratio of 7 to 1 is best. Calculating this
is very mathematical, but you can use something like WebAIM's Color Contrast Checker at webaim.org/resources/contrastchecker
to find out how your colors stack up. Here are some good examples of adequate contrast.
Also, watch video 8 in this series for more tools to help you with your site's color!
For now though, stay tuned for some help with coding.