When designing content for the web, be sure not to rely on color alone to convey meaning. Use color to enhance design, but not drive it. Colorblind or screen reader users may not be able to easily perceive differences in color, which can create confusion.

Take for example the graph below showing this week’s high temperatures in Seattle and Olympia.

While this may appear to clearly convey the data, looking at this graph with the colors removed quickly reveals problems. What line represents each city?

By adding texture to the lines in the graph, line labeling can be clear, regardless of the colors being used.

To make these graphs even more accessible, the author could also include the accompanying data table, as was discussed in the Providing Alternative Text for Complex Images blog post.

When working with text alone, additional differentiation could be added through bolding, underlining or the inclusion of accompanying symbols. These tools enable color to accentuate a message, rather than convey it. Always consider what information would be lost if the document was converted to grayscale.

If you have any accessibility tips or questions, please reach out to Robert Hardy (6105), the district’s Website Accessibility Specialist.