Guidelines For Accessible Web Development
For
all images include "alt" or "longdesc" tags. These tags provide an
alternate text description of the image, and are accessible to screen
readers reading the information out loud to a person who can't see
the image. Ex: img src="apple.gif" alt="Image of an Apple"
Tables
should not be used for formatting purposes. This is because the screen
reader linearizes the data in a row order. Style sheets should be used
for layout.
Color
should not be used to convey information. Keep in mind those who are
color-blind when creating your pages.
Avoid
backgrounds that are busy, eye straining, or clash with the font. You
want your users to be able to view your website without problems.
Transcripts
of all audio should be made available so that the blind can retain
the information that was being conveyed in audio format.
Avoid
flickering or blinking text, which may cause seizures to those susceptible
to them.
Cascading
style sheets should be used to control font specifications such as
size and color. This is so the user has the option of turning the style
sheet off, if necessary.
Headings
should be used solely for the purpose of providing a heading, not for
enlarged text. The screen reader reads it as a heading, therefore if
the text is not a heading, it is read incorrectly.
Make
your links meaningful. Do not simply write "click here!". Give the
user idea description of the page to be visited.
Do
not create auto-refreshing pages. When a page refreshes, the screen
reader will start reading from the top again. The user may become frustrated
because they will lose their place on the page on each refresh.
For
image maps, provide alt text for each image (active region) on the
map. Without alt text, the images on the map will be unknown to the
user.
Do
not change the current window without informing the user. (No pop-ups!)
When a new page pops up, the screen reader will start to read it, and
the user may get confused.
When
using Frames, title each frame to help with frame navigation and identification,
describe the purpose of the frame, and how they relate to each other.
When
creating Forms follow these tips:
- All form fields should be labeled.
- Prompts should be carefully placed.
- Place titles in the input elements that identify the purpose of the control.
- When dealing with buttons, no textual prompt is required because text is already associated with the value attribute.
PowerPoint
presentations should be available in text only format. This can be
done by one of the following ways:
- After completion of your PowerPoint presentation, do a Save As -> Outline/RTF, which saves your presentation in rich text format for all to access.
- Copy the outline of our PowerPoint presentation and format it yourself into an accessible HTML page.
- Download and utilize the "Office Export Wizard". This tool creates accessible text only slides. To use it, simply click on the icon that says "Office Export Wizard" and follow the instructions provided. This tool is available for download at: http://www.rehab.uiuc.edu/office/
PDF
files should not be scanned in as whole images. In this case, Adobe
Acrobat Capture is the solution for scanning in documents so that the
text is recognized. Adobe Acrobat 6.0, a brand new release, has been
updated to contain more ways to make accessible PDF files. This new
release also has a built in screen reader to read PDF files aloud.
If you have an older version of Adobe Acrobat, you can download a PDF
screen reading plug-in from http://www.pdfaloud.com.
To learn more about creating accessible PDF files, go to http://www.adobe.com/products/acrobat/access_booklet.html.
Use
em./em instead of i./i for italicized font. EM means emphasized text.
Therefore, the screen reader will read it emphasized. In italics, the
screen reader will read it the same as all other text.
Use
strong./strong instead of b./b for bold font. The screen reader will
read text surrounded in strong tags louder than other text.
In
the case where you are not able to create an accessible web page at
all, provide a link to a page that uses W3C technologies, is accessible,
and updated as often as the main webpage. In other words, create a
text-only version of your website for those with disabilities.
The above checklist is a limited subset of guidelines to follow. We encourage the adopter to create accessible web pages and test them using one or more of the accessibility checkers.
Section 508
Checklist and Guidelines from WebAIM
