Developing Websites for Section 508
Section 508 refers to a series of standards that establish a minimum level of accessibility for various technologies. The US Federal government has developed these standards, originally as part of Rehabilitation Act of 1973. There is a specific sub-set of the Section 508 guidelines that is applicable to web-based information or applications. Most of these software specifications pertain to usability for people with vision impairments.
Many people with vision impairments rely on various assistive products to access computer-based information. The most common of these are screen readers, which translate what’s on a computer screen into automated audible output.
A common misconception is that the Section 508 standards prohibit the use of graphics or multimedia on websites. This is not the case. Rather, Section 508 standards seek to clearly specify how graphical and multimedia information may be conveyed to a visually impaired user.
Who has to comply?
Federal agencies are required to comply with Section 508 standards. They are also required to purchase accessible technology, so contractors, vendors and anyone receiving federal money should provide products and services in an accessible format. The Buy Accessible partnership exists to ensure that Federal dollars spent in the private sector are earmarked for the most accessible IT products and services.
Section 508 Website Development
David Summer is the author of the article Implementing Audio Captcha which includes a discussion of Section 508 compliance and was published in the January 2008 issue of Dr. Dobb’s magazine. The article also presents a practical example of Section 508 compliance in the form of an Audio Captcha.
David’s audio Captcha article has been sited by Day in Washington, a nationally syndicated disability policy blog, as being: “…clear, with sample text, and easy enough to follow that even a non-technie like me could understand it.”
Contact David Summer to find out how we can help you develop your website conform to Section 508 guidelines.
How to Comply with Accessibility Requirements defined by Section 508 Guidelines
The Federal government has long required that US Government websites be accessible to people with disabilities, however, these requirements were not specified in detail before the introduction of the Section 508 guidelines.
Section 508 defines 16 specific requirements to which Web sites must comply in order to meet government accessibility standards. Because these standards have been so well defined, it’s likely that Section 508 will eventually become the standard for Web accessibility for commercial websites.
Section 508 requirements can generally be satisfied by making additions to existing web pages, rather than altering existing structure of the pages.
Here are the 16 Section 508 guideline web requirements, a brief description of each and some implementation solutions.
1. Embedded Text: A text equivalent for every non-text element.
Problem: Some web pages present text embedded in a graphic or in a Flash based element. Screen readers, used by many people with visual impairments, are unable to speak text that is presented in this manner.
Solution: Include descriptive text alternatives for each object on the web page. These can often be included through the use of the HTML “alt” and “noscript” tags.
2. Multimedia: Equivalent alternatives for any multimedia presentation, synchronized with the presentation.
Problem: Video presentations may not be viewable by people with visual impairments.
Solution: The ideal solution is to provide audio that is synchronized to the video presentation. In some cases this can be achieved through the use of SMIL document. Unfortunately, Flash, the leading multimedia presentation mechanism does not support this. An alternative solution is to provide a separate audio file of text document that fully describes the video presentation.
3. Color Blindness: Web pages shall be designed so that all information conveyed with color is also available without color.
Problem: Color coding is sometimes used as an aid to navigation or as a way to provide visual cues on a webpage. There are several different kinds of color blindness and people who have one or more if these may not be able to navigate your page or enter required information that is designated solely by color coding.
Solution: Provide a text alternative to any color coding. For example, if you have a form with the required fields are colored red, label them “Required” as well. There is handy Color blind web filter you can use to test compliance with this requirement.
4. Style sheets: Documents shall be organized so they are readable without requiring an associated style sheet.
Problem: Style sheets, in conjunction with DHTML, are often are used to hide, show or reposition text. Style sheets may not be readable with older browsers, often used by people with vision impairments because of their compatibility with some screen readers.
Solution: Be sure that any style markings don’t remove or obscure the meaning of any text on the webpage. This is a requirement that should change soon with the evolution of browser and screen reading technology.
5. Server side image maps: Redundant text links shall be provided for each active region of a server-side image map.
Problem: Server side image maps will make no sense to a screen reader.
Solution: This is really no longer a problem as virtually all image maps are now implemented on the client side.
6. Client-side image maps: 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.
Problem: This is similar to the previous guideline, specifying the difficulties of making sense of a server side image map by a screen reader.
Solution: With a client side image map, each hot spot on the image map can have its own “alt” attribute, enabling the screen reader to explain each spot.
7. Data tables: Row and column headers shall be identified for data tables.
Problem: Visually impaired people rely on screen readers to speak the row and column labels associated with each table cell. If these are not labeled, screen readers can become “confused”, presenting a mishmash of information to the user.
Solution: Label the rows and columns of each table using the “th” “colgroup” and “caption” HTML table tags.
8. Table levels: 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.
Problem: Rows or columns that span multiple cells can “confuse” screen readers if they are not properly labeled.
Solution: Make sure that any tables with cells that span 2 or more rows or columns (“rowspan” and “colspan”) are properly labeled.
9. Frames: Frames shall be titled with text that facilitates frame identification and navigation.
Problem: Screen readers should be able to tell the user the purpose of each frame.
Solution: Label each frame with a meaningful title. Better yet, don’t use frames.
10. Screen flicker: Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz.
Problem: Some flickering images can cause epileptic seizures.
Solution: It’s really impossible to determine if your animated images fall within the problem image flickering range. In order to try to meet this guideline, some government agencies have put a ban on all animated gifs. An alternative is to keep any of these images far at the bottom of a page and to warn the user right away of their presence.
11. Text only alternative: A text-only page, with equivalent information or functionality, shall be provided to make a web site comply with the provisions of this part, when compliance cannot be accomplished in any other way. The content of the text-only page shall be updated whenever the primary page changes.
Problem: This is really only a last resort alternative for people who feel they can’t make their pages meet the Section 508 guidelines. This page must be kept in sync with the partner page, presenting a maintenance nightmare on a website that has frequent updates.
Solution: The obvious solution here is to make your pages conform to the Section 508 guidelines so you have no need for these text only pages.
12. Scripts: 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.
Problem: Screen readers can not make sense of client side scripting elements.
Solution: Use descriptive text in your “noscript” elements. Make all DHTML created drop down menus or navigational items accessible by both mouse and keyboard.
13. Applets and Plugins: When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l).
Problem: Some pages have content that requires a browser plugin.
Solution: Always provide a link to required plug-ins including QuickTime, Adobe Acrobat, Real Media Player, Windows Media Player, etc. For Flash, include a link to the plug-in and a script to test for the right version of Flash. As sited in guideline B (Multimedia) you also need to present alternatives to visual media.
14. Forms: 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.
Problem: Screen readers need to be able to correctly interpret the labels on form elements.
Solution: Use “label”, “optgroup”, “legend” and “id” to describe the form fields. Take care to position form labels near the input elements.
15. Navigation links: A method shall be provided that permits users to skip repetitive navigation links.
Problem: Screen readers start at the top of the page and that’s where the navigation links are usually placed. Users may want to skip these and go right to the content of the page.
Solution: Provide a link that will take the user directly to the page content.
16. Timed response: When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required.
Problem: The speed of the disabled user’s interaction with a webpage is often slower than that of people without disabilities, usually as a result of using the screen reader. If the page contains a form requiring a timed response, this can create a problem.
Solution: Allow the user to change the timeout time or to skip the operation all together.
Contact David Summer to find out how we can help you develop your website conform to Section 508 guidelines.