접근성 개요

  • 아티클

이 문서는 Windows 앱의 접근성 시나리오와 관련된 개념 및 기술에 대한 개요입니다.

접근성 및 앱

이동성, 시각, 색 인식, 청력, 발화, 인지 및 문해력 관련 제약을 포함하여 많은 가능한 장애 또는 장애가 있습니다. 그러나 여기에 제공된 지침에 따라 대부분의 요구 사항을 해결할 수 있습니다. 즉, 다음을 제공합니다.

  • 키보드 조작 및 화면 읽기 프로그램 지원
  • 글꼴, 확대/축소 설정(배율), 색 및 고대비 설정과 같은 사용자 지정을 지원합니다.
  • UI의 일부에 대한 대안 또는 보완 사항입니다.

XAML용 컨트롤은 이미 UWP 앱, HTML 및 기타 UI 기술을 지원하는 접근성 프레임워크를 활용하는 화면 읽기 프로그램과 같은 보조 기술에 대한 빌트인 키보드 지원 및 지원을 제공합니다. 이 빌트인 지원을 사용하면 소수의 속성만 설정하여 거의 작업을 수행하지 않고도 사용자 지정을 하여 기본 수준의 접근성을 구축할 수 있습니다. 사용자가 고유의 사용자 지정 XAML 구성 요소 및 컨트롤을 만드는 경우, 자동화 피어의 개념을 사용하여 해당 컨트롤과 유사한 지원을 추가할 수 있습니다.

또한 데이터 바인딩, 스타일 및 템플릿 기능을 사용하면 동적 변경에 대한 지원을 쉽게 구현하여 대체 UI에 대한 설정 및 텍스트를 표시할 수 있습니다.

UI 자동화

접근성 지원은 주로 Microsoft UI 자동화 프레임워크에 대한 통합 지원에서 제공됩니다. 이러한 지원은 기본 클래스와 컨트롤 형식에 대한 클래스 구현의 빌트인 동작 및 UI 자동화 공급자 API의 인터페이스 표현을 통해 제공됩니다. 각 컨트롤 클래스는 UI 자동화 클라이언트에 컨트롤의 역할 및 콘텐츠를 보고하는 자동화 피어 및 자동화 패턴의 UI 자동화 개념을 사용합니다. 앱은 UI 자동화 최상위 창으로 처리되고 UI 자동화 프레임워크를 통해 해당 앱 창 내의 모든 접근성 관련 콘텐츠를 UI 자동화 클라이언트에서 사용할 수 있습니다. UI 자동화에 대한 자세한 내용은 UI 자동화 개요를 참조하세요.

보조 기술

사용자가 설치한 보조 기술 제품 또는 운영 체제에서 제공하는 도구 및 설정으로 많은 사용자 접근성 요구 사항이 충족됩니다. 여기에는 화면 읽기 프로그램, 화면 배율 및 고대비 설정과 같은 기능이 포함됩니다.

보조 기술 제품에는 다양한 소프트웨어 및 하드웨어가 포함됩니다. 이러한 제품은 화면 읽기 프로그램 및 기타 보조 기술에 UI의 콘텐츠 및 구조에 대한 정보를 보고하는 표준 키보드 인터페이스 및 접근성 프레임워크를 통해 작동합니다. 보조 기술 제품의 예는 다음과 같습니다.

  • 사용자가 키보드 대신 포인터를 사용하여 텍스트를 입력할 수 있도록 하는 화상 키보드입니다.
  • 발화된 단어를 입력된 텍스트로 변환하는 음성 인식 소프트웨어입니다.
  • 텍스트를 발화된 단어 또는 점자 같은 다른 형식으로 변환하는 화면 읽기 프로그램입니다.
  • 특히 Windows의 일부인 내레이터 화면 읽기 프로그램입니다. 내레이터에는 키보드가 사용 불가능할 때 터치 제스처를 처리하여 화면 읽기 작업을 수행할 수 있는 터치 모드가 있습니다.
  • 디스플레이 또는 영역을 조정하는 프로그램 또는 설정(예: 고대비 테마, 디스플레이의 dpi(인치당 도트 수) 설정 또는 돋보기 도구)입니다.

좋은 키보드 및 화면 읽기 프로그램 지원이 있는 앱은 일반적으로 다양한 보조 기술 제품에서 잘 작동합니다. 대부분의 경우 UWP 앱은 정보 또는 구조를 추가로 수정하지 않고도 이러한 제품에서 작동합니다. 그러나 최적의 접근성 경험을 위해 일부 설정을 수정하거나 추가 지원을 구현할 수 있습니다.

보조 기술로 기본 접근성 시나리오를 테스트하는 데 사용할 수 있는 몇몇 옵션은 접근성 테스트에 나열되어 있습니다.

화면 읽기 프로그램 지원 및 기본 접근성 정보

화면 읽기 프로그램은 음성 언어 또는 점자 출력과 같은 다른 형식으로 렌더링하여 앱에 있는 텍스트에 대한 액세스를 제공합니다. 화면 판독기의 정확한 동작은 소프트웨어 및 사용자의 소프트웨어 구성에 따라 달라집니다.

예를 들어 일부 화면 읽기 프로그램은 사용자가 보고 있는 앱을 시작하거나 전환할 때 전체 앱 UI를 읽습니다. 이를 통해 사용자는 탐색을 시도하기 전에 사용 가능한 모든 정보 콘텐츠를 받을 수 있습니다. 일부 화면 읽기 프로그램은 탭 탐색 중에 포커스를 받으면 개별 컨트롤과 연결된 텍스트를 읽습니다. 이렇게 하면 사용자가 애플리케이션의 입력 컨트롤 사이를 탐색할 때 방향을 설정할 수 있습니다. 내레이터는 사용자 선택에 따라 두 동작을 모두 제공하는 화면 읽기 프로그램의 예입니다.

사용자가 앱을 이해하거나 탐색하는 데 도움이 되도록 화면 읽기 프로그램 또는 기타 보조 기술에 필요한 가장 중요한 정보는 앱의 요소 부분에 대한 액세스 가능한 이름 입니다. 대부분의 경우, 컨트롤 또는 요소에는 사용자가 달리 제공한 다른 속성 값에서 계산된 액세스 가능한 이름이 이미 있습니다. 이미 계산된 이름을 사용할 수 있는 가장 일반적인 경우는 내부 텍스트를 지원하고 표시하는 요소의 경우입니다. 다른 요소의 경우, 요소 구조에 대한 모범 사례를 따라 액세스 가능한 이름을 제공하는 다른 방법을 고려해야 하는 경우가 있습니다. 또한 앱 접근성을 위해 접근성 있는 이름으로 명시적으로 의도된 이름을 제공해야 하는 경우도 있습니다. 일반적인 UI 요소에서 작동하는 이러한 계산 값의 수 목록과 일반적으로 액세스 가능한 이름에 대한 자세한 내용은 기본 접근성 정보 를 참조하세요.

사용할 수 있는 몇 가지 다른 자동화 속성(다음 섹션에서 설명하는 키보드 속성 포함)이 있습니다. 그러나 모든 화면 읽기 프로그램이 모든 자동화 속성을 지원하는 것은 아닙니다. 일반적으로 모든 적절한 자동화 속성을 설정하고 테스트하여 화면 읽기 프로그램을 위해 가능한 가장 광범위하게 지원을 제공해야 합니다.

키보드 지원

좋은 키보드 지원을 제공하려면, 애플리케이션의 모든 부분을 키보드로 사용할 수 있는지 확인해야 합니다. 앱이 표준 컨트롤 대부분을 사용하고 사용자 지정 컨트롤을 사용하지 않는 경우, 대부분의 방법은 이미 있는 것입니다. 기본 XAML 컨트롤 모델은 탭 탐색, 텍스트 입력 및 컨트롤 관련 지원을 비롯한 빌트인 키보드 지원을 제공합니다. 레이아웃 컨테이너(예: 패널)로 사용되는 요소는 레이아웃 순서를 사용하여 기본 탭 순서를 설정합니다. 해당 순서가 UI의 액세스 가능한 표현에 사용할 올바른 탭 순서일 때인 경우가 종종 있습니다. 만약 ListBox 및 GridView 컨트롤을 사용해 데이터를 표시하면, 빌트인 화살표 키 탐색을 제공합니다. 또는 버튼 컨트롤을 사용하는 경우, 활성화를 위해 이미 스페이스바나 Enter키를 처리합니다.

탭 순서 및 키 기반 활성화 또는 탐색을 포함하여 키보드 지원의 모든 측면에 대한 자세한 내용은 키보드 접근성을 참조하세요.

미디어 및 캡션

일반적으로 MediaElement 객체를 통해 시청각 미디어를 표시합니다. 미디어 재생을 제어하기 위해 MediaElement API를 사용할 수 있습니다. 접근성 목적으로, 필요에 따라 사용자가 미디어를 재생, 일시 중지 및 중지할 수 있는 컨트롤을 제공합니다. 때로는 내러티브 설명이 포함된 캡션 또는 대체 오디오 트랙과 같이 접근성을 위한 추가 구성 요소가 미디어에 포함되어 있습니다.

액세스 가능한 텍스트

텍스트의 세 가지 기본 측면은 접근성과 관련이 있습니다.

  • 텍스트를 탭 시퀀스 순회의 일부로 읽을지 아니면 전체 문서 표현의 일부로만 읽을 것인지를 도구에서 결정해야 합니다. 텍스트를 표시할 적절한 요소를 선택하거나 해당 텍스트 요소의 속성을 조정하여 이 결정을 제어할 수 있습니다. 각 텍스트 요소에는 특정 목적이 있으며, 해당 용도에는 해당하는 UI 자동화 역할이 있는 경우가 많습니다. 잘못된 요소를 사용하면 UI 자동화에 잘못된 역할을 보고하여 보조 기술 사용자에게 혼란스러운 경험을 제공할 수 있습니다.
  • 배경과 적절한 대조를 이루지 않는 한 텍스트가 읽기 어려워지는 시각적 제약을 갖고 있는 사용자가 많이 있습니다. 이것이 사용자에게 미치는 영향은 시각에 제약이 없는 앱 디자이너에게 직관적이지 않습니다. 예를 들어, 색맹인 사용자의 경우 디자인에서 색을 잘못 선택하면 일부 사용자는 텍스트를 읽지 못하게 됩니다. 원래 웹 콘텐츠에 대해 만들어진 접근성 권장 사항은 앱에서 이러한 문제를 방지할 수 있는 대비 표준을 정의합니다. 자세한 내용은 접근성 있는 텍스트 요구 사항을 참조하세요.
  • 텍스트가 너무 작아 읽는 데 어려움을 겪는 사용자가 많이 있습니다. 앱의 UI에 있는 텍스트를 처음부터 크게 만들어 이러한 문제를 방지할 수 있습니다. 그러나 많은 양의 텍스트를 표시하는 앱이나 다른 시각적 요소와 섞인 텍스트에서는 하기 어려운 일입니다. 이러한 경우, 디스플레이를 확장할 수 있는 시스템 기능과 앱이 적절히 상호 작용하여 앱의 모든 텍스트가 함께 확장되도록 합니다. (일부 사용자는 dpi 값을 접근성 옵션으로 변경하기도 합니다. 해당 옵션은 화면의 항목을 더 크게 만들기 가 있는 Ease of Access에서 사용 가능합니다. 이를 통해 리디렉션된 Control Panel UI는 모양 및 개인 설정 / 표시를 위한 것입니다.)

고대비 테마 지원

UI 컨트롤은 테마의 XAML 리소스 사전의 일부로 정의된 시각적 표현을 사용합니다. 시스템이 고대비로 설정된 경우에 특히 해당 테마를 한 개 이상 사용합니다. 리소스 사전에서 적절한 테마를 동적으로 조회하여 고대비로 사용자가 전환하면, 모든 UI 컨트롤도 적절한 고대비 테마를 사용합니다. 명시적 스타일을 지정하거나 고대비 테마가 스타일 변경 내용을 로드 및 재정의하지 못하도록 하는 다른 스타일 지정 기술을 사용하여 테마를 비활성화했는지 확인합니다. 자세한 내용은 고대비 테마를 참조하세요.

대체 UI를 위한 디자인

앱을 디자인할 때 앱을 사용하는 사용자가 이동성, 시각 및 청각에 제약이 있을 수 있다는 점을 고려합니다. 보조 기술 제품은 표준 UI를 광범위하게 사용하기 때문에, 접근성을 위해 조정을 하지 않더라도 좋은 키보드 및 화면 판독기 지원을 제공하는 것이 특히 중요합니다.

대부분의 경우 여러 기술을 사용하여 대상 그룹을 넓히면 필수 정보를 전달할 수 있습니다. 예를 들어 아이콘과 색상 정보를 모두 사용해 정보를 강조 표시하여 색맹인 사용자를 돕고, 청력이 손실되었거나 청각 장애로 듣는 데 어려움이 있는 사용자를 돕기 위해 음향 효과와 함께 시각적 경고를 같이 표시할 수 있습니다.

필요한 경우 불필요한 요소 및 애니메이션을 완전히 제거한 액세스 가능한 대체 인터페이스 요소를 제공하며, 다른 단순화를 추가 제공하여 사용자 경험을 간소화할 수 있습니다. 다음 코드 예제에서는 사용자 설정에 따라 UserControl 인스턴스를 다른 인스턴스 대신 표시하는 방법을 보여 줍니다.

XAML

<StackPanel x:Name="LayoutRoot" Background="White">

  <CheckBox x:Name="ShowAccessibleUICheckBox" Click="ShowAccessibleUICheckBox_Click">
    Show Accessible UI
  </CheckBox>

  <UserControl x:Name="ContentBlock">
    <local:ContentPage/>
  </UserControl>

</StackPanel>

Visual Basic

Private Sub ShowAccessibleUICheckBox_Click(ByVal sender As Object,
    ByVal e As RoutedEventArgs)

    If (ShowAccessibleUICheckBox.IsChecked.Value) Then
        ContentBlock.Content = New AccessibleContentPage()
    Else
        ContentBlock.Content = New ContentPage()
    End If
End Sub

C#

private void ShowAccessibleUICheckBox_Click(object sender, RoutedEventArgs e)
{
    if ((sender as CheckBox).IsChecked.Value)
    {
        ContentBlock.Content = new AccessibleContentPage();
    }
    else
    {
        ContentBlock.Content = new ContentPage();
    }
}

확인 및 게시

접근성 선언 및 앱 게시에 대한 자세한 내용은 스토에어서의 접근성을 참조하세요.

참고 항목

앱을 접근성이 있는 앱으로 선언하는 것은 Microsoft Store와만 관련이 있습니다.

사용자 지정 컨트롤의 보조 기술 지원

사용자 지정 컨트롤을 만들 때 접근성 지원을 제공하기 위해 하나 이상의 AutomationPeer 하위 클래스를 구현하거나 확장하는 것이 좋습니다. 몇몇 경우, 기본 컨트롤 클래스에서 사용한 것과 동일한 피어 클래스를 사용하는 한 파생 클래스에 대한 자동화 지원은 기본 수준에서 적합합니다. 그러나 이를 테스트해야 하며 피어가 새 컨트롤 클래스의 클래스 이름을 올바르게 보고할 수 있도록 피어를 구현하는 것이 여전히 모범 사례로 권장됩니다. 사용자 지정 자동화 피어 구현에는 몇 가지 단계가 수반됩니다. 자세한 내용은 사용자 지정 자동화 피어를 참조하세요.

XAML/Microsoft DirectX interop를 지원하는 앱의 보조 기술 지원

XAML에서 호스트되는 Microsoft DirectX 콘텐츠( SwapChainPanel 또는 SurfaceImageSource)는 기본적으로 액세스 불가능합니다. 이 XAML SwapChainPanel DirectX interop 샘플 은 호스트된 DirectX 콘텐츠에 대한 UI 자동화 피어를 만드는 방법을 보여줍니다. 이 기술을 사용하면 UI 자동화를 통해 호스트된 콘텐츠에 액세스할 수 있습니다.

예제

팁

WinUI 3 갤러리 앱을 열고 작동 중인 다음 접근성 원칙을 참조하세요.

WinUI 3 갤러리 앱에는 대부분의 WinUI 3 컨트롤, 특징, 기능의 대화형 예제가 포함되어 있습니다. 앱을 Microsoft Store 에서 다운로드하거나 GitHub에서 소스 코드를 가져오세요.