Two closely related efforts are underway to provide
guidelines on accessible Web design - the Federal
government's
Section 508 initiative and the World Wide Web
Consortium's Web
Accessibility Initiative.
The following table summarizes the two sets of
guidelines.
|
Accessible Design Practice
|
Section 508
Guidelines
|
W3C WAI
Guidelines
|
Structure Your Content Properly And Use
Stylesheets
Use HTML logically to structure your content.
For example, use header elements to show the
logical relationship of the headers - h1's as
main topics, h2's as subtopics, h3's as
subsubtopics, and so on. Then control
presentation aspects like font style and
background color with stylesheets. If done
properly, your page should be easily readable
even without the stylesheet.
|
(d) Readability(style sheets)
|
Guideline 3: Use markup and style sheets and do
so properly
|
Provide text describing every non-text
element.
Using "alt" and "longdesc" attributes, provide
text explaining each image, java applet, or other
non-text element. Where an image contains
essential information, either provide descriptive
text or link to a text-only page that provides
the same information in text form.
|
(a) A text equivalent for every non-text element
shall be provided (e.g., via "alt", "longdesc",
or in element content).
|
Guideline 1. Provide equivalent alternatives to
auditory and visual content.
|
With multimedia files, provide captioning or
audio description of visual information
Audio files should have nearby links to text
transcriptions. Video files should be close
captioned except where synchronization is
unnecessary. In general, make use of available
accessibility improving features in the media you
are using.
|
(b) Equivalent alternatives for any multimedia
presentation shall be synchronized with the
presentation.
|
Guideline 1. Provide equivalent alternatives to
auditory and visual content.
|
Don't Rely On Color Alone
Avoid using color alone to convey information,
such as using red to indentify warnings and green
to identify recommended practices. The text
should explain itself.
|
(c) Web pages shall be designed so that all
information conveyed with color is also available
without color, for example from context or
markup.
|
Guideline
2. Don't rely on color alone.
|
Design your tables to read ("linearize") well
and label them to help associate each table cell
with row and column headers.
Voice browsers generally read a table by
progressing cell by cell across each row,
starting with the top row. A two-dimension table
is thus reduced to a linear series of pieces of
text. Design your tables so they will make sense
when read (heard) this way. Use THEAD, TFOOT, and
TBODY to group rows, COL and COLGROUP to group
columns, and the "axis", "scope", and "headers"
attributes, to describe more complex
relationships among data.
|
(g) Row and column headers shall be identified
for data tables.
(h) Markup shall be used to associate data cells
and header cells for data tables that have two or
more logical levels of row or column headers.
|
Guideline
5. Create tables that transform gracefully.
|
Preferably, avoid frames. If you do use
frames, clearly establish the content of each
pane in the layout with text in the title and in
the body of the page.
Because frames layouts display more than one
page at the same time, they are inherently
problematic for persons using adaptive
technology. It is easy for a disabled person to
lose track of which page he or she is viewing.
When using frames, give each frameset a title and
give each page an explanatory text in the body.
|
(i) Frames shall be titled with text that
facilitates frame identification and
navigation.
|
Guideline 6. Ensure that pages featuring new
technologies transform gracefully.
Guideline 12. Provide context and orientation
information.
|
Label fields in online forms to make it clear
what information should be entered in each
field.
Forms can be challenging for persons using
adaptive technologies. The text describing a
particular form field might occur anywhere near
the field (above, below, left, right) depending
on the page design. To make sure a person hearing
the page knows what information to enter in the
field, use a Label element to enclose the
describing text and an ID attribute in the Input
element.
|
(n) When electronic forms are designed to be
completed on-line, the form shall allow people
using assistive technology to access the
information, field elements, and functionality
required for completion and submission of the
form, including all directions and cues.
|
Guideline 8. Ensure direct accessibility of
embedded user interfaces.
|
Provide descriptive text for each image map
"hot spot."
Provide "alt" text for each area defined in an
image map describing where the hot spot is linked
to. Use client-side image maps. In general, avoid
server-side image maps
|
(e) Redundant text links shall be provided for
each active region of a server-side image
map.
(f) Client-side image maps shall be provided
instead of server-side image maps except where
the regions cannot be defined with an available
geometric shape.
|
Guideline 1. Provide equivalent alternatives to
auditory and visual content.
|
Label links to scripts and carefully evaluate
how the script will function with adaptive
technologies
Scripts evoked by means of an anchored link
should have descriptive link text. Where an image
is used in the anchored link, provide "alt" text.
Carefully select the event handlers (onmouseover,
onclick, etc.) you use to be sure they will work
for persons using adaptive technology
|
(l) When pages utilize scripting languages to
display content, or to create interface elements,
the information provided by the script shall be
identified with functional text that can be read
by assistive technology.
|
Guideline 6. Ensure that pages featuring new
technologies transform gracefully.
|
If all else fails, provide alternative
text-only pages
Where essential information cannot be made
accessible otherwise, provide text-only
alternatives with the same content and
functionality.
|
(k) A text-only page, with equivalent information or
functionality, shall be provided to make a web site
comply with the provisions of these standards, when
compliance cannot be accomplished in any other way.
The content of the text-only page shall be updated
whenever the primary page changes.
|
|
Other Practices That Help
-
When linking to files that require plug-ins,
provide a link to where the plug-in can be
obtained.
Proprietary formats like Adobe Acrobat PDF
files, which can be created with
accessibility features, require plug-ins
since browsers do not know how to display
them.
-
Define abbreviations
Enclose abbreviations and acronyms with
"abbr" and "acronym" elements with "title"
attributes giving the full expansion.
-
Identify TTY and Phone numbers
Phone numbers listed on Web pages should be
identified as voice, TTY, or both. FAX
numbers should be clearly labelled as such.
-
Provide a way to skip repetitive navigation links
Often, page designs have lengthy menus at the beginning
or end of each page. To person using adaptive
technology, having to tab through such menus to get to
the content can be time consuming. Project a link to
jump from near the top of the page directly to the content.
-
Avoid flicker
For some people, flicker rates between about
2 Hz and 55 Hz have the potential to be hypnotic or
to evoke seizures. Animated gifs, scripts, and
applets should have relatively slow motion, particularly
if bright. Having the flicker or motion stop after a
few cycles also is desirable.
- If response within a limited time is required,
alert the user and give them a way to get more time
A window that goes away or redirects after a limited
time can be frustrating to someone slowly reading the page,
especially if the page is a form they are trying to
fill out.
|
|
|