記事 —
モバイルUIのアクセシビリティ：日本のアプリ開発で考えること
WCAG基準と実際の設計判断のあいだ
アクセシビリティという言葉は広いですが、モバイルUIの設計においては具体的な数値と判断の積み重ねです。コントラスト比・フォントサイズ・タップターゲットのサイズ。これらを一つずつ確認しながら設計することが、使いやすいUIを作る上での基本になります。
コントラスト比の実際
WCAG 2.1のAAレベルでは、通常テキストのコントラスト比は4.5:1以上、大きなテキスト（18pt以上または14pt太字以上）は3:1以上が基準です。この数値はFigmaのプラグイン（Contrast）で確認できます。
問題になりやすいのは、ブランドカラーをテキストに使う場合です。淡い色はコントラスト比が基準を下回ることが多く、テキストへの使用を避けてアクセント要素に限定するルールを設けることで解決できます。
フォントサイズとタップターゲット
日本語のモバイルUIでは、最小フォントサイズを16pxに設定することを基本にしています。英数字に比べて漢字は視認性が高いですが、小さいサイズでは画数の多い文字が読みにくくなります。
タップターゲットのサイズは、Appleのガイドラインに沿って44×44pt以上を確保します。要素のサイズが小さい場合は、タップ領域を視覚的なサイズより大きく設定することで対応できます。
ユーザーテストで見えてくること
数値を満たしていても、実際のユーザーが使いにくいと感じることがあります。たとえば、コントラスト比の基準を満たしていても、年齢や使う環境によっては、数値の読み取りに時間がかかる人がいます。
そのため、数値を大きく見せる画面（体重や血圧の記録画面など）では、24px以上のフォントサイズを使うといった独自のルールを決めておくと安心です。アクセシビリティの基準は最低限の保証であり、それを超えた設計判断が使いやすさを決めます。
アクセシビリティ対応を含むモバイルUIの設計についてご相談がある場合は、お問い合わせページからどうぞ。
Pixel Citadel · アクセシビリティ · モバイルUI · WCAG · UXデザイン