County of Sonoma, California
Site Search

You are here:

Implementing Section 508

Below are the accessibility requirements for web pages as stated in Section 508 of Rehabilitation Act of 1973 (§ 1194.22). Implementation guidelines have been listed after each requirement.

See Additional Information for best practices and other helpful resources.

§ 1194.22 Web-based intranet and internet information and applications.

Non-text Elements and Images

(a) A text equivalent for every non-text element shall be provided (i.e., via "alt", "longdesc", or in element content).

County Implementation of Non-text Elements and Images

  • All images must have an alt attribute.

    The text for an alt attribute should:

    • Describe the content of the image:
      <img src="http://supervisors.sonoma-county.org/images/board_members.jpg" alt="Photo of Board of Supervisors Members" />
    • Convey the intended meaning of the image:

      <img src="App_Themes/SharedImages/banner_title.gif" alt="County of Sonoma, California" />

    Images used solely for visual decoration should use an empty alt attribute (2 consecutive double quotes): <img src="decoration.gif" alt="" />

  • Images that require a lengthy explanation (such as graphs and charts), which are not possible to accurately represent with an alt attribute, should use the longdesc attribute instead. The longdesc attribute contains a URL to a web page that fully explains the contents of the image. For example:

    <img src="budget_analysis_chart.gif" longdesc="budget_analysis.htm" />

    See Graphs and Charts for a more explanation.

Top ↑

Multimedia Presentations

(b) Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation.

County Implementation of Multimedia Presentations

  • All multimedia presentations must be closed captioned and transcript text must be synchronized with audio track.

Top ↑

Color Conveying Information

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

County Implementation of Color Conveying Information

  • Color is not the sole method used to convey important information.
  • Sufficient contrast is provided. Web Content Accessibility Guidelines 2.0 recommend a minimum contrast ratio threshold to be 7:1.

    See suggested tools for a list of tools compiled to assist in web development and validation.

Top ↑

Stylesheets Must Be Optional

(d) Documents shall be organized so they are readable without requiring an associated style sheet.

County Implementation of Stylesheets Must Be Optional

  • Web pages and documents will be understandable when style sheets are removed.
  • PDF documents will reflow properly with formatting is removed.
  • Use structural markup (<h1>, <p>, <ul>, etc.) to provide the proper layout for your document.

Top ↑

Server-side Image Maps

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

County Implementation of Server-side Image Maps

  • Client-side image maps must be used wherever possible.
  • If you cannot avoid using a Server-side image map: Anytime a visitor can select specific areas of a graphic for navigation, a text link must also be provided.

Top ↑

Client-side Image Maps Preferred

(f) 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.

County Implementation of Client-side Image Maps

  • Appropriate alternative text must be provided for:
    • The image
    • Each clickable “hot spot” region of the image map

Top ↑

Simple Tables

(g) Row and column headers shall be identified for data tables.

County Implementation of Simple Tables

Data Tables

  • Data tables must have column and row headers appropriately identified using the <th> tag.
    • Column Headers: <th scope="col">
    • Row Headers: <th scope="row">
  • The following should be used (when appropriate) to improve accessibility of <table> content for visitors that use screen reader software:
    • <caption> tag: Provide additional information about the table, usually used as a Title.
    • summary attribute: Summarize the table for screen readers; describe the primary purpose of the table and include a description of the table’s structure.

Non-Data Tables

The use of tables for layout purposes is highly discouraged; best practice is to use <div> tags and stylesheets instead.

If you must use a table for layout, the table must not have:

  • Column or Row Headers: <th>
  • <caption> tag
  • summary attribute

Top ↑

Complex Data Tables (Multiple Levels)

(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.

County Implementation of Complex Data Tables (Multiple Levels)

  • Complex data tables will be designed with underlying formatting for screen readers, so that they can be read aloud in a logical fashion. Table cells are associated with the appropriate headers using the id, headers, scope and/or axis attributes.

Top ↑

Frames

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

County Implementation of Frames

  • The use of frames in HTML page design is highly discouraged unless there is a compelling business need. If frames cannot be avoided: each frame must have a title that describes the frame’s purpose or content.

Top ↑

Flicker Rate

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

County Implementation of Flicker Rate

  • Web pages (including animated graphics on the page) must not flicker.

Top ↑

Text-only Alternatives

(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.

County Implementation of Text-only Alternatives

  • If a web page cannot be made accessible, then an alternative text-only page should be offered and kept in sync with the original.

Top ↑

Scripting Languages

(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.

County Implementation of Scripting Languages

  • If page content is produced through dynamic scripting, you must create a <noscript> tag that provides the same information.
  • JavaScript functionality (such as drop-down menus):
    • Must be directly accessible to assistive technologies and the keyboard, or
    • An alternative method of accessing equivalent functionality must be provided.

Top ↑

Plug-ins and Applets

(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).

County Implementation of Plug-ins and Applets

  • When a separate software program, Java applet or plug-in is required to deliver information, a link must be provided to a web page where the software can be downloaded.

    Most vendors have specific policy we are expected to follow when linking to their products. Adobe®´s requirements have already been incorporated in this example. For other products, please refer to the vendor´s site for specific permissions, trademark or terms of use policy.

  • If a link cannot be provided, either:
    • Make sure that the Java applets, scripts and plug-ins (including PDF files), and the content within them, are accessible to assistive technologies, or
    • Provide an alternative means of accessing equivalent content.

Top ↑

Online Forms

(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.

County Implementation of Online Forms

  • All form controls must have text labels associated with them in the markup:

    <label for="txtName">Enter Your Name:</label>
    <input type="text" id="txtName" name="txtName" />

  • Dynamic scripting of the form does not interfere with assistive technologies and is keyboard accessible.

Top ↑

Skip Navigation

(o) A method shall be provided that permits users to skip repetitive navigation links.

County Implementation of Skip Navigation

  • Pages shall be designed with "skip" navigation functionality to allow visitors to skip links or listen as desired.

Top ↑

Timed Responses

(p) When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required.

County Implementation of Timed Responses

  • When a page requires a timed response, it must allow the visitor to receive additional time to complete the task.

Top ↑

Additional Information

Best Practices

  • Validate your pages for HTML, CSS and Accessibility compliance using industry standard validators.
  • Place a Document Type Definition (DTD) line at the top of the page to identify which HTML standard the page is coded to. The DTD tells the browser how to render the page and prevents the page from rendering in "quirks mode."

County References

Federal References

W3C Recommendation

WebAIM References

Some content on this page is saved in an alternative format. To view these files, download the following free software.