Accessibility 101 - University of Texas at Austin School
Download
Report
Transcript Accessibility 101 - University of Texas at Austin School
Accessibility 101
Dr. John Slatin, Director
Accessibility Institute
University of Texas at Austin
1
Objectives
Participants 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
2
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
3
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
4
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
5
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
6
Types of disability
Cognitive/learning
Auditory
Visual
Motor/physical
Speech
7
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)
8
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)
9
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
10
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
11
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)
12
Every Page Accessibility
Text equivalents (a)
Skip navigation (o)
Cascading Style Sheets (d)
Plus…
Relative sizes for fonts, etc.
Clear, informative link text
13
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.
14
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
15
Alt Text Examples & No-Nos
Accessibility Institute How-Tos and
Demos at
http://www.utexas.edu/research/accessi
bility/resource/how_to/index.html
16
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
17
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.
18
Skip Navigation Examples
UT Home Page at www.utexas.edu
19
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.
20
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
21
Accessible Technologies
Forms (n)
Tables (g, h)
Multimedia (b)
Applets and plug-ins/media players (m)
Image Maps (e, f)
Scripts (l)
Frames (i)
22
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
23
Table Examples: Simple Table
Identifying row and column headers
http://www.utexas.edu/research/accessi
bility/resource/how_to/table/headers/he
aders.html
24
Table Example: Complex Table
Associating data cells and header cells
http://www.utexas.edu/research/accessi
bility/resource/how_to/table/complex/co
mplex.html
25
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.
26
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.
27
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
28
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
29
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/accessi
bility/resource/how_to/index.html
30
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
31
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
32
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
33
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 34
chooses)
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
35
track
Multimedia Examples
Captioned and described video
Sextet
video
clip
at
http://realaudio.cc.utexas.edu:8080/ram
gen/research/accessibility/video/real/rea
l_sextet_short.smil
National Center for Accessible Media
http://ncam.wgbh.org
36
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)
37
Testing and Evaluating
Types of testing
Automated testing
Compliance checking
Expert review
User testing
38
Automated Testing: Bobby
Bobby Worldwide
Bobby Client
Automated check detects about 28% of
potential problems
Reports items that require user check
39
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!
40
Expert Review
Performed by someone who is
experienced with assistive technology,
Web design, plus accessiblity standards
and usability practices
41
User Testing
Include people with disabilities in user
tests
Design test scenarios
Evaluate results
Go back to drawing board…
42
Participate in AIR-Austin!
A one-day “rally” for accessible design
Donate your expertise to help an Austinarea nonprofit put up an accessible
Web site
Win recognition for your work
Info at http://www.knowbility.org
43
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/
44
Contact Information
John Slatin
Accessibility Institute, FAC 248C
495-4288 (ph), 495-4524 (fax)
www.utexas.edu/research/accessibility
[email protected]
45