Draft basic reference card: fuller

Title: Basic Guide to Accessible Web Design: fuller
Author: Stella O'Brien
Version: 2
Status: Draft
Date last modified: 10th August 1998

1 Introduction
2 Supply text versions of visuals
3 Provide access to audiovisual material
4 Allow alternative input
5 Make text easy to scan
6 Make text easy to read
7 Provide easy navigation and links
8 Use accessible layout
9 Test the accessibility
10 Get more information

1 Introduction
Graphics, sounds, and moving images are powerful communication tools. Use
them, but do not lose the audiences that cannot see, hear, or interact with
them. Design your site so that it is faster and easier to use for people
with portable web devices, anyone with low bandwidth connections, and users
with disabilities. This basic guide introduces some of the simple and
cost-effective ways you can reach this wider audience.

2 Supply text versions of visuals

Good visuals are very powerful, but not everybody can see them. Text can be
spoken or converted into braille. Well written text alternatives
communicate the content or purpose of a picture or display  to people who
have no access to them.
A simple picture might only need a concise description to outline what it
illustrates or does (if it is a graphical link). Provide a fuller
description if necessary.
Frequently, you need to display data summaries in the form of a diagram,
graph, or pie chart. For example, your business web may allow you to
visualise spreadsheet projections by means of animations. The complexity of
this material means that you need to provide (say) a link to a full, text
version of the data summary, and the raw data. Explain how you interpeted
the data. Highlight any comparisons which are obvious in the display, such
as a difference in annual sales figures. The information is now accessible
to people who can not see the visual representations.

3 Provide access to audiovisual material

Audio is a rich medium which is not available to deaf people, users in a
noisy environment, or those who have the sound turned off. Provide a text
version of sound or speech clips which stand alone, or which accompany a
visual presentation. Include a description of all relevant sounds.
Provide both audio and text descriptions of dynamic visuals such as movies,
or animations. Use audio and text to make visual cues explicit. Draw
attention to, and describe, significant action. Important auditory and
visual information is now available to users who have partial or no access
to the original material.

4 Allow alternative input

Not everybody has the physical dexterity or acuity of vision needed to use
a mouse or tracker ball. The choice of input should be determined by the
user's preferences and technical resources. Voice control is easier if the
navigation commands, name of links, fields etc. are simple and distinctive.
Keyboard access is the only way some users can interact with a page.
The user-friendly author ensures that information displays such as forms
and imagemaps are accessible to alternative inputs.

5 Make text easy to scan

Even for sighted people with large monitors, it takes longer to read online
text than print. Users scan text, picking out keywords and sentences and
ignoring those areas which do not interest them. Many users find it
difficult to manipulate long, scrolling pages. They want the text to be
clear, short, and relevant.
It is harder for blind users or people with small display screens to scan
for interesting material. Users of speech browsers or screen readers scan a
speech
stream to listen for cues to relevant information.
An organised framework of summaries, headings, and lists promotes scanning
for  users who read or listen. The author can help by using proper HTML
markup to emphasise the structure of the page. The framework helps users to
navigate through a page, and to decide whether they want to follow a link
or to read a full document.

6 Make text easy to read

Page activity should be initiated by the user, not enforced by the author.
For example, the auto-updating of a page can be disorienting for some
people who use screen-readers. It is a mystery to users who have cognitive
disabilities and do not understand why the page has changed when they did
not request the action. Request users' permission before refreshing a page.
Moving text is difficult to read for several categories of users. Allow
users to freeze movement.
Complex background images and colours obscure text and make it difficult to
read for people with vision impairments. So do poor colour contrasts; white
text on a pale grey background is difficult to read and to print.
Some people need large fonts or a zoom facility to read a page more
comfortably. User-friendly authors use relative sizing and positioning
(e.g., a percentage of the
default size) rather than absolute sizes or positions (e.g., pixels or points)
for both fonts and graphics.

7 Provide easy navigation and links

Navigation aids should  be consistent in name, style, position, and
accessibility throughout a site. Users need constant, easy access to
i) distinctive information about their current position (aids bookmarking)
ii) the home page and
iii) a choice of overviews of the site's structure and contents.
This ease of access facilitates current navigation, and makes it easier to
return in the future because bookmarks have distinctive names.
Provide meaningful names for links so that users have a clear idea of the
content of a link, and where it will take them.

8 Use accessible layout

Traditional layout practices are inherited from print media. When the
techniques are misused to present a web page, they can be a barrier to
making information accessible. Use layout which supports users who want to
manipulate the structure in a way that suits their personal preferences,
and technical resources.

9 Test the accessibility

Test the web site with several  browsers, in various modes (e.g., with
graphics loading turned off; or without plug-ins), and on different
monitors. The user-friendly author ensures that information displays such
as forms and imagemaps are accessible to alternative inputs (e.g., keyboard
rather than mouse). Check that interacting with the page is possible
without using a mouse.
Evaluate the site with an automated analysis tool which also checks for
compatability with older versions of browsers.  Make sure the web page
still communicates the relevant information.

10 Get more information

For updated versions of this card visit ***. For more detailed guidelines,
fuller examples, and other useful techniques see ***.

Received on Wednesday, 12 August 1998 10:59:44 UTC