by Andrew Kirkpatrick, Group Product Manager, Accessibility
Testing for keyboard access is probably the first test that should be performed when evaluating the accessibility of Flash and Flex content and applications. Many developers are not familiar with the ways that users are able to interact with applications when using only the keyboard, so it is important that time is taken learn about how keyboard access should work.
For Windows, a useful resource is Microsoft’s Windows User Experience Guidelines, and in particular the section on controls (http://msdn.microsoft.com/library/en-us/dnwue/html/ch08c.asp). This document provides detailed information about keyboard access, and is worth reading. In Flex and Flash components, keyboard accessibility is designed into the components, but for developers creating new components or customizing controls it is crucial to keep the expected keyboard access requirements in mind.
A good starting point for testing keyboard access is the following basic test plan:
- Put the mouse away. Turn it upside down, unplug it, whatever it takes to not use it.
- Open the application or web page containing the Flash or Flex content.
- Tab through the application without interacting with any controls. Make sure that you can follow the focus visually and that it follows an expected path.
If you have difficulty locating the focus, this is a problem that needs to be addressed. Tools such as Inspect32 (http://www.microsoft.com/downloads/details.aspx?displaylang=en&familyid=3755582a-a707-460a-bf21-1373316e13f0) can be used to assist testers in locating the focus when it is hard to see – this is just to assist in development; don’t expect your users to use this tool.
- Tab in reverse. Shift+tab is used to tab backwards through the tab order. Occasionally there are issues in tabbing that are made apparent by reverse tabbing.
- Tab to specific controls and check the behavior of each. For example, if you tab to a ComboBox in a Flex 1.5 application make sure that the behavior of the ComboBox matches your expectations and the documentation for the ComboBox keyboard navigation at http://livedocs.macromedia.com/flex/15/flex_docs_en/00000232.htm.
The big challenge here is when you are using controls that you’ve made in a Flash movie (e.g. a simple tab navigator, made from scratch and possibly without much attention to proper keyboard support) or in a custom control for Flex — make sure that when you make or significantly modify a control that you determine what type of control it is and make it conform to expected keyboard conventions.
- If the Flash content has specific keyboard shortcuts to perform functions, make sure that these don’t interfere with the keystrokes defined for specific controls. Most keystroke conflicts that I see occur when a screen reader is running, so that will be a necessary testing step for another phase of testing.
Did I mention that tab order is important?
The tab order is really, really important, because it not only affects the logical usage order of the application’s controls, but it also affects the reading order for assistive technologies. This means that you need to set the tab order for everything that will be read unless your application is very simple and only has object in a single vertical or horizontal group.
There has been a positive change in the way that the Flash player handles tab order issue since Flash Player 8 which is that items with no tabIndex property defined are put at the end of the tab order. Prior to this version, if a single object didn’t have a tabIndex the default tab order for the player was used instead.
If you haven’t tested the keyboard access on your Flash or Flex applications yet, give it a shot. Like most testing, you’ll get faster the more you do it and be a better developer for it.
Flash 8 Documentation – components language reference
Flex 1.5 Documentation – see keyboard access information associated with different control types
Flex ActionScript and MXML API Reference Version 1.5
Flex 2.0 Documentation (link to be updated after Flex 2.0 release) http://livedocs.macromedia.com/labs/1/flex20beta3/00001046.html