Building Electronic Curbcuts on the Web.

Unusual things happen when products are designed to be accessible to people with disabilities. It wasn't long after sidewalks were redesigned to accommodate wheelchair users that the benefits of curb cuts began to be realized by everyone. People pushing strollers, riding on skateboards, using roller-blades, riding bicycles and pushing shopping carts soon began to enjoy the benefits of curb cuts! These facts are a prime example of why sidewalks with curb cuts are simply better sidewalks.
Steve Jacobs, Director, Association of Access Engineering Specialists.

• Americans with Disabilities Act of 1990 (ADA) and the Internet.
• University Case Findings
• Section 508 1998 amendment to the Workforce Rehabilitation Act of 1973
• Requires that electronic and information technology that is developed or purchased by the Federal Government be accessible to federal employees with disabilities.
• Required that members of the public who have disabilities must be able to gain access to the information or services offered by federal agency. This includes information on federal Web sites.

[2]

General Guidelines.

In simple terms, six key concepts to developing accessible Web pages

1. Create HTML and CSS pages that conform and validate to existing standards. [W3C Validation Service] [HTML-Kit and Tidy]
2. Use HTML to convey meaning and place the layout and presentation in cascading style sheets. [TopStyle] [HTML Validator]
3. Provide for keyboard-only (or voice) navigation and easy design-based orientation.
4. Use HTML features to provide information about the purpose and function of elements (alt & title attributes, table elements).
5. Provide alternative methods to access information in scripts, applets, and multimedia.
6. Be wary of common pitfalls that can reduce the accessibility of your site.
   • ASCII art
   • Blinking text and marquees
   • Link names that don't make sense out of context
   • Links that aren't separated by printable characters

[3]

W3C WAI Quick Tips.

• Images & animations. Use the alt attribute to describe the function of each visual.
• Image maps. Use the client-side map and text for hotspots.
• Multimedia. Provide captioning and transcripts of audio, and descriptions of video.
• Hypertext links. Use text that makes sense when read out of context. For example, avoid "click here."
• Page organization. Use headings, lists, and consistent structure. Use CSS for layout and style where possible.
• Graphs & charts. Summarize or use the longdesc attribute.
• Scripts, applets, & plug-ins. Provide alternative content in case active features are inaccessible or unsupported.
• Frames. Use the noframes element and meaningful titles.
• Tables. Make line-by-line reading sensible. Summarize.
• Check your work. Validate. Use tools, checklist, and guidelines at http://www.w3.org/TR/WCAG

[4]

Web Content Accessibility Guidelines 1.0.

1. Provide equivalent alternatives to auditory and visual content. | Examples | Hands-on Activity |
2. Don't rely on color alone.
3. Use markup and style sheets and do so properly.
4. Clarify natural language usage.
5. Create tables that transform gracefully. | | Hands-on Activity |
6. Ensure that pages featuring new technologies transform gracefully.
7. Ensure user control of time-sensitive content changes.
8. Ensure direct accessibility of embedded user interfaces.
9. Design for device-independence.
10. Use interim solutions.
11. Use W3C technologies and guidelines.
12. Provide context and orientation information.
13. Provide clear navigation mechanisms.
14. Ensure that documents are clear and simple.

Curriculum [5] Techniques [6] WebAim [7]

Section 508 Standards.

1. (a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content).
2. (b) Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation.
3. (c) Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup.
4. (d) Documents shall be organized so they are readable without requiring an associated style sheet.
5. (e) Redundant text links shall be provided for each active region of a server-side image map.
6. (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.
7. (g) Row and column headers shall be identified for data tables.
8. (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.
9. (i) Frames shall be titled with text that facilitates frame identification and navigation.
10. (j) Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz.
11. (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.
12. (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.
13. (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).
14. (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.
15. (o) A method shall be provided that permits users to skip repetitive navigation links.
16. (p) When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required.

Section 508 standards based on the work of W3C WAI

New Accessibility Features in HTML.

• W3C has deprecated many of the HTML tags and attributes that function as visual layout tools, advising that style sheets be used for this purpose instead.
• Providing alternative text for visual content
• the "alt" attributes are required with <img> and <area> elements.
• the new "title" attribute gives a short description (tool-tip) for an image.
• the new "longdesc" attribute (or d-links) designates an external document that gives a long description of an image.
• the new <caption> element and "summary" attribute (with the table element) describe a table's purpose.
• the new <abbr> and <acronym> elements and <lang> provide instructions to screen readers for speaking Web pages.
• the new <object> element (for including images, applets, or any type of object) allows for specifying alternate content
• Providing easier navigation
• Use the "title" attributes with <a> to provide an alternative text as to where the anchor links to.
• Use the "accesskey" attribute to allow users to activate links or form controls from the keyboard.
• Use the "tabindex" attribute to allow users to use the keyboard to navigate the links or form controls on a page in a logical sequence.
• Tables
• Use structural markup with tables <caption>, <thead>, <tbody>, <tfoot>, <colgroup>, and <col> to allow selective browsing and speaking of tables

[8]

Accessibility Features in Cascading Style Sheets.

• By moving the style and formatting instructions into CSS, you simplify and clean up the HTML in documents, making the documents more accessible at the same time.
• Provides an alternative to using tables for layout
• Provides an alternative to using <blockquote> for indentation
• Allows uses with special needs to override author styles

[9] [10]

Bobby Trainer.

• Demonstration with Computer Science Home Page.
• Hands-on Activity: Use Bobby Trainer to walk-through one of your pages for accessibility evaluation. You may save the results to the u:\ drive.

Implementing Accessibility at the University.

• Accessibility Organization
• Raise Awareness
• Training
• Knowledge Base
• Feedback and QA
• Accessibility Champion
• An ad hoc approach is not sufficient
• Web Accessibility Policy
• CWU Library Web Administration Policy
• Implementation Strategy

[11]

References.

1. W3C Web Accessibility Initiative (WAI). Available at http://www.W3.org/WAI/
2. Jacobs, S. Fueling the Creation of New Electronic Curbcuts. Available at http://www.accessiblesociety.org/topics/technology/eleccurbcut.htm
3. Bartlett, K. (1998) Six Principles of Accessible Web Design. Available at http://www.hwg.org/resources/accessibility/sixprinciples.html
4. W3C WAI Quick Tips Reference Card Available at http://www.w3.org/WAI/References/QuickTips/
5. Letourneau, C & Freed, G. Guidelines: WAI Web Content Accessibility Curriculum, Available at http://www.w3.org/WAI/wcag-curric/overgid.htm
6. W3C (2000) Techniques for Web Content Accessibility Guidelines 1.0, Available at http://www.w3.org/TR/WAI-WEBCONTENT-TECHS/
7. Allen, C and Isom, J Creating Pages that Conform to WCAG 1.0. Available at http://www.webaim.org/tutorials/
8. W3C WAI (2000) WAI Resource: HTML 4.0 Accessibility Improvements Available at http://www.w3.org/WAI/References/HTML4-access
9. W3C (1999) Accessibility Features of CSS available at http://www.w3.org/TR/CSS-access
10. W3C (2000) CSS Techniques for Web Content Accessibility Guidelines 1.0 Available at http://www.w3.org/TR/WCAG10-CSS-TECHS/
11. Thatcher, J. et al. (2002) Construction Accessible Web Sites, Glasshaus, information available at http://www.webaim.org/news/2002/books/glasshaus