1 accessibility 101 dr. john slatin, director accessibility institute university of texas at austin
TRANSCRIPT
2
ObjectivesParticipants will learn: A working definition of accessibility Accessibility guidelines and standards,
including Section 508 federal standards Specific techniques for improving Web
accessibility Specific things to avoid Tools and resources for testing
accessibility
3
Points to take away
Good design is accessible design The goal is to support full participation
in learning for all Separate is not equal: text-only is a last
resort Accessibility is good for learners and for
you
4
Benefits to learners
Instructional resources are accessible to learners and faculty with disabilities
Instructional resources are better suited to multiple learning styles and multiple intelligences
Improved design makes instructional resources more engaging and effective for all participants
5
JAWS Demo
Screen reader
Reads top to bottom, left to right
Reads on screen text; also parses HTML
source, and for some applications relies on
MS Active Accessibility API
Demo at www.freedomscientific.com
6
What is accessibility?
Accessibility is not “in” the Web page
Accessibility is experiential: User is able to
use data, information, and services as
effectively as someone without a disability
Accessibility is environmental: it depends on
the interaction of the page with browsers,
assistive technologies--and people
8
Some working numbers
54,000,000 Americans have disabilities 1 in 5 (1 in 2 for people over 65)
5.9 million children with disabilities in U.S. schools (462,000 in Texas)
Only 428,000 in all higher ed (1998-99)
9
Accessibility in law and policy
Section 504 of the Rehabilitation Act of 1973
Americans with Disabilities Act (1990) Section 508 of the Rehabilitation Act
(rev. 1998)
10
Section 504 and Section 508
Section 504 of the Rehab. Act (1973): all programs and activities of educational
institutions receiving federal funds must be accessible to otherwise-qualified individuals with disabilities
Complying with Section 508 accessibility standards is best way to meet 504 requirements where IT is concerned
11
Section 508 Web Standards
16 specific provisions, (a) – (p)
Effective date: June 21, 2001
We’ll concentrate on the most important
provisions of Section 508
12
508 Standards in 3 Categories
Every page accessibility (3 provisions) Apply to virtually every Web page We’ll add a few more
Accessible technologies (9 provisions) Appear on specific pages for specific
purposes Precautions/things to avoid (4
provisions)
13
Every Page Accessibility
Text equivalents (a) Skip navigation (o) Cascading Style Sheets (d) Plus…
Relative sizes for fonts, etc. Clear, informative link text
14
Alt Text: Provision
(a) A text equivalent for every non-text element shall be provided(e.g., via alt, longdesc, or in element content)
The issue: Imagine listening to all pages or using a browser that shows only text. Without text equivalents (alt text), people using these would be lost.
15
Alt Text Requirements
Every image element must have an alt attribute
Images that don’t convey meaning should have empty alt attributes (alt=“”)
Image links must have meaningful alt text
Graphical buttons and image map hotspots also need meaningful alt
16
Alt Text Examples & No-Nos
Accessibility Institute How-Tos and Demos at
http://www.utexas.edu/research/accessibility/resource/how_to/index.html
17
Alt Text Exercise
What should the alt text be for the following: A blue arrow that links to the next page; A blue arrow repeated around the borders
of a page Thumbnail photo of of blind woman that
links to home page from every page on site about blindness
Same image linked to information about the woman In the photo
18
Skip Navigation Links
(o) A method shall be provided that permits users to skip repeated navigation links.
The issue: Because screen readers read left to right and top to bottom, users often have to listen to all navigation links before getting to the main content on every page.
20
Style Sheets
(d) Documents shall be organized so they are readable without requiring an associated style sheet.
The issue: Style sheets are best for Web layout. But the visual order can be different from the order for reading aloud, so authors must take care to preserve readability.
21
Style Sheet Essentials
Style sheets are an asset to accessibility but are ignored by ssistive technology (screen readers, etc..). So: Don’t use style sheets to convey essential
information! Pages shouldn’t depend onstyle sheets for
content Be careful with color and positioning Check pages with style sheets turned off
22
Accessible Technologies
Forms (n) Tables (g, h) Multimedia (b) Applets and plug-ins/media players (m) Image Maps (e, f) Scripts (l) Frames (i)
23
Data Tables: Provisions
(g) Row and column headers shall be identified for data tables.
(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.
Issue: Tables are meant for the eye, not the ear
24
Table Examples: Simple Table
Identifying row and column headers http://www.utexas.edu/research/accessi
bility/resource/how_to/table/headers/headers.html
25
Table Example: Complex Table
Associating data cells and header cells http://www.utexas.edu/research/accessi
bility/resource/how_to/table/complex/complex.html
26
Forms: The Provision
When electronic forms are designed to be completed online, the form shall allow people using assistive technologies to access the information, field elements, and and functionality required for completion and submission of the form, including all directions and cues.
27
Forms: The Issue
“”What am I supposed to do here?” People using screen reders and other assistive technology need to know what information is required, what’s optional, and what choices are available.
28
Form Requirements: Position Prompts
Position prompts immediately adjacent to form controls: To the left of text boxes and select
menus To the right of radio buttons and
checkboxes
29
Form Requirements: Associate Prompts with Controls
Use the <label> element to associate prompts with form controls (<input>, <select>, <textarea>, etc.)
Use the title attribute if there isn’t room for a <label> on the screen
Use <fieldset> and <legend> to associate groups of radio buttons with questions/prompts
30
Form Examples
Bad form Labeling input fields with <label> Labeling input fields with the title attribute Radio buttons using <fieldset>, <legend>,
and <label> http://www.utexas.edu/research/
accessibility/resource/how_to/index.html
31
Multimedia: The Provision
(b) Equivalent alternatives for any multimedia presentation shall be synchronized with the presentation.
The issue: people with impaired hearing can’t follow soundtrack; people with impaired vision can’t follow video track
32
Transcripts, captions, and descriptions
Transcripts and captions benefit people who… Can’t hear the soundtrack Aren’t native speakers Are learning to read or have reading
difficulties Audio description benefits people who
can’t see the video
33
Transcripts
Word-for-word transcription of speech and other significant sounds, e.g., laughter, applause, song lyrics; indicate speaker changes
Required for audio-only spoken word materials
Display on screen with link to audio or vice versa
Transcript is basis for captions
34
Captions
Word-for-word text representation of speech and other significant sound in video or Flash movies that include soundtracks
• Synchronize with video so captions appear as words are spoken
• Show speaker changes, significant sounds such as laughter, applause, song lyrics, ringing telephones, off-screen speech
• May be open (everyone sees) or closed (user chooses)
35
Audio description
Brief narrative description of significant onscreen events that can’t be inferred or understood from the soundtrack alone
Synchronized with video Audio descriptions are inserted into
natural pauses in the dialogue so as not to interfere with primary audio track
Not all video requires audio description
36
Multimedia Examples
Captioned and described video Sextet video clip at
http://realaudio.cc.utexas.edu:8080/ramgen/research/accessibility/video/real/real_sextet_short.smil
National Center for Accessible Media http://ncam.wgbh.org
37
Other Multimedia Issues
Flash and Shockwave pose severe accessibility problems
SMIL (Syncrhonized Multimedia Integration Language) is a good solution
MAGpie (Media Access Generator from National Center for Accessible Media)
38
Testing and Evaluating
Types of testing Automated testing Compliance checking Expert review User testing
39
Automated Testing: Bobby
Bobby Worldwide Bobby Client Automated check detects about 28% of
potential problems Reports items that require user check
40
Compliance Checking: Bobby’s User Checks
Bobby and other automated tools report items that require informed manual review
User checks are listed even if the item is OK
Compliance does not equal accessibility!
41
Expert Review
Performed by someone who is experienced with assistive technology, Web design, plus accessiblity standards and usability practices
42
User Testing
Include people with disabilities in user tests
Design test scenarios Evaluate results Go back to drawing board…
43
Participate in AIR-Austin!
A one-day “rally” for accessible design Donate your expertise to help an Austin-
area nonprofit put up an accessible Web site
Win recognition for your work Info at http://www.knowbility.org
44
Participate in AIR-UT!
Accessibility Internet Rally for UT Kick-off in May Deadline Fall Produced by Knowbility in conjunction
with annual AIR-Austin competition See last year’s event info at
http://www.utexas.edu/events/air-ut/
45
Contact Information
John SlatinAccessibility Institute, FAC 248C
495-4288 (ph), 495-4524 (fax)www.utexas.edu/research/accessibility