Photophobia (extreme sensitivity to light) is a relatively common issue for people with low vision. People with photophobia may experience eye pain, headaches, and general discomfort when looking at bright lights.
While “photophobia" literally means “fear of light,” photophobia isn’t a traditional phobia. It’s associated with various eye diseases, neurocognitive conditions, and some diseases like cancer and meningitis. Some medications can also cause photophobia, and symptoms vary greatly. For most patients, certain types of light cause the most severe symptoms, and the blue light from computer screens can be particularly problematic.
Photophobic individuals can adjust the settings of their computer monitors and smartphones to avoid the most severe effects, but many websites and apps aren’t designed to operate at low-brightness or high-contrast settings. Addressing these issues can make a site more accessible, and the Web Content Accessibility Guidelines (WCAG) provide useful guidance for making the necessary changes.
Poor color contrast ratios can prevent light-sensitive users from reading text
The term “color contrast" refers to the difference in light between objects in the foreground of content (such as text) and the background. WCAG standards don’t require websites to use specific colors, but the color contrast ratio must be sufficient to accommodate people with vision-related disabilities and people who access the internet using low-brightness settings.
WCAG Success Criterion (SC) 1.4.3 lays out the minimum contrast requirements for digital content: Standard text must maintain a ratio of at least 4.5:1, while large text (18 points or larger, or 14 points or larger and bold) should maintain a contrast ratio of at least 3:1. In other words, standard text — including pictures of text — should be 4.5 times brighter than the background.
It’s important to note that WCAG success criteria are divided into three levels of conformance: A (lowest), AA, and AAA (highest). WCAG SC 1.4.3 addresses minimum contrast ratios for AA-level websites, but there’s another set of requirements for AAA-level conformance. WCAG SC 1.4.6, “Contrast (Enhanced),” calls for a contrast of 7:1.
As we noted in our article “The Basics and Importance of Color Contrast for Web Accessibility,” these aren’t arbitrary ratios. WCAG’s requirements ensure that most people with low vision will be able to access and interpret content, regardless of the settings they’re using to browse the web.
Fortunately, fixing contrast issues is often a straightforward process. The Bureau of Internet Accessibility provides the a11y® Color Contrast Accessibility Validator, a free color contrast analysis tool that can aid in remediation. When addressing this issue, remember to check navigational elements, links, and images. Changes in color should maintain contrast ratios — for instance, if a hyperlink changes color after the user clicks on it, the new color will also need to conform with WCAG contrast ratio standards.
Automatic “dark modes" can cause readability issues
Many people with photophobia prefer using low-contrast settings, which are commonly called “dark modes.” As the name implies, dark modes display light-colored text on a dark background. In recent years, dark modes have become extremely popular among web users, including people who don’t live with disabilities.
WCAG doesn’t require websites to offer a dark mode, but as an optional setting, dark modes can be helpful for some people with disabilities. However, when dark modes aren’t optional, they can create accessibility issues for other users — and many designers implement dark modes without testing them carefully, which can defeat the purpose. Even if your website offers a high-contrast mode, you’ll need to make sure that it conforms with WCAG contrast ratio recommendations to ensure that it’s actually useful.
Finally, many people with photophobia use high-contrast modes built into their browsers or operating systems. Be aware that these people might not utilize your site’s dark mode, since they’re already browsing with high-contrast settings. Testing the primary version of your website with high-contrast settings can help you find areas that need improvement.
Avoid relying on color to convey information
As we’ve discussed throughout this article, people with photophobia will often change their system settings before accessing content. If your site depends on color — for instance, your site asks visitors to “click the red button" — you might be creating confusion and frustration for your users.
Designers can still use color to build excitement and compel users to take action, but remember that some disabilities (including photophobia) prevent people from perceiving or differentiating colors. WCAG addresses use of color under SC 1.4.1, which is a Level A criterion; any site that fails this check cannot be considered reasonably accessible. By understanding how the use of color affects your audience, you can make design decisions that won’t isolate a sizable part of your audience.
Consider all users when making accessibility improvements
Finally, recognize the full spectrum of disabilities when making any design or development decision. One of the major advantages of WCAG is the principle-based approach: The guidelines explain core concepts of accessibility, and webmasters that adopt those concepts can make better websites that work for everyone, not just a select group of people with disabilities.
Not everyone with photophobia browses the web the same way, and some of those people have other disabilities that affect how they use the internet. By auditing your website for WCAG conformance — and understanding the principles of accessible design — you can avoid simple mistakes and deliver a better experience for all of your users.
