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.