マークアップ全般¶
これらのガイドラインは、マークアップ全般に関するもので、すべてのコンテンツが対象です。
これらのガイドラインは、すべての項目が[MUST]です。
適切なマークアップ¶
[MUST]文書構造を適切にマークアップする¶
- ガイドライン
[MUST]文書構造などのセマンティクスを表す適切なマークアップをする。
- チェック内容
- デザイン(チェックID: 0541)
見出し(
h1
~h6
)、箇条書き(ul
,ol
,dl
)、表(table
)など、HTMLのセマンティクスで表現できるものがそれらで表現されるよう、設計資料で明示されている。
- コード(チェックID: 0551)
見出し(
h1
~h6
)、箇条書き(ul
,ol
,dl
)、表(table
)などを用いてセマンティクスが適切にマークアップされている。
- プロダクト(チェックID: 0561、NVDAによるチェック実施方法の例、axeによるチェック実施方法の例)
設計資料で見出しとして示されているものを、スクリーン・リーダーが見出しとして認識している。
- プロダクト(チェックID: 0562、NVDAによるチェック実施方法の例)
スクリーン・リーダーが、表(
table
)を適切に認識していて、表中のセルも適切に認識している。
[MUST]文法的に正しいマークアップ¶
- ガイドライン
[MUST]文法的に正しい、仕様に準拠したマークアップを行う。
- チェック内容
- コード(チェックID: 0571)
validatorやlinterでチェックが通る。
コンポーネント¶
[MUST]コンポーネントをアクセシブルにする¶
- ガイドライン
[MUST]標準的なHTMLとは違う挙動をするコンポーネントを使用する場合、以下を満たす。
支援技術を含むユーザー・エージェントが取得できる形で、適切にAccessibleNameとroleを定義する。
支援技術を含むユーザー・エージェントが、コンポーネントの状態、プロパティー、ユーザーが設定可能な値を設定でき、これらの変更を認知できるようにする。
- チェック内容
- プロダクト(チェックID: 0591、NVDAによるチェック実施方法の例)
静的なテキストではない部分(例:開閉するメニュー、タブ・パネル、日付選択UI)も、スクリーン・リーダーで問題なく操作できる。