フォーカス可能なテキスト

人工知能をこのルールのためにどのように活用しているか学びましょう！

確認のポイント

テキストを含むすべての要素は、VoiceOverなどの支援技術でフォーカス可能であるべきです。テキスト要素はアクセシビリティ要素としてマークされ、VoiceOverユーザーが画面上のテキストに移動して読むことができるようにします。

概要

• このルールはユーザーにとって重要な影響を与えます
• テキスト要素はVoiceOverを使って読み上げるために、アクセシビリティ要素としてマークされている必要があります
• UIKitで、 isAccessibilityElement = true テキスト要素をフォーカス可能にするために設定してください
• SwiftUIとReact Nativeでは、テキスト要素はデフォルトでアクセス可能です——支援技術から非表示にしないでください

ユーザーへの影響

視覚障害者や低視力の人々に最も影響があります。テキスト要素がアクセシビリティ要素としてマークされていない場合、VoiceOverがフォーカスできません。その結果、スクリーンリーダーのユーザーは画面上で表示されている情報を見逃してしまい、混乱を招くか、重要なコンテンツにアクセスできないことがあります。

フォーカス可能なテキストの問題を確認する

1. VoiceOverをオンにする
2. テキスト要素にフォーカスを当てることを試みる
3. 次のいずれかが発生します：
   • アクセス不可：テキスト要素がVoiceOverでフォーカスされません
   • アクセス可能：テキスト要素がVoiceOverでフォーカスされ読み上げられます

問題の修正

フォーカス可能なテキストの問題を解決するためには、テキスト要素をアクセシビリティ要素としてマークし、VoiceOverが到達しアナウンスできるようにします。テキストがフォーカス可能な親要素（ボタンやラベル付きのコントロールなど）の一部である場合、親のアクセシブル名にテキストが含まれるはずです。その場合、テキスト要素自体は個別にフォーカス可能である必要はありません。

UIKit

Storyboardで修正するには：

1. テキスト要素に移動します。
2. インスペクターパネルが表示されていることを確認します。
3. を選択 Identity Inspectorします。
4. で アクセシビリティ、"有効" チェックボックスを選択します。

コードで修正するには、テキスト要素をVoiceOverでフォーカス可能にします：

label.isAccessibilityElement = true

SwiftUI

SwiftUIでは、テキスト要素はデフォルトでアクセス可能です。テキストが意味を持ち、コンテキストを提供していることを確認し、accessibility hiddenビュー修飾子を使用して非表示にしないでください。

React Native

React Nativeでは、テキスト要素はデフォルトでアクセス可能です。テキストが意味を持ち、コンテキストを提供していることを確認してください。 の使用による accessible={false} テキスト要素に直接または accessibilityElementsHidden=true 親要素にプロパティを設定してアクセシビリティを無効にしないでください。

Flutter

Flutterでは、 Text 要素はデフォルトでアクセシビリティツリーに含まれています。テキストが意味を持ち、コンテキストを提供することを確認してください。 を使用してアクセスビリティツリーから表示テキストを除外しないでください ExcludeSemantics または Semantics(excludeSemantics: true)でラップする。

このルールを無視しても良いですか？

フォーカス可能なテキストは、ユーザーに 重大な影響 を与えるため、これらの問題を修正することを強くお勧めします。テキストがすでにVoiceOverでフォーカス可能な親要素内にあり、そのアクセシブル名にテキストが含まれている場合（ボタンラベルやコントロールの説明テキストなど）、テキスト要素自体がフォーカス可能でなくても問題ない場合があります。詳細については、 ルールの無視について学びましょう。

リソース

Deque University コースページ

• 1.3.2 意味のある順序 (A)

注意: Deque University のリソースにフルアクセスするには、サブスクリプションが必要です。

その他のリソース

• Web Content Accessibility Guidelines (WCAG) 2.0, W3C 勧告
  • 成功基準 1.3.2 - 意味のある順序
• WCAG 2.0 理解文書
  • 1.3.2 A - 意味のある順序の理解