web Accessibility

508 In Depth

This section takes a closer, more in-depth, look at the 508 compliance and CSU best practices.

Syntax validation

Contemporary, maintainable, accessible web design is based on complete separation of content (HTML/XHTML) from presentation (CSS). Page titles must be unique.

Semantic validation

Page elements that function as links (including text, images, and buttons) should be recognizable and usable by sighted viewers and assistive technology. Use section headings and sub-headings in their proper order. Opening a new browser window can be confusing. Best practice is to not open new windows.

Alternate Text - Checkpoint (a)

Screen readers can only convey information in a text format. This means that you must provide text alternatives for all non-text elements. This tutorial will focus mainly on images, since they are the most common type of non-text elements.

Multimedia Equivalents - Checkpoint (b)

Captioning allows your deaf users to understand multimedia content with audio. This guideline requires your text alternatives from Alternate Text to synchronize with the content.

Color - Checkpoint (c)

If you use color to present information, give your users another way to differentiate between your content. Vision impaired users will not be able to comprehend information with color.

Styles (CSS Style Sheets) and Headings (d)

If you use a CSS style sheet, your web site should be readable without the associated CSS file. The web site does not have to be visually appealing with style sheet turned off, but all the information must linearize correctly. Linearization is how your content is ordered with your style sheet turned off.

Server-Side Image Maps (e)

Image maps are images with clickable hot spots that act as links. Different links reside in different locations of the image. With server-side image maps, the server determines where in the image the user clicked on, and sends the user to the appropriate web page.

Client-Side Image Maps (f)

Image maps are images with clickable hot spots that act as links. Different links reside in different locations of the image. The browser sends users to different places depending on where users click. In order for a screen reader to tell users where each hot spot takes them, you should include alternate text for each hot spot.

Simple Tables (g)

Do not create row and column headers for layout tables. Section 508 standards recommend that you use CSS's absolute positioning to lay out web pages. However, making layout tables accessible is not hard.

Complex Tables (h)

In general, try to make data tables as simple as possible. This means keeping your table headers to one level. If you end up needing more than one level of headers, use the headers and the id attributes. By using these attributes, the screen reader now knows which headers correspond to which data cell.

Frames (i)

Cal Poly recommends that you avoid using frames. Frames sometimes give screen readers trouble, so refrain from using them when possible. If you must use frames, name the frames to inform users of the purpose they serve.

Screen Flickering (j)

Some animated GIFs, scripts, or flash animations make the screen flicker or change color rapidly. You must keep the flickering out of the 2Hz - 55Hz (Hz is a cycle per second) range. Use your best judgment as to how much flickering your web site has.

Provide Text Only Pages as a Last Resort (k)

You should only create a text only web site if you have attempted to make your normal web site compliant. Most content can be made accessible, and you should rarely consider making an alternative, text only Web site.

Scripts (l)

You should generally stay away from using scripts (most notably JavaScript) to generate important content. If you decide to do so, you should at the very least make the content accessible generated by the script.

Provide Links to Necessary Plug-Ins (m)

If you use content that needs a plug-in to be viewed, you must provide a link to the required plug-in.

Forms (n)

Different form elements need different kinds of markup to be accessible.

Skip Repetitive Navigation Links (o)

If your navigation links come before your main content of your web site, you will need to provide a way to skip these links.

Times Responses (p)

Web sites sometimes use this technique to reduce demands on servers or to keep web sites secure. A disabled person may need more time than normal to comprehend a web site fully. For example, banking institutions often log you off, due to inactivity, for security reasons.


A glossary with the most common terms in these guides.