508 A Must


“Section 508 requires that when Federal agencies develop, procure, maintain, or use electronic and information technology, Federal employees with disabilities have access to and use of information and data that is comparable to the access and use by Federal employees who are not individuals with disabilities, unless an undue burden would be imposed on the agency. Section 508 also requires that individuals with disabilities, who are members of the public seeking information or services from a Federal agency, have access to and use of information and data that is comparable to that provided to the public who are not individuals with disabilities, unless an undue burden would be imposed on the agency.” from: www.section508.gov

UPDATE - There have been a number of lawsuites against companies whose websites were not Section 508 compliant one of the most prominant cases was The National Federation for the Blind vs Target.

Regardless of your client or expected user you should make sure that your project complies with Section 508 standards.

Section 508

Description

The following standards are excerpted from Section 508 of the Rehabilitation Act The information in the right two columns is not part of the official Section 508 document and is given as a guideline only
A method shall be provided that permits users to skip repetitive navigation links. Skip repetitive navagation links This provides users with assisted technology to skip the repetitive navigation links that appear at the top or side of the page and go straight to the content.

As this link is included only to be used by screen-readers it does not have to be visible.

One way to do this is to provide a blank image link.
Create a 1 pixel by 1 pixel gif with a transparent background.
Create an anchor on the page directly above your content.
anchor:
<a name=”skip” id="skip"></a>

Place the link directly under “body” (it needs to be in a div.
<a href=”#skip id="skip"”><img src=”blank.gif” width=”1″ height=”1″ border=”0″ alt=”skip navigation and go to content” /></a>

Documents shall be organized so they are readable without requiring an associated style sheet. Origanization of information within the code Place the information in the code in a logical sequence so that the information will make sense when read from top to bottom.

 

Style sheets can be used but the web page still needs to be understandable without the style sheet.

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.

Other content that is not accessible to users with disabilities

 

You are required to create a text-only version.

You are required to up-date this version whenever you update the main version

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 assisted technology.

scripts

All scripts (e.g. Javascript) are either directly accessible to assisted technologies and the keyboard or an alternative method of accessing equivalent functionality is provided (e.g. a standard link).

 

 

OR Information within the script is text based.

Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup.

Headings , titles, subheaders

 

Use Heading to show hierarchy.

Must use at least <h1> for the title of the page. Must use <h2> for the title of each paragraph section. Use other <h3> - <h6> when necessary

Use color only as decoration and not to emphasis a concept, point, etc or importance.

 

Use <strong> or <emphasis>

to make a point. But not for titles and subtitles.


This video demonstrates the importance of the correct use of headings for the blind or visually impaired user. This is a must see video for all web designers.

Row and column headers shall be identified for data tables. tables

Tables: Row headers have the identified using, the”th” tag

When electronic forms are designed to be completed online, the form shall allow people using assisted technology to access the information, field elements, and functionality required for completion and submission of the form, including all directions and cues. FORMS

All form elements must have text labels which are associated with them in the markup. : labels, id,

Frames shall be titled with text that facilitates frame identification and navigation. Frames

Give a title to each frame which describes its purpose and/or content

Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz.

Flicker, which can cause seizures

There cannot be any elements on the page that flicker at a rate of 2 to 55 cycles per second.
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. Image Maps

Client-side image maps are used and appropriate alt text is provided for the image as well as each hot spot region.

Redundant text links shall be provided for each active region of a server-side image map.

Server-side image map: You need to provide separate text links in addtion to the server side map. Cannot use client-side image map as the replacement.

A text equivalent for every non-text element shall be provided (e.g., via “alt”, “longdesc”, or in element content). Image Must include an “alt” tag with a description that conveys the content.

Flash

Video

Audio

Graphs

Charts

JavaApplet

A detailed text description needs to be included either in the body of the of the page or you need to include a link to a separate page that has a detailed description. Or longdesc, attributealt.

These are just some of the main points. We welcome any suggestions, tips etc, —


This page is only an introduction to Section 508 visit: http://www.section508.gov/index.cfm?fuseAction=stdsdoc for more information.

code

color

CSS

design

type

writing

info arch

the net

php

seo

user

usabilty


be inspired


my notes