다음을 통해 공유

포괄 Windows 앱 개발

  • 아티클

이 문서에서는 액세스할 수 있는 Windows 앱을 개발하는 방법을 설명합니다. 특히 앱에 대한 논리적 계층 구조를 디자인하는 방법을 이해한다고 가정합니다. 키보드 탐색, 색 및 대비 설정, 그리고 보조 기술에 대한 지원 기능을 포함하는 액세스 가능한 Windows 앱 개발 방법을 알아봅니다.

아직 그렇게 하지 않은 경우, 먼저 포괄 소프트웨어 설계를 읽어 보세요.

앱에 액세스할 수 있도록 하려면 다음 세 가지 작업을 수행해야 합니다.

  1. UI 요소를 프로그래밍 액세스에 노출합니다.
  2. 마우스나 터치스크린을 사용할 수 없는 사용자를 위해 앱에서 키보드 탐색 을 지원하는지 확인합니다.
  3. 앱에서 액세스 가능한 색상 및 대비 설정을 지원하는지 확인합니다.

프로그래밍 액세스

프로그래밍 방식 액세스는 앱에서 접근성을 만드는 데 중요합니다. 앱의 콘텐츠 및 대화형 UI 요소에 액세스 가능한 이름(필수) 및 설명(옵션)을 설정하여 확보할 수 있습니다. 이렇게 하면 화면 읽기 프로그램(예: 내레이터) 또는 대체 출력 디바이스(예: 점자 표시)와 같은 AT(보조 기술)에 UI 컨트롤이 노출됩니다. 프로그래밍 방식 액세스가 없으면 보조 기술용 API가 정보를 올바르게 해석할 수 없으므로 사용자가 제품을 충분히 사용할 수 없게 되거나 AT에서 접근성 인터페이스로 사용되어서는 안 되는 기술이나 문서화되지 않은 프로그래밍 인터페이스를 사용하게 됩니다. UI 컨트롤이 보조 기술에 노출되면 AT는 사용자가 사용할 수 있는 작업 및 옵션을 확인할 수 있습니다.

AT(보조 기술)에서 앱 UI 요소를 사용할 수 있도록 하는 방법에 대한 자세한 내용은 기본 접근성 정보 노출을 참조하세요.

키보드 탐색

시각 장애가 있거나 거동이 불편한 사용자의 경우 키보드를 사용한 UI 탐색이 매우 중요 합니다. 그러나 작동하기 위해 사용자 조작이 필요한 UI 컨트롤에만 키보드 포커스를 부여해야 합니다. 정적 이미지와 같이 동작이 필요하지 않은 구성 요소에는 키보드 포커스가 필요하지 않습니다.

마우스나 터치를 사용한 탐색과 달리 키보드 탐색은 선형이라는 점을 기억하십시오. 키보드 탐색을 고려한다면 사용자가 제품과 어떻게 상호 작용할 것인지, 어떤 논리적 탐색이 이루어지는지 고려해야 합니다. 서양 문화권에서는 왼쪽에서 오른쪽으로, 위에서 아래로 읽습니다. 따라서 키보드 탐색에서 이 패턴을 따르는 것이 일반적입니다.

키보드 탐색을 설계할 때 UI를 검토하고 다음의 질문에 대해 생각해 보세요.

  • UI에서 컨트롤이 어떻게 배치되거나 그룹화되나요?
  • 중요한 컨트롤 그룹이 있나요?
    • 그렇다면 해당 그룹에 다른 차원의 그룹이 포함되어 있나요?
  • 피어 컨트롤 중에서 탭으로 이동하거나 특수 탐색(예: 화살표 키) 또는 두 방법 모두를 통해 탐색을 수행해야 하나요?

목표는 사용자가 UI의 레이아웃 방식을 이해하고 실행 가능한 컨트롤을 식별할 수 있도록 도움을 주는 것입니다. 사용자가 탐색 루프를 완료하기 전에 탭 중단이 너무 자주 발생한다면 관련 컨트롤을 함께 그룹화하는 것이 좋습니다. 하이브리드 컨트롤과 같이 몇몇 연관된 컨트롤은 초기 탐색 단계에서 해결해야 하는 경우가 많습니다. 제품을 개발하기 시작한 이후에는 키보드 탐색을 다시 작업하기 어렵기 때문에 신중하고 신속하게 계획하세요.

UI 요소 간의 키보드 탐색에 대한 자세한 내용은 키보드 접근성을 참조하세요.

또한 접근성을 위한 엔지니어링 소프트웨어 eBook에 논리 계층 구조 디자인이라는 주제로 아주 잘 설명한 챕터가 있습니다.

색과 대비

Windows에 내장된 접근성 옵션 기능 중 하나인 고대비 모드는 컴퓨터 화면에서 텍스트 및 이미지의 색 대비를 높입니다. 사용자에 따라 색 대비를 높이면 눈의 피로감이 줄고 더 편하게 읽을 수 있습니다. UI를 고대비로 확인하는 경우 고대비를 사용하지 않는 사용자가 보는 화면에서도 모든 컨트롤이 표시되도록 컨트롤이 시스템 색상(하드 코딩된 색이 아님)과 일관되게 코딩되었는지 확인하는 것이 좋습니다.

XAML

<Button Background="{ThemeResource ButtonBackgroundThemeBrush}">OK</Button>

시스템 색 및 리소스 사용에 대한 자세한 내용은 XAML 테마 리소스를 참조하세요.

시스템 색을 재정의하지 않은 한 UWP 앱은 기본적으로 고대비 테마를 지원합니다. 사용자가 디바이스의 시스템 설정 또는 접근성 도구에서 고대비 테마를 사용하도록 선택한 경우, UWP 프레임워크는 UI의 컨트롤과 구성 요소에 대한 고대비 레이아웃과 렌더링을 생성하는 색상과 스타일 설정을 자동으로 사용합니다.

자세한 내용은 고대비 테마를 참조하세요.

시스템 색상 대신 고유한 색상 테마를 사용하기로 결정한 경우 다음 지침을 고려하십시오.

색 대비 비율: 개정된 미국장애인법 제508조 및 기타 법률에 따르면 텍스트와 배경 간 기본 색 대비는 5:1 이상이어야 합니다. 큰 텍스트(글꼴 크기 18 포인트 또는 14포인트에 볼드체 표시)의 경우 필수 기본 대비는 3:1입니다.

색 조합: 남성의 약 7%(여성의 경우 1% 미만)이 여러 형태의 색맹 장애를 가지고 있습니다. 색맹 증세를 가진 사용자는 특정 색을 구별하는 데 어려움이 있기 때문에 애플리케이션에서 오직 색상만으로 상태나 의미를 전달하면 안 됩니다. 색맹 증세를 가진 사용자가 이미지를 최대한 인식할 수 있는 방식으로 아이콘, 배경 등의 장식용 이미지의 색 조합을 선택해야 합니다.

접근성 검사 목록

다음은 접근성 검사 목록의 약어 버전입니다.

  1. 앱의 콘텐츠 및 대화형 UI 요소에 액세스 가능한 이름(필수) 및 설명(옵션)을 설정합니다.
  2. 키보드 접근성을 구현합니다.
  3. UI를 시각적으로 확인하여 텍스트 대비가 적절하고, 요소가 고대비 테마에서 정확하게 렌더링되고, 색이 바르게 사용되었는지 확인합니다.
  4. 접근성 도구를 실행하고, 보고된 문제를 해결하며, 화면 읽기 환경을 확인합니다. (접근성 테스트 항목을 참조하세요.)
  5. 앱 매니페스트 설정이 접근성 지침을 따르는지 확인합니다.
  6. Microsoft Store에 액세스 가능한 앱을 선언합니다. (참조할 섹션은 스토어에서의 접근성 입니다.)

자세한 내용은 전체 접근성 검사 목록 항목을 참조하세요.