Web accessibility considerations are often put on the backburner to cust costs or speed up project delivery. Sometime web designers choose to ignore web accessibility because of a narrow focus on a certain visitor demographic. However, both of these practices can cost dearly in long run.
Every web design project should have a web accessibility checklist and it should be put near the top of the priority list of items to implement.
So what exactly is a web accessibility checklist and what should be on this list?
Web accessibility list is a common sense design practice. If you’re building an office, you’ll consider handicap accessibility options and final design should incorporate these design elements. Web accessibility is the online flavor that represent these design elements. Web accessibility is also important if you want to improve the user experience and usability of your online website.
While web accessibility checklist can be thoroughly detailed and exhaustive, here is a brief and consise summary of common design practices.
1. All images and animations must have an ALT description:
This is just common sense. The Alt attribute describes the purpose of the graphic element. An empty or null alt attribute (alt =”") can also seperate decorative images from the images that convey some information. This can help in separating content from presentation layer is a good design process.
2. Using longdesc attribute to describe content in detail:There is a good reason it is called longdesc. Most of the time designers tend to get lazy and use alt tag instead. However, longdesc should be used to describe content on detail and link to text files that may contain additional details.
Example :
<img src="/images/population_growth.gif" longdesc="/documents/population.txt"/>
3. Color Considerations:
Sometime we use color to convey certain information. Remember, color definition can change from one plateform to another(example: Windows based PC to Macintosh).
Also, there are people who are color blind. As a good design practice all information conveyed with color should be available if color is removed.
4. Text and Graphics Links:
Links need to make sense and should avoid a guessing game. For example, “click here to download our Brochure” is far more useful than “Click here”.
5. List elements:
Make sure list elements are created using
instead of background images. It is important to separate design from content as well as avoiding unneccesary data that a user will have to download to consume a list designed with images.
6. Use the latest W3C guidelines:
For example, use
for bold instead of
and
for italics instead of
7. If you must use image maps, please make sure you have alt descriptions and redundant text links.
8. Any presentation elements; such as color, font, typeface, object positioning must be controlled by Cascading Style Sheets (CSS).
9. If you use forms on your website, make sure forms use
<input type="text" name="firstname" id="firstname" taborder="1"/>
10. If tables are used for layout, they must be linearize correctly.
11. If using tables for data, make sure header cells are labeled with
a summary attribute in the
element to provide description of what
the data is.
Example:
12. A document type declaration (DOCTYPE) is the 1st line of the document (HTML 4.01 Transitional or XHTML) and the lang=”en” or another language tag is declared.
13. Event handlers must have another event trigger (mouse and keyboard)
Example:
onMouseover and onFocus
onMouseout and onBlur
14. Don’t get too fancy. do not use blinking or flickering content.
15. Make sure no deprecated HTML code is present.







