Techniques for WCAG 2.0

Skip to Content (Press Enter)

-

SL17: Providing Static Alternative Content for Silverlight Media Playing in a MediaElement

Applicability

This technique relates to:

User Agent and Assistive Technology Support Notes

See User Agent Support Notes for SL17.

Description

The objective of this technique is to replace a Silverlight MediaElement with static alternative non-media content that is not time-based. The static alternative content replaces the media in the same or a nearby user interface region of the Silverlight application.

A Silverlight application user interface can be adjusted at run time by removing elements from the visual tree, and adding new elements to the visual tree. In this case, the user interface is designed to provide a control that the user activates to display the static alternative content, which is often a control that displays text, or a text element.

Examples

Example 1: MediaElement playing audio, replace with transcript

This example has a UI definition in XAML and interaction logic in C#. In this case the MediaElement has no visual representation itself and is 0x0 size because it plays audio only. As a simple placeholder, this example displays the text "Library of Congress Audio" to represent the media element as something visible in the UI. In addition to Play/Stop controls, this interface includes a Display Transcript button. Activating the button displays static text that represents the transcript of the audio. The following is the basic UI in XAML.

<UserControl x:Class="ReplaceAudioWithTranscriptText.MainPage"
   xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
   xmlns:sys="clr-namespace:System;assembly=mscorlib">
   <UserControl.Resources>
       <sys:String x:Key="transSpeakerName">Matt Raymond: </sys:String>
       <sys:String x:Key="transText">This is Matt Raymond at the Library of Congress.
Each year thousands of book lovers of all ages visit the nation's capital to celebrate the joys 
of reading and lifelong literacy, at the Library of Congress National Book Festival. 
For the first time in the festival's nine year history, President Barack Obama and 
First Lady Michelle Obama will serve as honorary chairs of this free event. </sys:String>
   </UserControl.Resources>
   <StackPanel x:Name="LayoutRoot" Background="White" >
       <TextBlock FontSize="30" Foreground="Blue">Library of Congress Audio</TextBlock>
       <MediaElement Source="/locintro.wma" AutoPlay="False" Name="player" Height="0" />
       <StackPanel Orientation="Horizontal" Name="ControlBar">
           <Button Name="Play" Click="Play_Click">Play</Button>
           <Button Name="Stop" Click="Stop_Click">Stop</Button>
           <Button Name="TextAlt" Click="TextAlt_Click">Display Transcript</Button>
       </StackPanel>
   </StackPanel>
</UserControl>

The following is the C# logic.

   public partial class MainPage : UserControl
   {
       RichTextBox rtb;
       bool transDisplayed=false;
       public MainPage()
       {
           InitializeComponent();
           rtb = new RichTextBox();
           rtb.IsReadOnly = true;
           Paragraph p = new Paragraph();
           Run speakerName = new Run();
           speakerName.Text = this.Resources["transSpeakerName"] as String;
           speakerName.FontWeight = FontWeights.Bold;
           Run transText = new Run();
           transText.Text = this.Resources["transText"] as String;
           p.Inlines.Add(speakerName);
           p.Inlines.Add(transText);
           rtb.Blocks.Add(p);
       }
       private void Play_Click(object sender, RoutedEventArgs e)
       {
           player.Play();
           Play.IsEnabled = false;
       }
       private void Stop_Click(object sender, RoutedEventArgs e)
       {
           player.Stop();
           Play.IsEnabled = true;
       }
       private void TextAlt_Click(object sender, RoutedEventArgs e)
       {
           Panel parent = (player.Parent as Panel);
           if (!transDisplayed)
           {
               DisplayTranscript();
               (sender as Button).Content = "Hide Transcript";
               transDisplayed = true;
           }
           else
           {
               parent.Children.Remove(rtb);
               (sender as Button).Content = "Display Transcript";
               transDisplayed = false;
           }
       }
       private void DisplayTranscript()
       {
           Panel parent = (player.Parent as Panel);
           parent.Children.Add(rtb);
       }

This example is shown in operation in the working example of Replace Audio With Transcript.

Resources

Resources are for information purposes only, no endorsement implied.

Tests

Procedure

  1. Using a browser that supports Silverlight, open an HTML page that references a Silverlight application through an object tag. That application has audio-only media content and is expected to supply a text alternative, or has media that is expected to be replaced entirely with a transcript or similar text alternative.

  2. Check for a control that indicates that activating it will supply static alternative content for the media. Activate the control.

  3. Verify that the media control is replaced with alternate content, and that assistive technologies represent the change to the user interface.

Expected Results

#3 is true.

If this is a sufficient technique for a success criterion, failing this test procedure does not necessarily mean that the success criterion has not been satisfied in some other way, only that this technique has not been successfully implemented and can not be used to claim conformance.

Techniques are Informative

Techniques are informative—that means they are not required. The basis for determining conformance to WCAG 2.0 is the success criteria from the WCAG 2.0 standard—not the techniques. For important information about techniques, please see the Understanding Techniques for WCAG Success Criteria section of Understanding WCAG 2.0.