Web Access Centre
Flash - Web Access Centre
Summary: The release of Flash MX 2004 (version 7) has made Flash much more accessible than it has previously been for many users.
- Rationale
- Techniques
- Testing tips
- Further information
- Website Accessibility Initiative compliance
- Other pages about multimedia
Rationale
The release of Flash MX 2004 (version 7) has made Flash much more accessible than it has previously been for many users. This includes users with hearing impairments, low vision (screen magnification users) and blind users ie screen reader users who are the main group of users encountering barriers of access to Flash.
Following accessible Flash design guidelines will go a long way toward making your Flash animations accessible to these various groups. However we do still advise that accessible alternatives be provided.
The key issues are that it can be problematic for users with screen readers to navigate around and access information. Screen magnification users also can still encounter problems with navigating and understanding information. Both of these user groups may have problems with establishing the context of the Flash. Finally, text-based browser users can not view Flash at all.
Techniques
- Provide text equivalents for all objects in the animation that are related to content and, or, functionality. This will be picked up by screen readers and read to the user just as ALT text is for images in HTML.
This can be done via the accessibility panel in the Flash-authoring tool. The option to "Make movie accessible" should be checked along with "Auto label" and then either a name or description should be given. There is no need to give both a name and a description as this results in the screen reader user having to listen to a lot of redundant information.
- Hide unnecessary content from the screen reader user. Just as text equivalents should be provided in the accessibility pane by using name or description (see above "Provide text equivalents") non-content related objects should be hidden. This can be done in the accessibility panel by deselecting "Make movie accessible".
- Ensure good contrast in the animation so users can easily read text and see images. Good judgement is needed and colour choices can be tested against W3C (World Wide Web Consortium) algorithms. A useful feature would be to provide users with a variety of colour options to choose from.
- Do not use colour alone to convey meaning. This is because not all users can see colour, so will miss the meaning the difference of colour is indicating. Colour can and should be used, of course, but do ensure that the object has a name or description for screen reader users. Different shapes or patterns can also be used to convey meaning; which is especially useful for low vision users.
- Allow screen magnification by making available the option to scale the animation by right clicking with a mouse and selecting "Zoom in" and "Zoom out". For non-mouse users this option could be given as a set of buttons in the animation for "Small", "Large", "Larger" and "Largest".
- Provide on/off switches for movement. Movement can be distracting for some users, especially screen magnification users who only see a small part of the screen at a time, so on off switches should be provided.
- Control the reading order of objects within the Flash animation. This is essential for screen reader users, as they are unable to visually scan animations the way a sighted user does. A logical tab order can be applied using ActionScript, limiting the size of the stage and keeping the animation simple, or creating a linear version of the content offstage.
- Caption audio content for those users who may have hearing impairments or no sound facility in their software. This can be done in one of three ways. A video, already captioned, can be imported into the Flash animation, text objects can be provided as alternatives or an XML caption file can be streamed in.
- Provide context for Flash animations so users with visual impairments can gain the same understanding or feel for the animation as a sighted user might. For example, if there is a Flash animation of a room, provide a description that sets the scene. Ideally this should be available to both screen reader users and low vision users. This could be in a "help" or "about this site" section. That way a visually rich and exciting sight can be made more exciting to screen reader or low-vision users.
- Ensure keyboard access to all buttons and controls within the Flash animation. This is essential for non-mouse users such as users with mobility problems or screen reader users. Ensuring keyboard access must be checked both with a screen reader and without a screen reader.
- Link to Macromedia so that those users who would like the Flash plugin and haven't got it can find it easily from your page.
- Accessibility checking extensions can be downloaded and installed in the Flash authoring software. Download details can be found on the Macromedia site, a link to which is provided below in the Further information section.
Testing tips
Verify that there are accessible alternatives to Flash that can be accessed from the same page. This could be in the form of an alternative text link for a banner advert or an HTML version of a Flash animation (ie a demo, form or game).
Check that screen readers can pick up on content and that unnecessary content is hidden. Unlike HTML pages this can only be verified with a screen reader is you do not have access to the swf file. Check also that the Flash animation allows the users to scale text if necessary.
- Accessibility toolbar - Go to Doc info - Identify multimedia files. This will only tell you if Flash is present on a page.
- Browser - Go to View - Source - File - Edit - Find ".swf". Then look for an HTML alternative within the <OBJ> or a link to an HTML alternative elsewhere within the page itself.
- Screen reader - Listen to the Flash animation while tabbing through it. Check that meaningful content and functionality has a name or description and that the tab order makes sense. Ensure that you can activate all links.
Jaws / Flash keyboard commands are as follows:
- insert + escape = update screen
- down arrow = read next item
- up arrow = read previous item
- insert + down arrow = read all
- right arrow = read next character
- left arrow = read previous character
- enter = activate link
WindowEyes / Flash keyboard commands are as follows:
- tab = next link
- control + tab = previous link
- down arrow = read next item
- up arrow = read previous item
- page down = read all
- page up = go to top
- right arrow = read previous character
- left arrow = read previous character
- enter = activate link button
- control + shift + A = toggle MSAA mode to update screen
- Text-based browser - Text-based browsers can not support Flash. Check that alternatives have been provided in their place.
Further information
- Accessibility and Flash - Frequently Asked Questions about Flash Accessibility, by Adobe.
- Andrew Kirkpatrick's (Adobe) Blog - Bob's blog focuses on accessibility and Flash.
- JKRowling.com - A completely Flash based site developed by Lightmaker built with accessibility in mind.
- Blind Date game - A Flash game- developed by Nomensa and RNIB.
Website Accessibility Initiative compliance
- 11.4 If, after best efforts, you cannot create an accessible page, provide a link to an alternative page that uses W3C technologies, is accessible, has equivalent information (or functionality), and is updated as often as the inaccessible (original) page. Priority 1
- 7.3 Until user agents allow users to freeze moving content, avoid movement in pages. Priority 2
- 9.4 Create a logical tab order through links, form controls, and objects. Priority 3
For more information on techniques visit the Web Accessibility Initiative techniques page.
Other pages about multimedia
- Flash
- Audio and video
- PDFs
Back to Design and Build
For Web Access Centre updates email webaccess@rnib.org.uk
Content author: webaccess@rnib.org.uk
Last updated: 19/01/2009 15:24
More info
In your area
Latest updates
Related info
Your stories
JK Rowling's story - when JK Rowling had her website redesigned she asked design agency Lightmaker to push the boundaries of accessible Flash. The original site offered the user an intensely visual experience. The new site needed to keep the explorative and creative elements but present them in a universally accessible way. Find out about the key features of the site and how it was designed. JK Rowling's accessible Flash website - full story