WebAIM - Web Accessibility In Mind

Visual Disabilities
Low Vision

Types of Low Vision

While visual acuity of people with low vision varies widely, low vision is generally defined as a condition in which a person's vision cannot be fully corrected by glasses and interferes with daily activities such as reading and driving. Low vision is more common among the elderly, but it can occur in at any age as a result of conditions such as macular degeneration, glaucoma, diabetic retinopathy, or cataracts. Each of these conditions affects a person's vision in different ways; however, some general principles apply:

Important

The key principle of web accessibility for people with low vision is:

  1. Perceivable: content that is small, does not enlarge well, or has low contrast may be difficult to perceive.

Macular degeneration

The macula is near the center of the retina, which is the area in the back of the eye. "Dry" macular degeneration occurs as the tissues of the macula thin out over time, resulting in a gradual loss of vision. "Wet" macular degeneration, which is less common, occurs when blood vessels at the back of the eye begin to leak fluid or blood which blurs central vision and often results in rapid loss of vision. In either case, the person's central area of sight is affected the most. The images below help illustrate the effect of macular degeneration..

An photograph of a boy, but the central area of vision is darkened and blurred, making it almost impossible to see the boy's face text can appear broken
Experience it for yourself

drawing of a woman covering her eyes To get a better idea of what macular degeneration is like, hold up your hand about 12 inches (about 30 cm) from your eyes, so that you can't see straight in front of you, but you can see around the edges of your hand. Now, without looking to the sides, try to read something in your peripheral vision. Keep your vision focused on your hand! This illustrates how a person with advanced macular degeneration sees things. The problem isn't so pronounced for people with lesser degrees of macular degeneration, but the basic idea is the same.

Glaucoma

Glaucoma is caused by an increase in pressure inside the eye, which causes damage to the optic nerve. The end result is often the inverse of the effect of macular degeneration: the loss of peripheral vision and a blurry central area of vision. Text will appear faded and blurry. Some people have compared the effects of glaucoma to looking at everything through a straw.

photo of a boy that is blurred in the center and the edges are completely blacked out due to loss of peripheral vision text can be seen in the middle of this image, but it is blurry, and the sides are completely dark due to loss of peripheral vision

Diabetic retinopathy

One potential effect of long-term diabetes is the leaking of retinal blood vessels, which can cause dark patches in the field of vision where the leaks occur. Text may appear blurred or distorted in where these dark patches occur.

photograph of a boy with dark blotchy areas text that has dark blotchy areas that are somewhat distorted

Cataract

Individuals with a cataract have areas of opacity in the lens of their eyes which results in a blurred or hazy effect, especially in bright light. Text may be difficult to distinguish from the background. High contrast is especially important for people with an advanced cataract.

photograph of a boy that is blurred and very light, making it difficult to see details blurry and very light text against a light background, which is difficult to read

Screen Magnifiers and Zoom

Screen magnification or zoom are the most common technologies that people with significant low vision use. Software or operating system settings can be used to magnify the entire screen or portions of the screen allowing people with low vision to see it more clearly. Users can also use browser settings to zoom a web page or to increase their default text size.

Some kinds of content are difficult to interpret when enlarged or zoomed. For example, graphics that contain text may become blocky and pixilated when enlarged, making the text difficult to read. Consider the two images below. The one on the left is a screenshot of text that has been enlarged. The image on the right is a screenshot of text within a graphic that has been enlarged.

enlarged text with the word 'Helen' which is clear and easy to read enlarged graphic of the word 'Keller' which is very blocky and pixelated
Important

To make text more legible when enlarged, use true text as much as possible, rather than text in graphics.

Web pages should be designed so that there is no loss of content or functionality when it is enlarged/zoomed or when the text size is increased. When possible, horizontal scrolling should be avoided—it is especially difficult to read page content when the user must scroll or pan to read lines of text that extend off the screen. Implementing responsive/adaptive design to support small screen and mobile devices will also better ensure that content adapts to a screen when it is zoomed or enlarged.

High Contrast and Customized Colors

Web content with low contrast, meaning the brightness difference between text or a graphic and its background, can be difficult to read, especially for people with low vision. Some color combinations are not easy on the eyes for anyone, especially for people with low vision. Color contrast can be checked using WebAIM's Contrast Checker to ensure it meets the WCAG 2.0 AA guidelines.

While authors should ensure their content has sufficient contrast, some users with low vision may need even more contrast. Some may benefit from specific color combinations, such as blue text on a yellow background. Users with low vision may enable high contrast modes or may override default colors via settings in their operating system or web browsers. When these are enabled, users may not see the author-defined web page colors.

Important

To the extent possible, maximize the contrast of your web pages, including graphics, fonts, and backgrounds. Ensure that color is not used as the only means of indicating or differentiating meaning or content.