Section 508 requirements for Federal Website Design Jon

Section 508 requirements for Federal Website Design Jon Brundage Jonwind@windcompany. com MDCFUG www. cfug-md. org 4/10/01

What is it? zaccessibility standards for electronic and information technology as applied to Internet and Intranet websites z 16 standards z. Under the law, all Federal websites must comply by June 21, 2001.

The first 8 paragraphs:

The 2 nd 8 paragraphs:

Dealing with Paragraph a "A text equivalent for every non-text element shall be provided (e. g. , via "alt", "longdesc", or in element content). " • For existing sites, Studio “extend find” will help you locate image tags. • In Dreamweaver/Ultra. Dev 4, create a site map. Open the Site window, click “Reports…(Site menu) and check “missing ALT text” under the HTML reports folder. • For stored images drawn from your data source, store alt text with the image: <img src=“#image_path#”alt=“#image_description#”>

Dealing with paragraph b "Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation. " z. Provide a text transcript of any audio presentation and a link to the text file z. Real. Audio and other streaming media are coming out with captioning.

Dealing with paragraph c "Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup. " z. Design your pages so that navigation does not depend on identifying specific colors z. There are websites that check your page’s use of colors: z http: //www. vischeck. com z http: //labs. bt. com/people/rigdense/colours/ z. Keep in mind that many visitors are color blind!

Dealing with paragraph d "Documents shall be organized so they are readable without requiring an associated style sheet. " z. Instead of using a style sheet, set the page attributes in an application. cfm page. z. Style sheets can still be used, but the page must still be able to be viewed clearly if the style sheet is missing.

Dealing with paragraph e "Redundant text links shall be provided for each active region of a server-side image map. " z. Use client-side image maps (see paragraph f) zserver side image maps were used before the advent of newer browsers, and if you must use one provide an alternate text link.

"Client-side image maps shall be provided instead of Dealing with paragraph f server-side image maps except where the regions cannot be defined with an available geometric shape. " z. Similar to paragraph a, provide “alt” text description with areas of image maps.

Dealing with paragraph g "Row and column headers shall be identified for data tables. " z. Use the CAPTION element and the SUMMARY attribute <TABLE summary=“This table displays the model type and count of each auto in stock. ”> z. Use the THEAD and HEADER CELL ID attributes z. This link gives an explanation of table design for non-visual rendering: http: //www. w 3. org/TR/html 4/struct/tables. html#non-visual-rendering

Dealing with paragraph h "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. " z(same solutions as paragraph g)

Dealing with paragraph i "Frames shall be titled with text that facilitates frame identification and navigation. " z EXAMPLE: <FRAMESET COLS="20%, *"><FRAME NAME="Menu area, this frame does not change throughout this site. " SRC="menu. htm"><FRAME NAME="Main page, the requested content appears in this frame. " RC="mainpage. htm"> </FRAMESET> z Note that the long description will make your links to the target frame lengthy ; <A href=“form. cfm” target=“Main page, the requested content appears in this frame. ”> z The Board that set the Section 508 requirements doesn’t like frames! z Use of tables can create a page layout that looks like a framed page when it is in fact a non-frame page. Use <CFINCLUDE> as a tool to aid you.

Dealing with paragraph j "Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz. " z. NO BLINKING TEXT z. Use caution with FLASH movies z. Marquee text areas cannot be interpreted by screen readers.

Dealing with paragraph k "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. " z. The main point is that text alternatives must be kept current with your regular pages.

Dealing with paragraph L "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. " z. Use a <NOSCRIPT> tag after the script code: z <NOSCRIPT>"This element requires that javascript is enabled in order to function correctly. It displays the date this page was last updated. No further information is provided. "</NOSCRIPT>

Dealing with paragraph m "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). " z. Provide a full explanation of the type of plug-in, and a link to the download page where the user may obtain the plug-in: z“Download the registration form here in Adobe Acrobat (. pdf) format. If you need the free Acrobat reader, go here to download. ”

Dealing with paragraph n "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. " z. If you look at the detailed description of this requirement in the VBA site pages, you will notice that the standard is a bit “fuzzy”! What the board wants is to ensure that any form layout can be interpreted by assistive technologies.

Dealing with paragraph 0 "A method shall be provided that permits users to skip repetitive navigation links. " z. Add a tag just after the <BODY> tag that jumps to an anchor at the beginning of your page’s content: z <a href="#content">Skip to content</a>

Dealing with paragraph p "When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required. " z. This is another requirement that the Board is “fuzzy” on. Their website does not have an example. Possible solutions include coding form pages with a <CFLOCATION> tag to direct visitors to a warning page if they are about to time out, or a javascript to display an alert message.

Conclusion The Federal Government has recognized the need for greater access to websites by people with disabilities. As web developers it is our responsibility to reach the widest audience possible by designing pages that can be used by visitors with disabilities. This is not only the “right thing to do” but is in our own interests because we are in the business of communicating with as many people as possible.

Links z z z http: //www. advancedperipheral. com/ http: //www. tni. be/english/e_products. html http: //www. resna. org/ http: //www. 4 access. com/ http: //www. section 508. gov/index. html http: //www. w 3. org/TR/html 4/struct/tables. html#non-visual-rendering