アクセシブルなレスポンシブ Web サイトとアクセシブルなアプリは、どちらも「電話上で動作する」とはいえ、同じものではありません。この記事では、Web サイトにアクセスできるようにすることと、iOS または Android のネイティブ アプリにアクセスできるようにすることの重要な違いについて説明します。

要するに、この記事の内容

  1. 異なるテクノロジー、同様のルール
  2. VoiceOver と TalkBack: 同じスクリーン リーダーではありません
  3. ネイティブ アプリの特徴
  4. アクセス可能なアプリをテストする方法

異なるテクノロジー、同様のルール

レスポンシブ Web サイトは HTML から構築されます。HTML には、ブラウザーやスクリーン リーダーが解釈方法を認識できるアクセシビリティ レイヤー (セマンティック タグ、ARIA) が組み込まれています。対照的に、ネイティブ アプリは、オペレーティング システム独自の UI コンポーネント (iOS では UIKit/SwiftUI、Android では Jetpack Compose/Views) から構築されます。また、すべてのコンポーネントには、ビジュアル デザインとは別に、独自のアクセシビリティ タグ付けが必要です。基本的な原則は WCAG (コントラスト、タッチターゲットのサイズ、明確でアクセス可能な名前) に似ていますが、それらを実装するためのツールはまったく異なります。

VoiceOver と TalkBack: 同じスクリーン リーダーではありません

VoiceOver (iOS) と TalkBack (Android) は 2 つの異なるスクリーン リーダーであり、ナビゲーション ジェスチャとカスタム コンポーネントのサポートが異なります。開発者が両方のプラットフォームを個別にテストしていない場合、iOS で完全にタグ付けされたコンポーネントが Android では正しく動作しない可能性があります。 「iOS でテストしたのだから、Android でも動作するはずだ」と考えることはできません。

💡 注意事項

どちらのプラットフォームでも、すべてのインタラクティブ コンポーネント (ボタン、入力フィールド、画像) には、明確なアクセシビリティ ラベル、定義されたアクセシビリティ ロール/特性、そして場合によっては、タップされたときに何が起こるかを説明するアクセシビリティ ヒントも必要です。

ネイティブ アプリの特徴

ネイティブ アプリは、Web サイトには存在しない課題にも直面しています。カスタム タッチ ジェスチャ (スワイプ、ピンチ) には、アクセス可能な代替手段が必要です。画面間のナビゲーションもスクリーン リーダーを介して意味をなす必要があります。プッシュ通知は、アプリ自体の外部に表示される場合でもアクセスできる必要があります。さらに、タッチ ターゲットのサイズは、Apple のガイドラインでは最低 44x44 ピクセル、Google のガイドラインでは 48x48dp を満たす必要があります。この要件は、Web サイト上で常に同じ形式で存在するとは限りません。

アクセス可能なアプリをテストする方法

  1. VoiceOver または TalkBack をオンにし、それらのみを使用してアプリの主要なタスク (サインアップ、購入、検索) を完了してみます。
  2. システムのアクセシビリティ設定をオンにして、コントラストとテキスト サイズを確認します (テキストが大きく、コントラストが高い)。
  3. レイアウトが「崩れる」ことなく、動的テキスト サイズ設定 (iOS では Dynamic Type) がサポートされていることを確認します。
  4. 両方のプラットフォームで個別にテストします。一方だけをテストするだけでは十分ではありません。

アプリに付属するドキュメントもありますか?

私たちのツールは、アプリまたは Web サイトにリンクされている PDF ファイル (利用規約、ガイド、フォーム) をスキャンし、注意が必要なものを正確に示します。

あなたのサイトを無料でスキャンしてください ←

スキャン後、見つかったドキュメントに直接無料でアクセスできるようにすることもできます。AccessiDoc.