Static Web Dynamic Web Home Automation Mobile Dev ARIA User Testing Flash Silverlight PDF

W3 Accessibility Guidelines Core

Non-text Content

All non-text content that is presented to the user has a text alternative that serves the equivalent purpose

The intent of this Success Criterion is to make information conveyed by non-text content accessible through the use of a text alternative. Text alternatives are a primary way for making information accessible because they can be rendered through any sensory modality (for example, visual, auditory or tactile) to match the needs of the user.

W3 Accessibility Guidelines Silverlight

The objective of this technique is to wrap the Silverlight Image class inside a UI container class that is focusable. If the image is focusable, users who use the TAB sequence to navigate content while the assistive technology is active, and/or assistive technologies that construct navigation structures that are based on the TAB sequence, can both detect the image in navigation. The assistive technology can then associate alternative text for that image within the navigation structure, and report the information to the user.

Many existing assistive technologies do not construct initial navigation views that are derived from UI Automation information if it is coming from a non-focusable element in a Silverlight user interface. This is particularly true if the assistive technology is in a navigation mode that is specifically intended to help users enter information into a form or similar interactive interface element; an example of this situation is the Forms Mode of the JAWS screen reader.

Example

Now that the image is wrapped by a focusable control, you can instantiate an instance of the wrapper UI inside a Silverlight layout container, specify AutomationProperties.Name at the level of the wrapper control’s tag, and have that text serve as the alternative text for the referenced source image file.

<StackPanel
   xmlns:local="clr-namespace:ImageEquivalent;assembly=FocusableImage"
   >
   <local:FocusableImage
     Height="300" Width="400
     AutomationProperties.Name="Diagram of secret lair"
     Source="/diagram_lair.png" />
   </StackPanel>