Section 508 and NASA Session 3: Web-based Intranet and Internet Information and Applications Presentation to Ames Research Center November 2011 Antonio HaileSelassie What Is Section 508? In 1998, Congress amended the Rehabilitation Act of 1973 to include Section 508, which provides people with disabilities opportunities to gain meaningful employment with the Federal government and to reflect the focus on technology.
NASA Section 508 Policy NPR 2800.2 2 Web Standards Web-based Intranet and Internet Information and Applications (1194.22) Web pages (HTML) Electronic Documents Social Networking Multimedia File Sharing Web 2.0, AJAX, etc. 3 Non-Text Elements
(a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content). Every image, Java applet, Flash file, video file, audio file, plug-in, etc. has an alternate description, transcript, or other textual equivalent. Complex graphics (graphs, charts, etc.) are accompanied by detailed text descriptions. The alternate descriptions succinctly describe the purpose of the objects, without being too verbose (for simple objects) or too vague (for complex objects). Alt descriptions for images used as links are descriptive of the link destination. Decorative graphics with no other function have empty alt descriptions (alt= ""), but they never have missing alt descriptions. 4
FAQ: Non-Text Elements How much information actually needs to be in the text equivalent? The text information associated with a non-text element should, when possible, communicate the same information as its associated element. For example, when an image indicates an action, the action must be described in the text. The types of non-text elements requiring actual text descriptions are limited to those elements that provide information required for comprehension of content or those used to facilitate navigation. Web page authors often utilize transparent graphics for spacing. Adding a text description to these elements will produce unnecessary clutter for users of screen readers. For such graphics, an empty ALT attribute is useful. 5
Multimedia on the Web (b) Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation. Multimedia files have synchronized captions. Captioning for the audio portion and audio description of visual information of multimedia presentations are considered equivalent alternatives. 6 FAQ: Multimedia on the Web If a Federal agency official delivers a live audio and video webcast speech, does it need to be captioned? Yes, this would qualify as a multimedia presentation and would require the speech to be captioned.
If a website offers audio files with no video, do they have to be captioned? No, because it is not multimedia. However, since audio is a nontext element, a text equivalent, such as a transcript, must be available. Similarly, a (silent) web slide show presentation does not need to have an audio description accompanying it, but does require text alternatives to be associated with the graphics. 7 FAQ: Multimedia on the Web Does video with a countdown, background noise or conversation, or other non-essential audio need to be captioned? Captioning and audio descriptions are only required to be provided when important to understand the audio or visual components of a video or multimedia production. That is, even if a production "supports the agencys
mission," only those audio portions that are necessary for the comprehension of the productions content need to be captioned. Ex: A videotaped lecture would need to capture the lecturers words in captions if it is intended to be used for future training, but the captions need not also relate that students chairs were squeaking or that the door at the back of the room was closing loudly as people exited. Similarly, only those visual portions that are necessary for the comprehension of the productions content need to be audio described. Ex: A videotaped lecture would need to include an audio description of graphics the lecturer draws on a chalkboard to illustrate a point, but would not need to include an audio description of the strictly verbal or "talking heads" portion of the lecture. 8 Color (c) Web pages shall be designed so that all information conveyed with color is also available without color, for
example from context or markup. If color is used to convey important information, an alternative indicator is used, such as an asterisk (*) or other symbol. Textual alternatives exist. Contrast is appropriate. 9 Readability (d) Documents shall be organized so they are readable without requiring an associated style sheet. Style sheets may be used for color, indentation and other presentation effects, but the document is still understandable (even if less visually appealing) when the style sheet is turned off. Non-HTML web-based documents (i.e. .pdf, .doc, etc.) are presented in an organized readable format.
10 Image Maps (e) Redundant text links shall be provided for each active region of a server-side image map. Separate text links are provided outside of the serverside image map to access the same content that the image map hot spots access. (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.
Standard HTML client-side image maps are used, and appropriate alt text is provided for the image as well as the hot spots 11 Data Tables (g) Row and column headers shall be identified for data tables. Data tables have the column and row headers appropriately identified (using the
(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. Table cells are associated with the appropriate headers (e.g. with the id, headers, scope and/or axis HTML attributes). 12 Frames and Flicker (i) Frames shall be titled with text that facilitates frame identification and navigation. Each frame is given a title that helps the user understand the
frame's purpose Each page is titled using
compliance cannot be accomplished in any other way. The content of the text-only page shall be updated whenever the primary page changes. A text-only version is created only when there is no other way to make the content accessible, or when it offers significant advantages over the "main" version for certain disability types. The text-only version is up-to-date with the "main" version. The text-only version provides the functionality equivalent to that of the "main" version. An alternative is provided for components (e.g. plug-ins, scripts) that are not directly accessible.
through (l). A link is provided to a disability-accessible page where the plug-in can be downloaded. All Java applets, scripts and plug-ins (including Acrobat PDF files and PowerPoint files, etc.) and the content within them are accessible to assistive technologies, or else an alternative means of accessing equivalent content is provided. 17 Electronic 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. All form controls have text labels adjacent to them. Form elements have labels associated with them in the markup (i.e. the id and for, HTML elements). Dynamic HTML scripting of the form does not interfere with assistive technologies 18 FAQ: Electronic Forms
How can developers provide accessible HTML forms? The first rule of thumb is to place labels adjacent to input fields, not in separate cells of a table, for example. For the web developer who does not wish to place form elements immediately adjacent to their corresponding titles, the HTML 4.0 specification includes the
A link is provided to skip over lists of navigational menus or other lengthy lists of links. (p) When a timed response is required, the user shall be alerted and given sufficient time to indicate more time is required. The user is alerted that a timed response is required The user is provided a means to extended the time if needed. Includes security timeouts 20 Demonstration: Quick Review
Of Websites for Compliance Tools Needed: WebAims WAVE Toolbar for Firefox Firebug for Firefox 21 Resources General and NASA-specific information and resources: http://www.section508.nasa.gov NASA virtual Section 508 help desk firstname.lastname@example.org
Available to NASA employees and contractors GSA site:www.section508.gov Access Board : http://www.access-board.gov/508.htm YouTube captioning tutorial: http://www.google.com/support/youtube/bin/answer.py? answer=100077 Firebug for Firefox: http://getfirebug.com/ Wave Toolbar for Firefox: http://wave.webaim.org/toolbar 22 Questions? 23