10.2. Accessible Charts & Graphs

Part of Milestone B — packet due Thu Oct 22, 2026, by 4:10pm ET (Timeline).

10. Overview

10.1 Persons With Disabilities

10.2 Charts & Graphs

10.3 Design Challenge Strategy

Overview: Designing Charts and Graphs

Charts and graphs will likely be included in some of the presentations you will be creating. Use the design guidelines outlined on this page to ensure that persons with color-blindness, low-vision, and photophobia will be be able to access them.

Tools for universal design can be found here:

Color Oracle: Simulates color blindness
Web Aim: an Accessible Design Web Checker
Color Picker: This an be used to meet the legal requirements for contrast

Contrast

Contrast is a often overlooked but important aspect of ensuring access to information for persons with low vision.

Situational Limitations

Color does not exist in a vacuum. It's profoundly affected by the environment in which it finds itself. Color combinations that hold up in a variety of conditions utilize high contrast to each other and their surroundings.

Low Vision

According to the National Institute of Health (external link), Low Vision is defined as 20/40 or worse vision with best possible correction. It affects approximately 1% of the population. Causes can include: Age-related macular degeneration (AMD), Cataracts, Diabetic retinopathy, Glaucoma, and Genetics.

Low contrast graphics can make it difficult for persons with low vision to access information in media.

How to ensure your work meets the accessibility requirements for contrast:

Text Color & Contrast

The text should be high contrast against its background (light on dark or dark on light). Use the Wave Contrast Checker (external link) . To ensure it is between 4.5:1 and 16:1 (over 16:1 cause issues for person's with light sensitivity.

Image Color & Contrast

Review this video for an example of image contrast needed and how to use the WebAim Color Picker
Aim for 3:1 contrast ratio for important images.

Avoid using highly saturated colors

These can cause vibration, blurring, and physical discomfort for persons with photophobia. According to the National Library of Medicine of the NIH (external link),

Photophobia is a common yet debilitating symptom seen in many ophthalmic and neurologic disorders. It is estimated by the NIH that up to 20% of the population may be affected during their lifetime. It is defined as an abnormal sensitivity to light, especially of the eyes, and is reported in most all forms of migraine and many neuro-ophthalmic disorders.

Don't rely on color alone to differentiate data

4.5% of the population is color-blind may not be able to distinguish between colors. Always include text adjacent to the graphics. To check for color-blind efficacy, you can use the Color Oracle Simulator A native app for MAC and PC that simulates colorblindness for anything currently showing on a display (external link). (free)

Note: Color should never be the primary differentiator. Moving the letters directly under the bars, makes them primary and the colors secondary.

Google Sites

Report abuse