Accessibility in Silverlight

This overview describes techniques you can use to make your Microsoft Silverlight-based applications more accessible.

This topic contains the following sections:

• Screen Reader
• Associating Screen Reader Information and Events with the Silverlight Plug-In
• Limitations

Screen Reader

Most of the accessibility features described in this overview depend on the screen reader that ships with the Windows operating system. The screen reader reads text from the screen audibly so that people who are visually impaired can access the content.

Associating Screen Reader Information and Events with the Silverlight Plug-In

The Silverlight Accessibility object and its members let you associate descriptive information with your Silverlight plug-in so that that information can be read out loud by a screen reader. For example, if you create an advertisement for a game such as Gears of War, you could provide information that would be read aloud by a screen reader, and then associate that information with the plug-in.

Specifically, the Accessibility object enables you to provide information to a screen reader by using the properties described in the following table.

In addition to these properties, the Accessiblity object provides the PerformAction event that is fired whenever the accessibility technology invokes an action.

The following example shows how to use these members to make a Silverlight plug-in more accessible.

1. Associate OnLoad event to plug-in: You cannot manipulate the Accessiblity object from XAML. Therefore, you must find a way to set the Accessibility object in procedural code. You can associate the OnLoad event with the plug-in by setting the CreateSilverlight.js file to call the OnLoad event, as shown in the following example.

   JavaScript

   function createSilverlight() { Silverlight.createObject( "advertisement.xaml", // Source property value. parentElement, // DOM reference to hosting DIV tag. name, // Unique plug-in ID value, a variable set before each page call. { // Plug-in properties. width:'600', // Width of rectangular region of plug-in, in pixels. height:'200', // Height of rectangular region of plug-in, in pixels. version:'1.0' // Plug-in version to use. }, { onError:null, // Use default error handler. onLoad:onLoad // OnLoad event handler that can be used for multiple instances. }, null, // InitParams property value set to null. context); // Unique context ID, a variable set before each page call. }

   The following code shows how this might look in the larger context of the CreateSilverlight.js file.

   JavaScript

   function createSilverlight() { Silverlight.createObject( "advertisement.xaml", // Source property value. parentElement, // DOM reference to hosting DIV tag. name, // Unique plug-in ID value, a variable set before each page call. { // Plug-in properties. width:'600', // Width of rectangular region of plug-in, in pixels. height:'200', // Height of rectangular region of plug-in, in pixels. version:'1.0' // Plug-in version to use. }, { onError:null, // Use default error handler. onLoad:onLoad // OnLoad event handler that can be used for multiple instances. }, null, // InitParams property value set to null. context); // Unique context ID, a variable set before each page call. }

   See [Writing Event Handlers for the OnLoad Event](bb794710\(v=msdn.10\).md) for more information.

   2. Use the Accessibility object and its members: Use the OnLoad event handler to set the Accessiblity object and its members, as shown in the following code.

      JavaScript

      function onLoad(plugin, userContext, sender) { // Specify accessibility information. var acc = plugin.content.accessibility; acc.Title = "Gears of War Advertisement"; acc.description = "This is an advertisement for Gears of War. " + "Gears of War is a tactical third-person shooter " + "video game developed by Epic Games. and published by" + " Microsoft Game Studios."; acc.actionDescription = "Click to find out more"; acc.addEventListener("PerformAction", "doAccessibilityAction") } function doAccessibilityAction(sender) { // TODO: Navigate to Gears of War game site... }

      Limitations

      Accessibility limitations:

      • Only the plug-in can get focus, not individual elements within the plug-in. As a result:
        • You cannot associate accessibility information with elements within the plug-in. For example, in the advertisement example, you can provide a description for the advertisement plug-in, but you cannot associate a description with a specific media play button or other object within the advertisement.
        • Because there is no focus, there is no tab index, ordering, or navigation for elements.
        • Without focus, all keyboard input goes to the root element.

      Browser and platform limitations:

      • On Windows, exposing accessibility information requires the control to use embedded mode, not full-screen mode. See Silverlight Full-Screen Support for more information.
      • The Macintosh does not provide accessibility for browser plug-ins. Therefore, none of the accessibility information being exposed on the Silverlight plug-in can be accessed on the Macintosh through a screen reader.

      See Also

      Writing Event Handlers for the OnLoad Event
      Overviews and How-to Topics