Webアクセシビリティの参考資料まとめ
調査対象となったアプリのフッターメニューに関して、WAI-ARIA Authoring Practices 1.2 に則った振る舞いについて調査が行われた。iOS 標準アプリの多くはタブのロールを持ち、ランドマークに所属せず、フォーカスは移動しないという結果が多いことがわかった。これに対して、Google は自由なアプローチをとっていることがわかった。最終的に、ユーザーに行動の自由を与え、ローター機能を使って移動することができるタブの方が健全な実装だと考えられた。
Flutter の Semantics は、アクセシビリティに対応した概念であり、スクリーンリーダー対応に特化している。Flutter の内部実装でも、Semantics 機能に重点が置かれ、UI の描画と同じくらい重要視されている。Flutter では、スクリーンリーダー対応を強く推奨し、Semantics を含むアクセシビリティ対応に注力している。Semantics は、標準ウィジェットを使用することで簡単に実現できるため、積極的に活用することが望まれている。
React Native のアクセシビリティ対応を紹介する。コンポーネントにフォーカスを与え、支援技術が操作できるようにするためには、accessible プロパティが必要だ。また、accessible={true}が指定されたコンポーネントは、子要素をグループ化して一括で読み上げることができる。ただし、iOS ではグループ化された子要素にフォーカスできなくなるケースがあるため、注意が必要だ。
React Native のアクセシビリティ対応について解説している。iOS 14 と Android 11 での実機動作を確認し、Expo Snack を使用している。アクセシビリティについて、モバイルアプリでの実装方法や、iOS や Android のアクセシビリティガイドラインを参考にすることをオススメしている。また、スクリーンリーダーの使い方や React Native のアクセシビリティ関連の Props、AccessibilityInfo API についても説明している。React Native の組み込みコンポーネントは WAI-ARIA と異なる振る舞いをすることがあるため、注意が必要だ。
freee 株式会社におけるこれまでのモバイルアプリのアクセシビリティー改善の経緯、モバイルアプリ向けチェックリストの概要に触れた上で、モバイルアプリでよくあるアクセシビリティーの問題とその解決策について紹介している。
Android アプリのアクセシビリティについてのかんたんな紹介と Accessibility Testing Framework for Android の導入方法についてのスライド。
iOS アプリで VoiceOver に対応した事例の紹介。標準の UILabel や UIButton で実装する場合は気にしなくて良いが、画像のみのボタンを使う場合は注意が必要だという。
VoiceOver とは何か分かる、VoiceOver 対応でどういった知識が必要なのか分かる、VoiceOver 対応ではどんな作業をするのか分かる、VoiceOver 対応がなぜ必要なのか分かる。
2017 年の Google I/O で発表された Android のアクセシビリティ関連セッションに関する情報が紹介されている。テスト方法や、アクセシビリティを向上させるためのアプリやツールが書かれている。開発者は Accessibility Services や API を理解し、自分のアプリをテストするために「Accessibility Scanner」アプリを使用し、ユーザー調査を行うことが推奨されているという。良い体験のためのチェックリストもあり。
UI Accessibility プログラミングインターフェイスについて概説されている。
iOS アプリに搭載されている Dynamic Type についてのナレッジ。実装のコツやコード例が紹介されている。
モバイルアプリの開発者やデザイナーはアクセシビリティを向上させるために以下のことを心がけるべきであるとされている。
Android の実装チェックリストにおける最低＆推奨要件について。マシンリーダブルなテキスト情報を付与し、フォーカスありきのナビゲーションに対応した UI 設計にすることが求められると述べられている。