Can You Create Accessible Websites Using Flash?
January 12, 2009, 1:00 - 2:30 PM
MSF &W Accessibility Solutions
About the Presentation
Adobe Flash is a multimedia technology used to add animation and interactivity to web pages. Flash Movies are used for everything from simple animations to complete interactive applications, and Flash Video has become the leading video format on the web.
Adobe has been working hard to make sure Flash is accessible to people with disabilities, but the techniques are still new — and sometimes painful.
This presentation will discuss what Flash technology is, how it can and should be used, and what you need to know to ensure that is accessible to everyone.
About the Presenter
Mike Scott is an assistive technology and accessibility specialist with
MSF&W Accessibility Solutions in Springfield, Illinois.
Mike works with a wide range of public- and private-sector clients to help assess the accessibility of existing systems, design and develop new accessible systems, and train staff on how to successfully implement accessibility in system design and development.
Mike has spearheaded many accessibility initiatives, including development of the Illinois Web Accessibility Standards and the
Illinois Information Technology Accessibility Act.
To view some of the examples used in this presentation, you will need to have Adobe Flash Player 10 installed and enabled. The test movie below should indicate whether Flash Player is installed and working on your system:
What is Flash?
A technology (
Adobe Flash Platform) A player (
Adobe Flash Player) An authoring tool (
Adobe Flash CS4 Professional)
Vector-based = small file-size, scalable images
Animation = images (frames) that change over time
for the Web = cross-platform
[A sample Flash animation showing several images fading from one to the next.]
[A sample Flash form with a text box, drop-down list, check box, and button.]
[A sample Flash movie with playback controls including play/pause and a closed captioning button.]
What is Accessibility?
Accommodating People with Disabilities
People with low vision or blindness
People with limited use of their hands
People who are deaf or hard of hearing
People with learning disabilities
Large fonts & high contrast
(ZoomText, MAGic) Screen readers
(JAWS, Window-Eyes) Speech recognition
(Dragon NaturallySpeaking) Closed captioning
Can we make Flash Accessible?
Series of images (frames) that change in time
May include text
May include audio (but not speech)
- for users with photo-sensitive epilepsy Avoid distraction
- for users with vision or cognitive disabilities Communicate equivalent information
- for users who are blind
Provide "alternate text."
Find the Accessibility Panel
Windows > Other Panels > Accessibility
Shift + F11
For decorative animations...
Uncheck "Make movie accessible"
Leave Name blank
Leave Description blank
For meaningful animations...
Check "Make movie accessible"
Uncheck "Make child objects accessible"
Enter alternate text in Name and/or Description
For complex meaningful animations...
Consider providing an HTML alternative
Note: Flash cannot replace HTML
JAWS does not read movie Name or Description
Window-Eyes does not
reliably read movie Name or Description
Set wmode to opaque or transparent to reveal alternate content
<param name="wmode" value="transparent" />
<p>Alternate HTML content</p>
Decorative animations can be used if they don't strobe and aren't distracting
Provide alternate content for meaningful animations using:
Movie Name and/or Description
Object content (with wmode)
Elsewhere on the page
Animations that take different courses based on user actions
May include user interface elements such as:
Watches for "events" - e.g.,
hover, click, etc. Responds with actions
Pre-built Flash objects that mimic standard user interface controls
- for users with cognitive impairments Keyboard operability
- for users with limited use of hands Screen reader compatibility
- for users who are blind
Use standard controls.
Two lines of
type of control
Try "Auto label"
Rely on "Name"
Set reading/tab order.
Limit the size of the stage
Name component instances
and set "Tab index" Use an alternate off-stage interface
Consider conceptual issues.
Screen readers are linear
GUIs are two-dimensional Animated
GUIs are three-dimensional (including time)
Ask: could I find what just changed if I couldn't see?
Except for the simplest examples, making Flash
user interfaces accessible is very difficult Consider whether it is worth the effort
It may be possible to make simple Flash interfaces accessible
Keep it simple
Plan to test...
Recorded full-motion video,
e.g., from camcorder or screen capture Including synchronized audio
FLV, F4V, and related formats
Keyboard-operable playback controls
- for people with
limited use of their hands Screen-reader compatible playback controls
- for people
who are blind Captioning
- for people who are hard of hearing or deaf
Use Flash CS4 playback controls (skins).
Use the FLVPlaybackCaptioning component.
external caption files easy Uses industry standard Timed Text
Use subtitle-horse to create caption files.
CS4 playback controls are accessible!
FLVPlaybackCaptioning component makes attaching captions easy
Flash Development Tools
Flash Development Tools
Designed to help non-technical users
create Flash-based e-learning presentations Powerful screen recording feature
Top-notch closed captioning tool
Powerful integrated development environment
for rich Flash-based applications Claims to have 28 accessible interface components
Custom JAWS scripts
Have not made an accessible example work yet...
Scripts for JAWS 10?