의미 체계 속성을 사용하여 접근성 있는 앱 빌드

아티클
02/13/2024

접근성에 대한 의미 체계는 다양한 환경에서 기술을 사용하고 다양한 요구 사항과 환경으로 UI에 접근하는 사람들을 위해 앱을 포괄하는 환경을 구축하는 것과 관련이 있습니다. 대부분의 경우 접근성에 대한 법적 요구 사항은 개발자가 접근성 문제를 해결할 수 있는 원동력이 될 수 있습니다. 그럼에도 불구하고 앱이 가능한 가장 큰 대상 그룹에 도달할 수 있도록 포괄적이고 액세스 가능한 앱을 빌드하는 것이 좋습니다.

WCAG(웹 콘텐츠 접근성 지침)는 웹 및 모바일에 대한 글로벌 접근성 표준 및 법적 벤치마크입니다. 이러한 지침은 모든 앱이 더 인지 가능하고, 작동 가능하고, 이해할 수 있고, 견고하게 만들 수 있는 다양한 방법을 설명합니다.

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

화면 읽기 프로그램은 일반적으로 화면에 표시되는 컨트롤에 대한 청각적 설명을 제공합니다. 이러한 설명은 사용자가 앱을 탐색하고 입력이나 텍스트가 없는 이미지와 같은 컨트롤에 대한 참조를 제공하는 데 도움이 됩니다. 화면 읽기 프로그램은 터치 스크린, 트랙 패드 또는 키보드의 제스처를 통해 제어되는 경우가 많습니다. 화면 읽기 프로그램을 사용하도록 설정하는 방법에 대한 자세한 내용은 화면 읽기 프로그램 사용을 참조 하세요.

운영 체제에는 고유한 동작 및 구성을 갖춘 자체 화면 읽기 프로그램이 있습니다. 예를 들어 대부분의 화면 읽기 프로그램은 포커스를 받을 때 컨트롤과 연결된 텍스트를 읽어 사용자가 앱을 탐색할 때 방향을 지정할 수 있도록 합니다. 그러나 일부 화면 읽기 프로그램은 페이지가 표시될 때 전체 앱 사용자 인터페이스를 읽을 수 있으므로 탐색을 시도하기 전에 사용자가 페이지의 사용 가능한 모든 정보 콘텐츠를 받을 수 있습니다.

대부분의 화면 읽기 프로그램은 접근성 포커스를 수신하는 컨트롤과 연결된 텍스트를 자동으로 읽습니다. 즉, 속성 집합이 있는 컨트롤(예: Label 사용자ButtonText)에 액세스할 수 있습니다. 그러나 Image, ImageButton, ActivityIndicator 등은 연결된 텍스트가 없으므로 접근성 트리에 없을 수 있습니다.

.NET 다중 플랫폼 앱 UI(.NET MAUI)는 기본 플랫폼의 접근성 환경에 대한 액세스를 제공하는 두 가지 방법을 지원합니다. 의미 체계 속성 은 앱에서 접근성 값을 제공하는 .NET MAUI 접근 방식이며 권장되는 방법입니다. 자동화 속성 은 앱에서 접근성 값을 제공하는 Xamarin.Forms 접근 방식이며 의미 체계 속성으로 대체되었습니다. 두 경우 모두 컨트롤의 기본 접근성 순서는 XAML에 나열되거나 레이아웃에 추가되는 순서와 동일합니다. 그러나 레이아웃이 다르면 접근성 순서에 영향을 주는 추가 요소가 있을 수 있습니다. 예를 들어 접근성 순서 StackLayout 도 방향을 기반으로 하며, 접근성 순서 Grid 는 행과 열 정렬을 기반으로 합니다. 콘텐츠 순서 지정에 대한 자세한 내용은 Xamarin 블로그에서 의미 있는 콘텐츠 순서 지정을 참조하세요.

참고 항목

WebView 액세스할 수 있는 웹 사이트가 표시되면 .NET MAUI 앱에서도 액세스할 수 있습니다. 반대로 액세스할 수 없는 웹 사이트가 표시되면 WebView .NET MAUI 앱에서 액세스할 수 없습니다.

의미 체계 속성

의미 체계 속성은 접근성 포커스를 받아야 하는 컨트롤과 사용자에게 소리 내어 읽어야 하는 텍스트에 대한 정보를 정의하는 데 사용됩니다. 의미 체계 속성은 기본 플랫폼 접근성 API를 설정하기 위해 모든 요소에 추가할 수 있는 연결된 속성입니다.

Important

의미 체계 속성은 각 플랫폼에서 동일한 동작을 강제로 시도하지 않습니다. 대신 각 플랫폼에서 제공하는 접근성 환경을 사용합니다.

클래스는 SemanticProperties 다음과 같은 연결된 속성을 정의합니다.

Description- 화면 읽기 프로그램에서 소리 내어 읽을 설명을 나타내는 형식 string입니다. 자세한 내용은 설명을 참조 하세요.
Hint와 유사Description하지만 컨트롤의 목적과 같은 추가 컨텍스트를 제공하는 형식string의 입니다. 자세한 내용은 힌트를 참조하세요.
HeadingLevel- 요소를 제목으로 표시하여 UI를 구성하고 더 쉽게 탐색할 수 있도록 하는 형식 SemanticHeadingLevel입니다. 자세한 내용은 제목 수준을 참조 하세요.

이러한 연결된 속성은 화면 판독기에서 요소에 대해 말할 수 있도록 플랫폼 접근성 값을 설정합니다. 연결된 속성에 대한 자세한 내용은 연결된 속성을 참조 하세요.

설명

연결된 속성은 Description 화면 읽기 프로그램에서 요소를 알리는 데 사용하는 짧고 설명적인 string 속성을 나타냅니다. 콘텐츠를 이해하거나 사용자 인터페이스와 상호 작용하는 데 중요한 의미가 있는 요소에 대해 이 속성을 설정해야 합니다. 이 속성 설정은 XAML에서 수행할 수 있습니다.

<Image Source="dotnet_bot.png"
       SemanticProperties.Description="Cute dot net bot waving hi to you!" />

또는 C#에서 설정할 수 있습니다.

Image image = new Image { Source = "dotnet_bot.png" };
SemanticProperties.SetDescription(image, "Cute dot net bot waving hi to you!");

또한 이 메서드를 SetValue 사용하여 연결된 속성을 설정할 Description 수도 있습니다.

image.SetValue(SemanticProperties.DescriptionProperty, "Cute dot net bot waving hi to you!");

요소에 대한 접근성 정보는 다른 요소에서도 정의할 수 있습니다. 예를 들어 Switch 옆에 있는 Label은 Switch가 나타내는 것을 설명하는 데 사용할 수 있습니다. 이렇게 하면 다음과 같이 XAML로 수행할 수 있습니다.

<Label x:Name="label"
       Text="Enable dark mode: " />
<Switch SemanticProperties.Description="{Binding Source={x:Reference label} Path=Text}" />

또는 다음과 같이 C#에서 설정할 수 있습니다.

Label label = new Label
{
    Text = "Enable dark mode: "
};
Switch mySwitch = new Switch();
SemanticProperties.SetDescription(mySwitch, label.Text);

Warning

에 Description 연결된 속성을 Label설정하지 마십시오. 그러면 화면 읽기 프로그램에서 Text 말하는 속성이 중지됩니다. 시각적 개체 텍스트가 화면 읽기 프로그램에서 소리 내어 읽은 텍스트와 이상적으로 일치해야 하므로 이 때문입니다.
Android 또는 Editor Android에서 DescriptionEntry 연결된 속성을 설정하지 않습니다. 이렇게 하면 Talkback 작업이 작동하지 않습니다. 대신 속성 또는 Hint 연결된 속성을 사용합니다Placeholder.
iOS에서 자식이 있는 컨트롤에 속성을 설정 Description 하면 화면 읽기 프로그램이 자식에 연결할 수 없습니다. iOS는 부모 요소에서 자식 요소로의 탐색을 허용하는 접근성 기능을 제공하지 않기 때문입니다.

힌트

연결된 속성은 Hint 컨트롤의 용도와 같이 연결된 속성에 Description 대한 추가 컨텍스트를 제공하는 속성을 나타냅니다string. 이 속성 설정은 XAML에서 수행할 수 있습니다.

<Image Source="like.png"
       SemanticProperties.Description="Like"
       SemanticProperties.Hint="Like this post." />

또는 C#에서 설정할 수 있습니다.

Image image = new Image { Source = "like.png" };
SemanticProperties.SetDescription(image, "Like");
SemanticProperties.SetHint(image, "Like this post.");

또한 이 메서드를 SetValue 사용하여 연결된 속성을 설정할 Hint 수도 있습니다.

image.SetValue(SemanticProperties.HintProperty, "Like this post.");

Android에서 이 속성은 연결된 컨트롤에 따라 약간 다르게 동작합니다. 예를 들어 텍스트 값이 없는 컨트롤의 CheckBox경우 컨트롤 Switch 은 컨트롤과 함께 힌트를 표시합니다. 그러나 텍스트 값이 있는 컨트롤의 경우 힌트가 표시되지 않고 텍스트 값 이후에 읽혀집니다.

Warning

속성이 Hint Android의 Entry.Placeholder 속성과 충돌하며, 둘 다 동일한 플랫폼 속성에 매핑됩니다. 따라서 다른 Hint 값을 값으로 Entry.Placeholder 설정하는 것은 권장되지 않습니다.

제목 수준

HeadingLevel 연결된 속성을 사용하면 요소를 제목으로 표시하여 UI를 구성하고 더 쉽게 탐색할 수 있습니다. 일부 화면 읽기 프로그램을 사용하면 사용자가 제목 사이를 빠르게 이동할 수 있습니다.

머리글의 수준은 1에서 9 사이이며 멤버를 SemanticHeadingLevel 통해 정의하는 NoneLevel1Level9 열거형으로 표시됩니다.

Important

Windows는 9개 수준의 제목을 제공하지만 Android 및 iOS는 단일 제목만 제공합니다. 따라서 HeadingLevel Windows에서 설정되면 올바른 제목 수준에 매핑됩니다. 그러나 Android 및 iOS에서 설정하면 단일 제목 수준에 매핑됩니다.

다음 예제에서는 이 연결된 속성을 설정하는 방법을 보여 줍니다.

<Label Text="Get started with .NET MAUI"
       SemanticProperties.HeadingLevel="Level1" />
<Label Text="Paragraphs of text go here." />
<Label Text="Installation"
       SemanticProperties.HeadingLevel="Level2" />
<Label Text="Paragraphs of text go here." />    
<Label Text="Build your first app"
       SemanticProperties.HeadingLevel="Level3" />
<Label Text="Paragraphs of text go here." />     
<Label Text="Publish your app"
       SemanticProperties.HeadingLevel="Level4" />
<Label Text="Paragraphs of text go here." />

또는 C#에서 설정할 수 있습니다.

Label label1 = new Label { Text = "Get started with .NET MAUI" };
Label label2 = new Label { Text = "Paragraphs of text go here." };
Label label3 = new Label { Text = "Installation" };
Label label4 = new Label { Text = "Paragraphs of text go here." };
Label label5 = new Label { Text = "Build your first app" };
Label label6 = new Label { Text = "Paragraphs of text go here." };
Label label7 = new Label { Text = "Publish your app" };
Label label8 = new Label { Text = "Paragraphs of text go here." };
SemanticProperties.SetHeadingLevel(label1, SemanticHeadingLevel.Level1);
SemanticProperties.SetHeadingLevel(label3, SemanticHeadingLevel.Level1);
SemanticProperties.SetHeadingLevel(label5, SemanticHeadingLevel.Level1);
SemanticProperties.SetHeadingLevel(label7, SemanticHeadingLevel.Level1);

또한 이 메서드를 SetValue 사용하여 연결된 속성을 설정할 HeadingLevel 수도 있습니다.

label1.SetValue(SemanticProperties.HeadingLevelProperty, SemanticHeadingLevel.Level1);

의미 체계 포커스

컨트롤에는 화면 판독기 포커스를 SetSemanticFocus 지정된 요소로 강제 적용하는 확장 메서드가 있습니다. 예를 들어 명명된 Label 화면 label읽기 프로그램 포커스가 다음 코드를 사용하여 요소에 강제로 적용될 수 있습니다.

label.SetSemanticFocus();

.NET MAUI는 ISemanticScreenReader 사용자에게 텍스트를 알리도록 화면 읽기 프로그램을 지시할 수 있는 인터페이스를 제공합니다. 인터페이스는 속성을 통해 Default 노출되며 네임스페이 Microsoft.Maui.Accessibility 스에서 사용할 수 있습니다.

화면 읽기 프로그램에서 텍스트를 알리도록 지시하려면 이 메서드를 Announce 사용하여 텍스트를 나타내는 인수를 string 전달합니다. 다음 예제에서는 이 메서드를 사용하는 방법을 보여 줍니다.

SemanticScreenReader.Default.Announce("This is the announcement text.");

제한 사항

텍스트를 소리 내어 읽으려면 기본 플랫폼 화면 읽기 프로그램을 사용하도록 설정해야 합니다.

자동화 속성

Automation 속성은 요소가 기본 플랫폼의 접근성 프레임워크에 보고되는 방식을 나타내기 위해 모든 요소에 추가할 수 있는 연결된 속성입니다.

클래스는 AutomationProperties 다음과 같은 연결된 속성을 정의합니다.

ExcludedWithChildren형식 bool?의 은 요소와 해당 자식을 접근성 트리에서 제외해야 하는지 여부를 결정합니다. 자세한 내용은 ExcludedWithChildren를 참조 하세요.
IsInAccessibleTree형식 bool?의 는 접근성 트리에서 요소를 사용할 수 있는지 여부를 나타냅니다. 자세한 내용은 IsInAccessibleTree를 참조 하세요.
Name형식 string의 는 해당 요소에 대해 말할 수 있는 식별자로 사용되는 요소에 대한 간단한 설명을 나타냅니다. 자세한 내용은 이름을 참조 하세요.
HelpText형식 string의 는 요소에 대한 더 긴 설명을 나타내며 요소와 연결된 도구 설명 텍스트로 간주할 수 있습니다. 자세한 내용은 HelpText를 참조하세요.
LabeledBy다른 요소가 현재 요소에 대한 접근성 정보를 정의할 수 있도록 하는 형식 VisualElement의 입니다. 자세한 내용은 LabeledBy를 참조 하세요.

화면 읽기 프로그램이 서로 다른 접근성 값을 읽습니다. 따라서 자동화 속성을 사용하는 경우 최적의 환경을 보장하기 위해 각 플랫폼에서 철저한 접근성 테스트를 수행하는 것이 좋습니다.

Important

자동화 속성은 앱에서 접근성 값을 제공하는 Xamarin.Forms 접근 방식이며 의미 체계 속성으로 대체되었습니다. 의미 체계 속성에 대한 자세한 내용은 의미 체계 속성을 참조 하세요.

ExcludedWithChildren

형식bool?의 연결된 속성은 ExcludedWithChildren 요소와 해당 자식을 접근성 트리에서 제외해야 하는지 여부를 결정합니다. 이렇게 하면 접근성 트리가 표시되지 않을 때 접근성 트리에서 제외되는 것과 같은 StackLayout StackLayout 다른 레이아웃을 표시하는 AbsoluteLayout 등의 시나리오를 사용할 수 있습니다. XAML에서 다음과 같이 사용할 수 있습니다.

<StackLayout AutomationProperties.ExcludedWithChildren="true">
...
</StackLayout>

또는 다음과 같이 C#에서 설정할 수 있습니다.

StackLayout stackLayout = new StackLayout();
...
AutomationProperties.SetExcludedWithChildren(stackLayout, true);

이 연결된 속성이 설정되면 .NET MAUI는 연결된 속성을 false 지정된 요소와 해당 자식에 대해 설정합니다IsInAccessibleTree.

IsInAccessibleTree

Warning

이 연결된 속성은 일반적으로 다시 설정되지 기본 합니다. 대부분의 컨트롤은 접근성 트리에 있어야 하며, 요소와 AutomationProperties.ExcludedWithChildren 해당 자식이 접근성 트리에서 제거해야 하는 시나리오에서 연결된 속성을 설정할 수 있습니다.

형식bool?의 연결된 속성은 IsInAccessibleTree 요소가 화면 판독기에서 표시되는지 여부를 결정합니다. 다른 자동화 속성을 사용하도록 설정 true 해야 합니다. 이렇게 하면 다음과 같이 XAML로 수행할 수 있습니다.

<Entry AutomationProperties.IsInAccessibleTree="true" />

또는 다음과 같이 C#에서 설정할 수 있습니다.

Entry entry = new Entry();
AutomationProperties.SetIsInAccessibleTree(entry, true);

Warning

iOS에서 속성이 IsInAccessibleTreetrue 자식이 있는 컨트롤에 있으면 화면 읽기 프로그램이 자식에 연결할 수 없습니다. iOS는 부모 요소에서 자식 요소로의 탐색을 허용하는 접근성 기능을 제공하지 않기 때문입니다.

이름

Important

Name 연결된 속성은 .NET 8에서 더 이상 사용되지 않습니다. 대신 연결된 속성을 사용합니다 Description .

Name 연결된 속성 값은 화면 판독기가 요소를 발표하는 데 사용하는 설명이 포함된 짧은 텍스트 문자열이어야 합니다. 콘텐츠를 이해하거나 사용자 인터페이스와 상호 작용하는 데 중요한 의미가 있는 요소에 대해 이 속성을 설정해야 합니다. 이렇게 하면 다음과 같이 XAML로 수행할 수 있습니다.

<ActivityIndicator AutomationProperties.IsInAccessibleTree="true"
                   AutomationProperties.Name="Progress indicator" />

또는 다음과 같이 C#에서 설정할 수 있습니다.

ActivityIndicator activityIndicator = new ActivityIndicator();
AutomationProperties.SetIsInAccessibleTree(activityIndicator, true);
AutomationProperties.SetName(activityIndicator, "Progress indicator");

HelpText

Important

HelpText 연결된 속성은 .NET 8에서 더 이상 사용되지 않습니다. 대신 연결된 속성을 사용합니다 Hint .

HelpText 연결된 속성을 사용자 인터페이스 요소를 설명하는 텍스트로 설정해야 하며, 요소와 연결된 도구 설명 텍스트로 간주할 수 있습니다. 이렇게 하면 다음과 같이 XAML로 수행할 수 있습니다.

<Button Text="Toggle ActivityIndicator"
        AutomationProperties.IsInAccessibleTree="true"
        AutomationProperties.HelpText="Tap to toggle the activity indicator" />

또는 다음과 같이 C#에서 설정할 수 있습니다.

Button button = new Button { Text = "Toggle ActivityIndicator" };
AutomationProperties.SetIsInAccessibleTree(button, true);
AutomationProperties.SetHelpText(button, "Tap to toggle the activity indicator");

일부 플랫폼에서는 Entry과 같은 편집 컨트롤을 위해 HelpText 속성을 경우에 따라 생략하고 자리 표시자 텍스트로 바꿀 수 있습니다. 예를 들어 "여기에 이름 입력"은 사용자가 실제로 입력하기 전에 컨트롤에 텍스트를 배치하는 Entry.Placeholder 속성의 좋은 후보입니다.

LabeledBy

Important

LabeledBy 연결된 속성은 .NET 8에서 더 이상 사용되지 않습니다. 대신 바인딩을 SemanticProperties.Description 사용합니다. 자세한 내용은 SemanticProperties: 설명을 참조하세요.

LabeledBy 연결된 속성은 다른 요소가 현재 요소에 대한 액세스 가능성 정보를 정의하게 할 수 있습니다. 예를 들어 Entry 옆에 있는 Label은 Entry가 나타내는 것을 설명하는 데 사용할 수 있습니다. 이렇게 하면 다음과 같이 XAML로 수행할 수 있습니다.

<Label x:Name="label" Text="Enter your name: " />
<Entry AutomationProperties.IsInAccessibleTree="true"
       AutomationProperties.LabeledBy="{x:Reference label}" />

또는 다음과 같이 C#에서 설정할 수 있습니다.

Label label = new Label { Text = "Enter your name: " };
Entry entry = new Entry();
AutomationProperties.SetIsInAccessibleTree(entry, true);
AutomationProperties.SetLabeledBy(entry, label);

Important

AutomationProperties.LabeledByProperty iOS에서는 지원되지 않습니다.

접근성 테스트

.NET MAUI 앱은 일반적으로 여러 플랫폼을 대상으로 합니다. 즉, 플랫폼에 따라 접근성 기능을 테스트합니다. 각 플랫폼에서 접근성을 테스트하는 방법을 알아보려면 아래 링크를 참조하세요.

다음 도구는 접근성 테스트를 지원할 수 있습니다.

그러나 이러한 도구 중 어느 것도 화면 읽기 프로그램 사용자 환경을 완벽하게 에뮬레이트할 수 없으며, 접근성을 위해 앱을 테스트하고 문제를 해결하는 가장 좋은 방법은 항상 화면 읽기 프로그램을 사용하는 물리적 디바이스에서 수동으로 수행됩니다.

화면 읽기 프로그램 사용

각 플랫폼에는 접근성 값을 내레이션하는 다른 기본 화면 읽기 프로그램이 있습니다.

Android에는 TalkBack이 있습니다. TalkBack을 사용하도록 설정하는 방법에 대한 자세한 내용은 TalkBack 사용을 참조 하세요.
iOS 및 macOS에는 VoiceOver가 있습니다. VoiceOver를 사용하도록 설정하는 방법에 대한 자세한 내용은 VoiceOver 사용을 참조 하세요.
Windows에는 내레이터가 있습니다. 내레이터를 사용하도록 설정하는 방법에 대한 자세한 내용은 내레이터 사용을 참조 하세요.

TalkBack 사용

TalkBack은 Android에서 사용되는 기본 화면 읽기 프로그램입니다. 사용하도록 설정하는 방법은 디바이스 제조업체, Android 버전 및 TalkBack 버전에 따라 달라집니다. 그러나 일반적으로 디바이스 설정을 통해 Android 디바이스에서 TalkBack을 사용하도록 설정할 수 있습니다.

설정 앱을 엽니다.
접근성>TalkBack을 선택합니다.
TalkBack 사용을 켭니다.
확인을 선택합니다.

참고 항목

이러한 단계는 대부분의 디바이스에 적용되지만 몇 가지 차이점이 발생할 수 있습니다.

TalkBack을 처음 사용하도록 설정하면 TalkBack 자습서가 자동으로 열립니다.

TalkBack을 사용하도록 설정하는 다른 방법은 Talkback 설정 또는 해제를 참조 하세요.

VoiceOver 사용

VoiceOver는 iOS 및 macOS에서 사용되는 기본 화면 읽기 프로그램입니다. iOS에서 VoiceOver는 다음과 같이 사용하도록 설정할 수 있습니다.

설정 앱을 엽니다.
접근성>VoiceOver를 선택합니다.
VoiceOver를 켭니다.

VoiceOver를 사용하도록 설정하면 VoiceOver 연습을 선택하여 VoiceOver 자습서를 열 수 있습니다.

VoiceOver를 사용하도록 설정하는 다른 방법은 i전화에서 VoiceOver 켜기 및 연습 및 iPad에서 VoiceOver를 켜고 연습하는 방법을 참조하세요.

macOS에서 VoiceOver는 다음과 같이 사용하도록 설정할 수 있습니다.

시스템 기본 설정을 엽니다.
접근성>VoiceOver를 선택합니다.
VoiceOver 사용을 선택합니다.
VoiceOver 사용을 선택합니다.

VoiceOver 자습서는 VoiceOver 교육 열기를 선택하여 열 수 있습니다.

VoiceOver를 사용하도록 설정하는 다른 방법은 Mac에서 VoiceOver 켜기 또는 끄기를 참조 하세요.

내레이터 사용

내레이터는 Windows에서 사용되는 기본 화면 읽기 프로그램입니다. Windows 로고 키 + Ctrl + Enter를 함께 눌러 내레이터를 사용하도록 설정할 수 있습니다. 이러한 키를 다시 눌러 내레이터를 중지할 수 있습니다.

내레이터에 대한 자세한 내용은 내레이터에 대한 전체 가이드를 참조 하세요.

접근성 검사 목록

다음 팁을 따라 가능한 가장 많은 사용자가 .NET MAUI 앱에 액세스할 수 있도록 합니다.

WCAG(웹 콘텐츠 접근성 지침)에 따라 앱이 인식 가능하고, 작동 가능하고, 이해할 수 있고, 강력해야 합니다. WCAG는 웹 및 모바일에 대한 글로벌 접근성 표준 및 법적 벤치마크입니다. 자세한 내용은 WCAG(웹 콘텐츠 접근성 지침) 개요를 참조 하세요.
사용자 인터페이스가 자체 설명되어 있는지 확인합니다. 사용자 인터페이스의 모든 요소가 화면 읽기 프로그램에서 액세스할 수 있는지 테스트합니다. 필요한 경우 설명 텍스트와 힌트를 추가합니다.
이미지와 아이콘에 대체 텍스트 설명이 있는지 확인합니다.
큰 글꼴과 고대비를 지원합니다. 컨트롤 차원의 하드코딩을 방지하고 더 큰 글꼴 크기를 수용하도록 크기를 조정하는 레이아웃을 선호합니다. 고대비 모드에서 색 구성표를 테스트하여 읽을 수 있는지 확인합니다.
탐색을 염두에 두고 시각적 트리를 디자인합니다. 적절한 레이아웃 컨트롤을 사용하면 대체 입력 메서드를 사용하는 컨트롤 간 탐색이 터치 사용과 동일한 논리 흐름을 따르도록 합니다. 또한 화면 읽기 프로그램에서 불필요한 요소를 제외합니다(예: 이미 액세스할 수 있는 필드의 장식 이미지 또는 레이블).
오디오 또는 색상 신호에만 의존하지 마세요. 진행률, 완료 또는 기타 상태의 유일한 표시가 소리 또는 색 변경인 경우를 방지합니다. 보강 전용 소리와 색으로 명확한 시각적 신호를 포함하도록 사용자 인터페이스를 디자인하거나 특정 접근성 표시기를 추가합니다. 색을 선택할 때 색맹을 가진 사용자를 구분하기 어려운 색상표를 피하려고 합니다.
비디오 콘텐츠에 대한 캡션 및 오디오 콘텐츠에 대해 읽을 수 있는 스크립트를 제공합니다. 오디오 또는 비디오 콘텐츠의 속도를 조정하는 컨트롤을 제공하고 볼륨 및 전송 컨트롤을 쉽게 찾고 사용할 수 있도록 하는 것도 유용합니다.
앱이 여러 언어를 지원하는 경우 접근성 설명을 지역화합니다.
대상으로 하는 각 플랫폼에서 앱의 접근성 기능을 테스트합니다. 자세한 내용은 접근성 테스트를 참조 하세요.

의미 체계 속성을 사용하여 접근성 있는 앱 빌드

의미 체계 속성

설명

힌트

제목 수준

의미 체계 포커스

제한 사항

자동화 속성

ExcludedWithChildren

IsInAccessibleTree

이름

HelpText

LabeledBy

접근성 테스트

화면 읽기 프로그램 사용

TalkBack 사용

VoiceOver 사용

내레이터 사용

접근성 검사 목록

피드백

추가 리소스

의미 체계 속성을 사용하여 접근성 있는 앱 빌드

의미 체계 속성

설명

힌트

제목 수준

의미 체계 포커스

의미 체계 화면 읽기 프로그램

제한 사항

자동화 속성

ExcludedWithChildren

IsInAccessibleTree

이름

HelpText

LabeledBy

접근성 테스트

화면 읽기 프로그램 사용

TalkBack 사용

VoiceOver 사용

내레이터 사용

접근성 검사 목록

피드백

추가 리소스