#490
アクセシビリティ・インクルーシブ
#490だぶりゅーしーえーじー
WCAG (Web Content Accessibility Guidelines)
別名・表記:WCAGウェブコンテンツ・アクセシビリティ・ガイドライン
UIXHERO Definition
「ウェブのバリアフリー基準」。誰もがウェブを使えるようにするための、世界共通のルールブック。
概要
World Wide Web Consortium（W3C）のWeb Accessibility Initiative（WAI）が策定する、ウェブアクセシビリティに関する国際的なガイドライン。
アクセシビリティの4つの原則に基づいて構成されている。
- 知覚可能（Perceivable）: 情報やUIコンポーネントは、ユーザーが知覚できる方法で提示されなければならない（例：盲目のユーザーには音声で）。
- 操作可能（Operable）: UIコンポーネントとナビゲーションは操作可能でなければならない（例：マウスが使えないユーザーにはキーボードで）。
- 理解可能（Understandable）: 情報とUIの操作は理解可能でなければならない（例：予測可能な動作）。
- 堅牢（Robust）: コンテンツは、支援技術を含む様々なユーザーエージェントが確実に解釈できるよう、堅牢でなければならない（例：正しいHTML構文）。
達成基準にはA（最低限）、AA（推奨）、AAA（最高レベル）の3段階があり、多くの公的機関や企業サイトではレベルAAへの準拠が求められることが多い。
UXでの活用
- コントラスト比の確保: 通常テキストは4.5:1以上、大きなテキスト（18pt以上、または14pt太字以上）は3:1以上のコントラスト比を確保することで、弱視のユーザーや屋外でスマホを見るユーザーでも読みやすくする。
- フォーカスの可視化: キーボード操作時に、現在どこを選択しているかが視覚的（フォーカスリング）に分かるようにする。
- エラーの特定・修正提案: 入力エラーがあった場合、単に赤くするだけでなく、「メールアドレスの形式が間違っています（@が必要です）」のように具体的に説明する。
💡 使いどころ
ウェブサイトやアプリの設計・開発・テストの全工程で参照する。特に、公共性の高いサイトや、多様なユーザーを対象とするサービスでは準拠が必須となるケースが多い。
⚠️ 注意点・誤用
ガイドラインへの準拠は手段であり、目的ではない。WCAGは最低限の品質保証であり、「実際の多様なユーザーが快適に使えるか」というUXの視点を置き換えるものではない。
具体例
- 知覚可能: 画像に代替テキスト（alt）を付ける。動画に字幕を付ける。
- 操作可能: 全ての機能をキーボードだけで操作できるようにする。
- 理解可能: エラーメッセージを具体的に表示し、修正方法を提示する。
- 堅牢: スクリーンリーダーなどの支援技術で正しく読み上げられるHTMLを書く。
出典・参考文献:
- W3C. (2023). Web Content Accessibility Guidelines (WCAG) 2.2.
- JIS X 8341-3:2016 (高齢者・障害者等配慮設計指針－情報通信における機器，ソフトウェア及びサービス－第3部：ウェブコンテンツ)
- Caldwell, B., Cooper, M., Reid, L. G., & Vanderheiden, G. (2008). Web Content Accessibility Guidelines (WCAG) 2.0. W3C Recommendation.
- Lazar, J., Goldstein, D. F., & Taylor, A. (2015). Ensuring Digital Accessibility through Process and Policy. Morgan Kaufmann.
関連する解説記事
関連する記事詳細が見つかりませんでした。