다음을 통해 공유

포용적인 Windows 앱 개발

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

아직 그렇게 하지 않은 경우 포용적인 소프트웨어 설계읽기 시작해 보세요.

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

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

프로그램적 접근

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

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

키보드 탐색

시각 장애가 있거나 이동성 문제가 있는 사용자의 경우 키보드로 UI를 탐색할 수 있는 것이 매우 중요합니다. 그러나 사용자 조작이 필요한 UI 컨트롤만 키보드 포커스를 제공해야 합니다. 정적 이미지와 같은 작업이 필요하지 않은 구성 요소는 키보드 포커스가 필요하지 않습니다.

마우스 또는 터치로 탐색하는 것과 달리 키보드 탐색은 선형이라는 점을 기억해야 합니다. 키보드 탐색을 고려할 때 사용자가 제품과 상호 작용하는 방법과 논리적 탐색이 무엇인지 생각해 보세요. 서양 문화에서 사람들은 왼쪽에서 오른쪽으로, 위에서 아래로 읽습니다. 따라서 키보드 탐색을 위해 이 패턴을 따르는 것이 일반적입니다.

키보드 탐색을 디자인할 때 UI를 검사하고 다음 질문에 대해 생각해 보세요.

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

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

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

또한 Engineering Software for Accessibility eBook에는 디자인이라는 제목의 이 주제에 대한 훌륭한 장이 있습니다.

색과 대비

Windows의 기본 제공 접근성 기능 중 하나는 컴퓨터 화면에서 텍스트와 이미지의 색 대비를 높이는 고대비 모드입니다. 어떤 사람들에게는 색의 대비를 높이면 눈의 제약이 줄어들고 읽기가 쉬워집니다. 고대비로 UI를 확인할 때 컨트롤이 일관되고 시스템 색(하드 코딩된 색이 아님)으로 코딩되었는지 확인하여 고대비를 사용하지 않는 사용자가 화면에 표시되는 모든 컨트롤을 볼 수 있는지 확인하려고 합니다.

XAML

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

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

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

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

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

색 대비 비율 – 미국 장애인법의 업데이트된 섹션 508과 다른 법률에서는 텍스트와 배경 사이의 기본 색 대비가 5:1이어야 합니다. 큰 텍스트(18포인트 글꼴 크기 또는 14포인트 및 굵게 표시)의 경우 필수 기본 대비는 3:1입니다.

색 조합 – 남성의 약 7%(여성의 1% 미만)에는 어떤 형태의 색 결핍이 있습니다. 색맹을 가진 사용자는 특정 색을 구별하는 데 문제가 있으므로 색만으로는 애플리케이션의 상태 또는 의미를 전달하는 데 사용되지 않는 것이 중요합니다. 장식 이미지(예: 아이콘 또는 배경)의 경우 색맹 사용자에 의해 이미지의 인식을 최대화하는 방식으로 색 조합을 선택해야 합니다.

접근성 검사 목록

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

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

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

  • Last updated on