Visual
Impairment
When we talk about visual impairment, we tend to think of blindness or
low-vision. Both of these are important issues to consider when designing
a web site, and lack of accessibility features such as alt text or alternative
formats can render a site unusable to some. For people who are blind
there are two significant challenges presented by the web (though there
can be more). An accessible site should provide text descriptions of
visual elements, such as images. Blind web users have no means of interpreting
images if the designer does not provide a text description1. These descriptions
generally come in the form of alt tags. Structure of the site is also
important. An accessible site is well structured. The page reads linearly
when read by a screen reader, and content is organized in a way that
makes sense. Listening to a page using a screen reader has been compared
to reading a page through a soda straw7. The user can
only see one word at a time and cannot see anything else around it.
Using heading elements and being thoughtful about the text used as a
hyperlink are two important ways designers can help users more easily
make sense of the page. For designers, there are several tests to see
how a screen reader might read a page. The best, of course, would be
to utilize a screen reader, but unlike regular web browsers, screen
readers are expensive. IBM’s Homepage Reader (a browser with screen
reader functions that only works with web content) costs about $150
and JAWS (a full-featured system-based screen reader which works with
most computer applications) costs about $1200. A designer can get a
fairly good idea of how a page will be read by using a text-based browser
such as Lynx. There are web-based versions of Lynx-viewers8 that make the
process fairly easy. Using a text-based browser can help the designer
determine if the content on the page is accessible by showing the linear
structure of the page as well as showing what the alt text of images
is. Images 1 and 2 illustrate the NCSU web page as viewed using Internet
Explorer and using Lynxview online.
Image
1
In this example
all the text that is represented by images in Image 3 is accurately
represented in text form in Image 4. It should also be noted that there
is no real description on the page, which could be confusing to any
user.
Image 2
Visual impairment is not limited to blindness though and designers often
do not think about the broader range of visual impairments that people
might have. These include (but certainly are not limited to) near/far
sightedness, astigmatism, and color-blindness. Color blindness is a
fairly common condition – roughly 1 in 20 people have some form of color
blindness. Men are more inclined than women to have color blindness
– about 10% of men have color-blindness. While not a particularly serious
condition, color-blindness can affect how a person interacts with information
on the Internet. For example, a father with color-blindness is searching
for information about his daughter’s class schedule at a year-round
school. Students at the school are broken up into four tracks,
which have alternating schedules at the school. The daughter is in track
four. The school calendar is on the web. Each track is assigned a color
(Image 3).
Image 3
The father has deuteranope
color blindness, a form of red/green color deficit. When he views the
calendar on the web, there is little contrast between the items marked
red and those marked green (Image 4). The images that are used in this
example were generated from a web page using an online tool called Vischeck9.
Image 4
In this situation, the use of color to solely convey information makes
it difficult to determine which track is which. A simple fix10 for this problem
would be to also put the number of the track in the colored table cell
(Image 5).
Image 5
For people with low vision, it is important to use text on the page, rather
than images of text. This makes it easier for users with low vision
to increase the font size on the page. Designers often use images to
control the formatting of the text by creating images that represent
text (e.g. the text “NC STATE UNIVERSITY” in Image 1). The use of Cascading
Style Sheets (CSS) can be used to help control formatting and still
allow users to modify text to meet their specific needs. A simpler strategy
is to simply be sure that all text is relatively rather than absolutely
sized (using the heading tags and relative sizes as opposed to pixel
sizes).
Making a page accessible for individuals with visual impairments also benefits
the larger community. Relying on color alone to relay information locks
information up in a singular format. It is not easily read or printed
out. Making font sizes and page layouts fluid benefit those users who
wish to enlarge the text. People with nearsightedness or even people
who spend large amounts of time looking at computer screens appreciate
the ability to make what is on the screen easier to see. Ensuring that
images have appropriate alt text ensures that pages will convey the
same meaning with out images or on text browsers. These solutions are
relatively simple, yet drastically broaden the accessibility and usability
of a page.
