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