Coding: Formative Evaluation: Accessibility
Making your website accessible is an important part of web development.
Basics for Accessibility
Title. Be sure to include a title in the head section of the document.
Text. For text, use style sheets and class names that are descriptive. Add voice families for listeners.
The easiest way to get started is by making sure you have included alternative text for all visual and auditory elements of your page such as images, links, tables, videos, and sounds.
Images. For images, use alternative text.
<img src="woods.jpg" alt="This photograph shows an old-growth cedar forest in the northern Cascades." />
Tables. For tables, use a table summary and caption.
<table summary="This table compares the television viewing habits of teenage males and females." >
Avoid frames and complex layouts that would be difficult for web assistants to interpret.
Considerations in Text-Only Versions
Needs
- Meet special needs associated with visual and auditory challenges
- Provide alternative presentation method to address roll-over and other technical issues
- Incorporate option for printing
Basic Elements of Text-Only
- Equivalent alternatives to auditory and visual content
- Convey information without color
- Remove formatting such as tables
- Provide alternatives to interactive activities (i.e., roll-overs, pop-ups)
- Provide context and orientation information & clear navigation mechanisms
Suggested Format
[This page contains the text of the entire first module titled Module A: Overview. This module contains 16 numbered screens.][Start Screen A-1 of 16]
What is Outcomes Based Evaluation?
Your work in a library or museum makes a difference in the life of visitors. What is the best way to demonstrate that difference?
[End Screen A-1 of 16]
Test for Web Accessibility
When you think you've made your website web accessible, it's time to check with WebXACT from Watchfire to see if your page is really compliance with current guidelines. It is an automatic verifier of web site accessibility designed to expose possible barriers to website use by those with disabilities. WebXACT checks your web page to determine how well it addresses Section 508 of the US Rehabilitation Act and W3C's Web Content Accessibility Guidelines (WCAG). It will check one page at a time and provide feedback. Your job is not to address everything, but to be aware of barriers to accessibility.
Running the Test
Go to the WebXACT website. Enter your URL.
Click the Show Advanced / Accessibility Options button below the URL area.
Click Section 508.
Then check your URL by pressing Go!
Using the guidelines established by the World Wide Web Consortium's (W3C) Web Access Initiative (WAI) and the Section 508 guidelines from the Architectural and Transportation Barriers Compliance Board (Access Board) of the U.S. Federal Government, WebXACT will test your web pages.
Examining the Results
When you get your WebXACT results, you'll want to go back and make changes that might increase the accessibility of your pages. Unless you're a government agency, you don't have to make all the recommended changes. However you should be aware that if your pages aren't WebXACT compliant, some people may not be able to use your site.
WebXACT provides feedback in four areas: general, quality, accessibility, and privacy. For our purposes, the most important section is under the Accessibility tab.
You need to make changes so that 0 errors occur. It's okay if you have a few warnings, as long as you're aware of the issue.
In the example below, the page contains 1 error and 5 warnings. By clicking on the blue linked information about the LABEL element, I learn that I need to add the LABEL element to clearly identify by FORM.
Your page doesn't need to be perfect. However, it should at least meet the Section 508 Accessibility requirements. If you are approved, use the 508 icon at the bottom of your page.
In the example below, the page contains 0 errors and 3 warnings. This page is acceptable.
The system does not automatically create an icon like the HTML or CSS validation. However you are free to add the WebXACT icon and logo to your page if you wish.
Note: If you get a message saying that the system is busy, just try again later.
Try It
Conduct a WebXACT validation on your practice page. For help in interpreting the results, go to the Documentation page. How can you improve your web authoring to be more accessible?