意味のあるアクセシブルな名前

This page is not available in the language you requested. You have been redirected to the English version of the page.

Link to this page copied to clipboard

アクセシブルな名前が冗長にならないようにする

Not for use with personal data

私たちが確認すること

要素のアクセシブルな名前には、そのアクセシビリティ特性を含めてはいけません。VoiceOverは特性を自動的に読み上げるので、名前に含めると2回読み上げられることになります。

このルールは、 Appleのヒューマンインターフェイスガイドラインで設定されたベストプラクティスを強制するものです。このルールは、モバイルダッシュボードから無効にできるほか、 iOS用に書かれたテストでルールを無視することもできます。

概要

このルールはユーザーにとって軽微な影響があります
要素のアクセシブルな名前にアクセシビリティ特性を繰り返してはいけません - VoiceOverが自動的に特性を読み上げます
例えば、「次へボタン」という名前のボタンは、VoiceOverが「次へボタン、ボタン」と冗長な読み上げを行います

ユーザーへの影響

VoiceOverユーザーに最も影響があります。アクセシブルな名前に要素の特性が含まれていると、VoiceOverは特性を2回読み上げます - 例えば、「次へボタン、ボタン」ではなく「次へ、ボタン」となるべきです。これは冗長であり、スクリーンリーダーユーザーにとって混乱や注意の妨げになる可能性があります。

意味のあるアクセシブルな名前の問題を確認する

VoiceOverをオンにします
要素にフォーカスする
次のいずれかが発生します:
- アクセス不可: VoiceOverは要素のアクセシビリティ特性を2回 - アクセシブルな名前の一部として、そして特性としてもう一度（例：「次へボタン、ボタン」）読み上げる
- アクセス可能: VoiceOverはアクセシブルな名前を読み上げ、その後に特性を（例：「次へ、ボタン」）読み上げる

問題を修正する

意味のあるアクセシブルな名前の問題を解決するには、アクセシブルな名前に要素のアクセシビリティ特性を含めないようにしてください。VoiceOverは特性を自動的に付加するため、名前に含めると冗長な読み上げになります。

UIKit

Storyboardの場合の修正方法:

問題のある要素を選択します。 MeaningfulAccessibleName インスペクターパネルが表示されていることを確認します。
「
アイデンティティインスペクタ 」を選択します。
「 アクセシビリティ」の下で、見えるテキストと一致し、要素のアクセシビリティ特性を含まないラベルを入力してください。

コードで修正する場合、アクセシビリティラベルの値が要素の見えるテキスト全体と一致するか含み、かつそのアクセシビリティ特性を含んでいないことを確認してください:

button.title = "Next"
button.accessibilityTraits = .button

SwiftUI

アクセシビリティラベルを設定して、見えるテキストを含み、要素のアクセシビリティ特性を含まないようにします:

Button(action: {
    openMenu()
}) {
    Text("Next")
}.accessibility(label: Text("Next"))

React Native

要素の accessibilityLabel が要素の accessibilityRole 値を含んでいないことを確認してください:

<Button title='Order now' accessibilityLabel='order now' accessibilityRole='button'/>

Flutter

アクセシブルな名前は要素の目的を説明しなければなりません。「ボタン」や「画像」のような一般的な名前を避け、名前に役割を含めないでください。スクリーンリーダーは役割を別途読み上げます。

  // Failing — name includes the role, screen reader says "Search button, button"
  IconButton(
    icon: const Icon(Icons.search),
    tooltip: 'Search button',
    onPressed: () {},
  )

  // Passing — name describes the action, screen reader says "Search, button"
  IconButton(
    icon: const Icon(Icons.search),
    tooltip: 'Search',
    onPressed: () {},
  )

このルールを無視してもよいか？

意味のあるアクセシブルな名前は、軽微な影響をユーザーに及ぼし、Appleのベストプラクティスを強制するものであり、厳しいWCAG要件ではありません。このルールはモバイルダッシュボード、またはiOSテストで個々の検出結果を無視します。詳しくはこちらをご覧ください：ルールの無視をご覧ください。

リソース

その他のリソース

Apple ヒューマンインターフェースガイドライン
- VoiceOver — 説明