실버라이트 웹 접근성시 참고!

실버라이트 콘텐츠의 대체 텍스트 제공

실버라이트(Silverlight)에서 텍스트 아닌 콘텐츠에 대한 대체 텍스트는AutomationProperties.Name 속성 또는 AutomationProperties.LabeledBy 속성을 이용하여 제공한다. 콘텐츠 또는 컨트롤에 대한 설명문이나 도움말은 AutomationProperties.HelpText 속성을 이용하여 제공한다.

• AutomationProperties.Name 속성 이용방법
  AutomationProperties.Name 속성은 주로 사용자 인터페이스 자동화 클라이언트에서 선택할 수 있는 자동화 속성으로 대체 텍스트를 제공하는 데 사용된다.
  다음 예는 상품 이미지(smt_case_12.png)에 대한 대체 텍스트를 제공하는 코드이다.

• AutomationProperties.LabeledBy 속성이용 방법 
  AutomationProperties.LabeledBy 속성은 다른 사용자 인터페이스 요소에서 정의된 텍스트를 바인딩을 통하여 대체 텍스트로 제공할 경우에 사용하며 그 역할은 AutomationProperties.Name과 동일하다.
  다음 예는 텍스트 입력 상자의 대체 텍스트(레이블)를 "실버라이트 설명"이라고 제공하는 코드이다.
  

  실버라이트 설명
  
  

실버라이트 콘텐츠

실버라이트 콘텐츠의 경우 이미지를 이용하여 사용자 정의 컨트롤을 만들고 IsTabStop 값을 true로 설정하여 사용자 정의 컨트롤이 키보드 초점을 받을 수 있도록 한다. 사용자 정의 컨트롤이 초점을 받았음을 화면상으로 구분하기 위해서는 VisualStateManager 클래스를 사용한다. 더 쉬운 방법은 이미지를 버튼 컨트롤에 포함시켜 이미지 버튼으로 구현하는 것이다. 다음 소스코드는 이미지(sample.jpg)를 클릭하면 어떤 함수(doProcess)를 수행하는 예다.

실버라이트 콘텐츠를 구성하는 콘텐츠에 대체 텍스트를 제공함으로써 사용자에게 혼란을 주게 될 경우 대체 텍스트를 제공하지 않아야 한다. 장식용으로 사용되는 배경 이미지, 글머리표 등이 여기에 해당된다. 대체 텍스트를 제공하지 않아야 하는 실버라이트 객체는 AutomationProperties 클래스를 이용한 Name 속성 및 LabeledBy 속성 등을 제공하지 않는다.

실버라이트 콘텐츠의 배경음 자동 실행 방지

실버라이트 콘텐츠가 로딩되면 자동적으로 재생되는 배경음은 그 재생을 멈출수 있는 컨트롤을 사용자가 빨리 발견할 수 있는 위치에 제공해야 한다.
실버라이트에서 멀티미디어 콘텐츠의 배경음을 제어할 수 있는 컨트롤을 제공하는 방법은 두 가지가 있다.

• 자동 재생 방지 실버라이트 동영상을 개발할 경우
  MediaElement.AutoPlay 속성을 이용하여 동영상의 자동 재생 여부를 지정한다. 기본 값은 MediaElement.AutoPlay 속성을 true로 설정하며 동영상을 자동 재생하도록 한다. 따라서 자동 재생을 방지하기 위해서는 MediaElement.AutoPlay 속성을 반드시 false로 설정해야 한다.
  다음 예는 애니메이션 동영상 파일(xbox.wmv)을 로딩하고 정지 상태로 제공하는 실버라이트 콘텐츠의 코딩 예다.
  

• 음소거
  동영상이 자동적으로 재생되더라도 배경음을 음소거 상태로 설정하여 재생음을 들리지 않도록 설정할 수 있다. 이를 위하여 MediaElement.IsMuted 속성을 true로 설정한다. 만일 MediaElement.IsMuted 속성을 지정하지 않거나 false로 설정한다면 항상 배경음을 제공하는 상태가 되므로 화면 낭독 프로그램 사용자에게 혼란을 주게 된다.
  다음 예는 애니메이션 동영상 파일(xbox.wmv)을 로딩하자마자 재생되나 음소거 상태로 제공되도록 MediaElement.IsMuted 속성을 설정한 실버라이트 콘텐츠의 코딩 예다.

   
  ...
  
  ...
  

실버라이트 플러그인의 키보드 접근 제공

실버라이트 플러그인 내의 컨트롤이 키보드 접근이 가능하도록 만들기 위해서는 플러그인으로 초점이 이동할 수 있도록 구현해야 한다. 만일 웹 페이지가 HTML 콘텐츠와 실버라이트 플러그인으로 구성되어 있다면 플러그인으로의 초점 이동이 가능하므로 실버라이트 플러그인의 키보드 접근이 가능하다. 그러나 웹 페이지를 하나의 실버라이트 플러그인으로 구성한다면 플러그인이 로딩될 시점에 초점이 플러그인의 첫 번째 컨트롤로 이동하도록 다음과 같이 구현해야 한다.

 
C# 버전:
LayoutRoot.Loaded += (sender, e) =>
System.Windows.Browser.HtmlPage.Plugin.Focus();

Visual Basic 버전:
AddHandler LayoutRoot.Loaded,
Sub()
System.Windows.Browser.HtmlPage.Plugin.Focus()
End Sub

실버라이트에서 키보드 내비게이션 순서 제공 방법

실버라이트 콘텐츠에서 컨트롤의 Tab 키 내비게이션 순서는 플래시 콘텐츠의 경우와 같이 콘텐츠를 설계할 때 컨트롤을 추가한 순서와 동일하다. 만일 컨트롤의 추가 순서를 달리하여 컨트롤의 키보드 내비게이션 순서를 변경할 경우 키보드 내비게이션 순서가 화면상의 이동 순서와 동일하도록 XAML를 변경하거나 모든 컨트롤의 TabIndex 값을 사용자가 설정해 주어야 한다. 예를 들어, 플래시 예와 같이 네 개의 입력상자(TextBox)를 2열로 배치하고 신랑의 이름과 성, 신부의 이름과 성의 순서로 입력상자 간의 키보드 내비게이션이 가능하도록 구현한 소스는 다음과 같다. 여기서 TabIndex 값을 생략하면 신랑의 이름, 신부의 이름, 신랑의 성, 신부의 성의 순서로 키보드 내비게이션이 일어난다.

 


 ...
 ...
 Groom
 Bride
 First name
 
 
 Last name
 
 

그외 참고

• 닫힌 실버라이트 자막 제공: http://www.silverlight.net/learn/quickstarts/accessibility/#MediaAndCaptioning
• 플래시, 실버라이트 콘텐츠의 대체 텍스트 평가 방법
  플래시, 실버라이트 등의 웹 애플리케이션을 구성하고 있는 사용자 인터페이스 자동화 요소들의 대체 텍스트는 UIA Verify와 같은 평가 도구를 이용하여 확인할 수 있다.
  
  

원문 링크

• Silverlight Accessibility Coding Practice
  http://blogs.msdn.com/b/mikezh/archive/2012/04/06/silverlight-accessibility-coding-practice.aspx
• Accessibility
  http://www.silverlight.net/learn/advanced-techniques/localization-and-accessibility/making-silverlight-applications-accessible
• Silverlight Accessibility for Developers
• http://msdn.microsoft.com/en-us/windows/gg591270