JIS X 8341-3:2016は、ウェブコンテンツのアクセシビリティを高めるためのガイドラインで、多様なユーザーがコンテンツにアクセスできることを目指しています。「知覚可能」というカテゴリは、コンテンツが視覚、聴覚、触覚など、様々な感覚で認識できるようにするための基準です。本記事では、「知覚可能」の達成基準であるガイドライン”適応可能”について解説し、それぞれの具体的な達成方法を紹介します。
適応可能(付番:1.3.1) 情報及び関係性
達成基準の概要
「1.3.1 情報及び関係性」では、ウェブコンテンツにおいて情報の意味やその関係性が、見た目だけでなく、プログラムでも認識できるように設計することを求めています。具体的には、見出し、リスト、表、フォームなどの構造を正しくマークアップし、スクリーンリーダーなどの支援技術が正確に情報を伝えられるようにすることが目標です。
達成方法のポイント
-
見出しやリストの適切な使用
見出しは<h1>
から<h6>
までのタグを適切に使用し、ページの階層構造を示します。リストには<ul>
や<ol>
を使用し、項目の関係性を明確に示します。 -
表の正しいマークアップ
表には見出しセル<th>
やデータセル<td>
を使い、ヘッダーセルとデータセルの関連付けを行います。特に複雑な表では、scope
属性やheaders
属性を使用して、セル間の関係性を明確にします。 -
フォームのラベル付け
フォーム要素には必ず<label>
タグを使用して、各入力フィールドの意味を明確に伝えます。また、for
属性でフォームのラベルと入力フィールドを関連付け、支援技術が適切に読み上げられるようにします。
適応可能(付番:1.3.2) 意味のある順序
達成基準の概要
「1.3.2 意味のある順序」は、コンテンツの意味が正しい順序で伝わるようにすることを求めています。これは、視覚的なレイアウトが意味の伝達に影響を及ぼす場合、その順序が論理的でなければならないという基準です。順序が支援技術に正しく伝わるように、適切なコードの記述が必要です。
達成方法のポイント
-
コンテンツの論理的な順序
HTML要素の順序が視覚的なレイアウトに基づいて正しく設計されているかを確認します。例えば、重要な情報が先に表示され、その後に補足情報が続くようにコードを構成します。 -
タブキーでの操作順序
キーボード操作において、タブキーを使ったフォーカスの移動が直感的であることが求められます。tabindex
属性の不適切な使用により、フォーカスが予期しない順序で移動することがないようにしましょう。 -
ARIAランドマークの使用
論理的な順序を示すために、適切なARIA(Accessible Rich Internet Applications)ランドマーク(例:role="main"
,role="navigation"
,role="complementary"
など)を使用し、ページのセクションを明確に定義します。
適応可能(付番:1.3.3) 感覚的な特徴
達成基準の概要
「1.3.3 感覚的な特徴」では、情報の伝達において色や形、位置、音といった感覚的な特徴のみに依存しないことを求めています。これにより、視覚や聴覚に障害のあるユーザーが情報を正しく受け取れるようになります。
達成方法のポイント
-
テキストによる補足情報の提供
ボタンの「赤いボタンを押してください」などの説明ではなく、「削除ボタンを押してください」などの具体的なテキストを使用し、感覚に依存しない説明を行います。 -
色の代わりにテキストやシンボルを使用
情報の強調に色を使用する場合は、必ずテキストやアイコンを併用します。例えば、エラーメッセージを赤色だけで表示するのではなく、シンボル(例: ❌)や明確なメッセージを追加します。 -
音声だけで伝わる情報の視覚的補助
例えば、アラート音だけで注意を促すのではなく、視覚的なポップアップやメッセージを表示し、聴覚障害のあるユーザーにも伝わるようにします。
「知覚可能」の達成基準を守る重要性
「知覚可能」の基準を満たすことは、視覚や聴覚、身体の制約を持つユーザーにとってウェブサイトを利用しやすくするための基本です。正しい構造化や順序付け、感覚に依存しない情報提供は、アクセシビリティの向上だけでなく、ユーザビリティ全体の向上にもつながります。また、これにより、全てのユーザーがウェブコンテンツに公平にアクセスできる環境が整うため、ビジネス上のリーチ拡大や社会的な価値向上にも寄与します。
まとめ
JIS X 8341-3:2016の「知覚可能」カテゴリの達成基準”適応可能”は、ウェブコンテンツが多様なユーザーに正確に伝わるようにするための基盤です。情報の構造化、意味のある順序、感覚に依存しない設計を実現することで、アクセシブルで使いやすいウェブサイトが構築されます。この基準を守ることにより、全ての人にとっての「使いやすさ」を追求する姿勢が示され、社会的にも大きな意義を持つ取り組みとなるでしょう。
当社では、ウェブアクセシビリティを簡単に導入できるUUU ウェブアクセシビリティウィジェットツールをリリースしております。アクセシビリティ向上にご興味がある方はぜひ詳細をご覧ください。