index.md

title	slug
モバイルアクセシビリティのチェックリスト	Web/Accessibility/Mobile_accessibility_checklist

{{AccessibilitySidebar}}

このドキュメントは、モバイルアプリ開発者向けのアクセシビリティ要件の簡潔なチェックリストを提供します。 それはより多くのパターンが生じるにつれて絶えず進化することを意図しています。

色

• カラーコントラストは、WCAG 2.0（英語）の AA レベルの要件に準拠しなければならない。

  • 通常のテキストでは、4.5:1 のコントラスト比（18 ポイント未満または 14 ポイント未満の太字）。
  • 大きなテキストでは、3:1 のコントラスト比（少なくとも 18 ポイントまたは 14 ポイントの太字）。

• 色で伝えられる情報は、他の方法でも利用可能でなければならない（リンクのための下線付きテキストなど）。

可視性

• {{cssxref("opacity")}} がゼロ、{{cssxref("z-index")}} 順、画面外配置のようなコンテンツ非表示テクニックは、可視性を扱うためだけに使用してはいけない。

• 現在の表示画面以外のものは、本当に見えないものでなければならない（特に複数のカードを含む単一ページのアプリに関連します）。

  • hidden 属性、{{cssxref("visibility")}} スタイルプロパティ、または {{cssxref("display")}} スタイルプロパティを使用します。
  • 絶対に避けられない場合を除いて、aria-hidden 属性は使用するべきではない（SHOULD NOT）。

フォーカス

• 全てのアクティブ化可能要素はフォーカス可能でなければならない。

  • リンク、ボタン、フォームフィールドのような標準コントロールは、デフォルトでフォーカス可能です。
  • 非標準コントロールには、button、link、checkbox のような適切な ARIA のロール（英語）が割り当てられていなければならない。

• フォーカスは、論理的な順序と一貫した方法で扱われるべきです。

同等のテキスト

• アプリ内の全ての非厳密で提示的な非テキスト要素には、同等のテキストを提供しなければならない。

  • 必要に応じて alt と title を使用してください（良いガイドについては、HTML の title 属性の使用（英語）に関する Steve Faulkner の投稿を参照してください）。
  • 上記の属性が適用できない場合は、aria-label、aria-labelledby、aria-describedby のような適切な ARIA のプロパティ（英語）を使用してください。

• テキストの画像は避けなければならない。

• スクリーンリーダーを使用するユーザーのために、全てのフォームコントロールにラベル（{{htmlelement("label")}} 要素）を持たなければならない。

ステートの取り扱い

• ラジオボタンやチェックボックスのような標準コントロールは、オペレーティングシステムによって処理されます。 ただし、他のカスタムコントロールでは、aria-checked、aria-disabled、aria-selected、aria-extended、および aria-press のような ARIA のステート（英語）を介してステートの変更を提供する必要があります。

一般的なガイドライン

• アプリのタイトルを提供しなければならない。

• 見出しは階層構造を壊してはならない。

  <h1>最上位の見出し</h1>
  <h2>副見出し</h2>
  <h2>別の副見出し</h2>
  <h3>下位の見出し</h3>

• banner、complementary、contentinfo、main、navigation、search のような ARIA のランドマークロール（英語）は、アプリやドキュメントの構造を説明するために使用するべきです（SHOULD）。

• タッチイベントハンドラーは、touchend イベントでのみトリガされなければならない。

• タッチターゲットは、ユーザーが対話するのに十分な大きさでなければならない（有用なタッチターゲットサイズのガイドラインについては、BBC モバイルアクセシビリティ・ガイドライン（英語）を参照してください）。

メモ: この文書のオリジナル版（英語）は、Yura Zenevich によって書かれました。