Because there are not that many accessible Flash sites out there yet, it is helpful to add a small Welcome Message for screen reader users to a Flash site or a Flash application. This can be a small hidden text field, that is given the tabIndex of 1, so it is picked up first.

Because of Flash’ dynamic nature, it might be hard for screen reader users to detect any changes on a Flash screen after it has updated. These changes mostly occur after a button is pressed or other user action in Flash. In order for the screen reader JAWS to start reading from the top again, CTRL + Home can be pressed. This can be put in the screen reader welcome message. An example:

Welcome to the <insert title of the website here> website. Use the up and down arrow keys to navigate this Flash site with a screen reader. Press Enter or the Space Bar to select the buttons. Press CTRl + Home to scan each Flash screen from the top for changes after <insert button here>.

A welcome message like this alerts screen reader users that this Flash application has been made accessible, and serves as a reminder that the content might change. It can be tailored to the specific Flash site. For a quiz, for example, you can alert the user to press CTRl + Home ‘for changes after pressing the next button’.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

Writing meaningul alt text is important. Just adding ‘image of __’ is not enough, the image needs to have a meaningful description of its contents. Remember that alt texts in Flash can be longer than in HTML, so we can add more details. Here are a few Alt Text guidelines that we go by:

• Keep text short, avoid re-using words and combine sentences where possible.
• Write in the present tense.
• Describe the scene, the figures and the action. Describe any image details that are of importance to the scene.
• Start an image with ‘Image of..’
• Start an animation with ‘Animation of..’
• Use foreground/ background references to describe a scene set-up.
• Do not disclose any additional information that is not apparent visually. (For example, if an image shows a painting, then describe what this painting looks like instead of giving its official title.)
• Include all text that is written in the image. (Text as art)
• Include colors if they are of importance.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

The tricky part in programming the Reading Order in Flash, is that the screen reader focus does not always re-start from the beginning of the Flash file when Flash content changes. Unfortunately, there is no way for Flash to programmatically shift the screen reader focus yet. (I am sure this will be added soon).

But there is a way to influence the focus of the Tab Order, by using Selection.setFocus(instance name); You can use this code to re-set the Tab Order focus from screen to screen. This would be useful in a quiz, for example, where you want the user to start tabbing on each new answer on each new question.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

When using loadMovie to load an external jpg or swf into a holder movieclip, make sure to replace it with the newer MovieClipLoader code. A downside of loadMovie is that it causes any properties of the movieclip to be wiped out when the new content has been loaded, including any alt text that has been assigned.

So replace this code:

holder_mc.loadMovie(”external.swf”);
holder_mc._accProps = new Object();
holder_mc._accPRops.name = “alt text”;

With this:

var mcListener:Object = new Object();
mclListener.onLoadComplete = function() {
// assign alt text here when finished loading
}
var loader:MovieClipLoader = new MovieClipLoader();
loader.addListener(mclListener);
Loader.loadClip(”external.swf”,  holder_mc);

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

When you are programming buttons dynamically, you might be enabling or disabling buttons that are not in use. For example, a back button can be greyed out and disabled on the first page of a slideshow. If you are leaving these buttons on the stage, and disabling them by button.enabled = false; code, then make sure to also set the button.tabEnabled = false; as well.

Buttons that are disabled, but still tabEnabled, form silent holes in the tab order. You still tab to them, but no yellow focusrect will appear. This might be confusing to users that use the tab key.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

We have come across several Coming Soon rollover buttons. Sometimes button objects are used that do not actually have an OnRelease event, but just an OnRollOver state. Nothing happens when you click them, just when you roll over them. This is clear to a sighted user, but to a screen reader user it might be confusing when the button reads as a ‘button’, but nothing happens when it is clicked.

TIP: For buttons that only have a rollover state and no release event, consider setting the button to .silent. Then make a hidden text field behind the button that holds the information, alt text or text. The button itself can still have a .tabIndex and can still be rolled over by tabbing. Users cannot tab to a text field, so it will remain hidden. This way the screen reader avoids reading ‘button’, but will just read the message ‘Coming Soon’.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

When you have ordered all the elements with .tabIndex, and you want to test out the Reading Order with a screen reader, you will have to publish and open your file in Internet Explorer. This is because the screen reader works with MSAA, that runs inside of the browser. MSAA pulls out the content of your Flash movie, and feeds it to the screen reader. But to test out the Tab Order, by tabbing through the movie, you don’t have to leave Flash.

TIP: You can tab through your Flash movie in Publish Preview mode (CTRL + Enter) by turning off the internal shortcuts in Flash. Press CTRL + Enter. Go to Control > Disable Keyboard Shortcuts in the preview window. Now you can tab through your Flash movie to test the Tab Order.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

When making Flash accessible, there are two things to consider: 1) The Reading Order. This is the order in which the screen reader reads the Flash content. 2) The Tab Order. This is the order in which a user would tab through the Flash movie by pressing the Tab key.

In Flash you use the tabIndex code to program both. You give tab Indeces to all elements in Flash, text, movieclips and buttons. When you use the screen reader, it will read all the elements in order. When you tab through the content, it will follow the same order. When tabbing, the yellow focusrect will come up around the items. It will not highlight text. BUT it does highlight movieclips that are just graphics. Because these are not buttons and/or selectable it does not make sense to tab to these.

TIP: Set the tabEnabled properties for graphics with Alt text to false. Example:
image1.tabIndex = 1;
image1.tabEnabled = false;

Finally, we are documenting all the answers to the FAQ on Flash Accessibility! To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.