Techniques for WCAG 2.0

Skip to Content (Press Enter)


FLASH7: Using scripting to change control labels


This technique relates to:

User Agent and Assistive Technology Support Notes

See User Agent Support for Flash for general information on user agent support.


The purpose of this technique is to allow users to choose to have additional information added to the label of a button or other control so that it can be understood out of context.

Some users prefer to have control labels that are self-contained, where there is no need to explore the context of the control. Other users find including the context information in each button to be repetitive and to reduce their ability to use a site. Among users of assistive technology, the feedback to the working group on which is preferable has been divided. This technique allows users to pick the approach that works best for them.

A control is provided near the beginning of the page that will expand the labels for controls on the page so that no additional context is needed to understand the purpose of those controls. It must always be possible to understand purpose of the control directly from its label.

This technique expands the control labels only for the current page view. It is also possible, and in some cases would be advisable, to save this preference in a cookie or server-side user profile, so that users would only have to make the selection once per site.


Example 1: Using ActionScript to add contextual information directly to the label of a button

This example uses ActionScript to add contextual information directly to the label of a button. When the "Expand Button Labels" button is toggled, each button on the page has its label property modified.

Example Code:

import fl.accessibility.ButtonAccImpl;
btn1.addEventListener(MouseEvent.CLICK, clickHandler);

function clickHandler(e) {
  btn2.label = btn1.selected? "PDF version of 2010 brochure": "PDF";
  btn2.width = btn1.selected? 200: 100;
  btn3.label = btn1.selected? "Text version of 2010 brochure": "Text";
  btn3.width = btn1.selected? 200: 100;
  btn4.label = btn1.selected? "Word version of 2010 brochure": "Word";
  btn4.width = btn1.selected? 200: 100;

The result can be seen in the working example of adding contextual information to a button label. The source of adding contextual information to a button label is available.



When a Flash Movie contains content with context dependent labels, confirm that a separate toggle control is provided that allows the user to expand the labels so that they are no longer context dependent.

Expected Results

The above is true.