モバイルアプリアクセシビリティ入門── iOS+Androidのデザインと実装

構成数 : 1枚

■■第1章 モバイルアプリのアクセシビリティとは
■1.1 アクセシビリティとは
言葉としての定義
ユーザビリティとの対比
アクセシビリティは利用しやすさ?
アクセシビリティは障害者・高齢者対応?
■1.2 さまざまな状況で使えるモバイルアプリ
モバイルアプリは形を変えられる
アクセシビリティ機能と利用状況
弱視・ロービジョン
色覚特性・色弱
全盲
上肢障害
聴覚障害
認知・学習障害
加齢と障害
一時的な障害
医学モデルと社会モデル
■1.3 モバイルアプリのアクセシビリティに取り組む理由
多くの人が長い時間向き合うモバイルアプリ
アクセスできない人を減らし、ユーザーを増やせる
障害者の概況とアクセシビリティの必要性
高齢者の概況とアクセシビリティの必要性
アクセスできると口コミが広がり、市場が生まれる
コラム 加齢と身体障害の相関と増加
ユーザビリティを高められる
権利を守り、法を遵守できる
障害者差別解消法、「合理的配慮」と「環境の整備」
合理的配慮・環境の整備・Webアクセシビリティ(1)──公共機関の場合
合理的配慮・環境の整備・Webアクセシビリティ(2)──民間事業者の場合
モバイルアプリも「情報アクセシビリティ」に含まれ、「環境の整備」の対象である
アメリカではすでに訴訟リスクに
■1.4 モバイルアプリのアクセシビリティガイドライン
WCAGと各種ガイドラインの関係性
技術に依存しないがゆえのWCAGの読みにくさ
WCAGの3つの適合レベルとその内容
レベルAとマシンリーダビリティ
非干渉──ほかの部分が見れなくなるような表現を避ける
レベルAAとヒューマンリーダビリティ
レベルAAAは「強化版」
iOS・Androidのガイドライン
iOSのアクセシビリティガイドライン
Androidのアクセシビリティガイドライン
企業が公開している独自ガイドライン

■■第2章 モバイルアプリのデザインとアクセシビリティ
■2.1 モバイルアプリにおけるデザインの位置付け・役割
デザイナー視点でのアクセシビリティのとらえ方
UIの道具性とブランドの演出装置──それぞれの役割、意識配分・棲み分け
ブランディングとしてのアクセシビリティ活用
デザインを行ううえでの基準としてのアクセシビリティ活用
アクセシビリティの準拠ラインを定める
アクセシビリティの遵守を0%か100%かで考えない
知識として抑えることで情報設計品質が向上する
音声読み上げの順序が引き起こす問題
アクセシビリティ観点でのレビューが情報設計を改善する
■2.2 OSが提供するアクセシビリティ機能を生かす
タッチデバイスならではのアクセシビリティ
操作可能なことを視覚的に示す
タップエリアを十分に確保する
音声読み上げを困難にする例
非テキストコンテンツのラベルが不足している
タイムベースのコンテンツが生む混乱
音声の自動再生が音声読み上げと重なる
ライブリージョンの不適切な実装
一貫性の欠如したレイアウト
フォントサイズ変更への対応
テキストのオーバーフロー
テキストの切れ
隣接する要素との間隔
モーダルやポップアップのサイズ固定
テキストのサイズに対してアイコンが小さい
■2.3 配色のポイント
文字、アイコン、記号の色
色だけで差分を示唆しない
■2.4 標準コンポーネントのポイント
必ずしも使わなければいけないわけではない
踏襲すべきところと改変してもよいところ
コラム UIの道具性とブランド演出を両立する方法
■2.5 チームとしてデザインするために
アクセシビリティを意識したデザインレギュレーション
複数デザイナーでも無意識に遵守できるしくみと工夫──デザインシステム

■■第3章 iOSのアクセシビリティ機能
■3.1 iOSのアクセシビリティ機能を体験しよう
■3.2 アクセシビリティ機能を試すための事前準備
ショートカットによる機能の有効/無効化
コントロールセンターによる機能の有効/無効化
アクションボタンによる機能の有効/無効化
■3.3 視覚サポート
VoiceOver
ズーム機能
文字を太くする
Dynamic Type
オン/オフラベル
透明度を下げる
ダークモード
コントラストを上げる
カラー以外で区別
色の反転
カラーフィルタ
視差効果を減らす
選択読み上げ
画面読み上げ
■3.4 身体サポート
AssistiveTouch
スイッチコント...