diff --git a/package-lock.json b/package-lock.json
index edf58f88..495c73cb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -18,9 +18,9 @@
}
},
"@babel/parser": {
- "version": "7.11.5",
- "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.11.5.tgz",
- "integrity": "sha512-X9rD8qqm695vgmeaQ4fvz/o3+Wk4ZzQvSHkDBgpYKxpD4qTAUm88ZKtHkVqIOsYFFbIQ6wQYhC6q7pjqVK0E0Q=="
+ "version": "7.12.3",
+ "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.12.3.tgz",
+ "integrity": "sha512-kFsOS0IbsuhO5ojF8Hc8z/8vEIOkylVBrjiZUbLTE3XFe0Qi+uu6HjzQixkFaqr0ZPAMZcBVxEwmsnsLPZ2Xsw=="
},
"@textlint-ja/textlint-rule-no-synonyms": {
"version": "1.1.0",
@@ -1879,9 +1879,9 @@
}
},
"textlint-rule-preset-jtf-style": {
- "version": "2.3.5",
- "resolved": "https://registry.npmjs.org/textlint-rule-preset-jtf-style/-/textlint-rule-preset-jtf-style-2.3.5.tgz",
- "integrity": "sha512-hN/yGsL80enqGA0pMg5+LeYkVghQnPslKjnTZ+xndiDvBymHhrmeJMTG3T2U6/4u9hGBGJN3JXAIu58yTKoHlA==",
+ "version": "2.3.6",
+ "resolved": "https://registry.npmjs.org/textlint-rule-preset-jtf-style/-/textlint-rule-preset-jtf-style-2.3.6.tgz",
+ "integrity": "sha512-hun0dMmGM7WWQxu0XlndswNnXS6WqW5TEHeu7NLadZEwZQHYoaClFx0IPgpsmF64rnSLgJ7aq/5L56RkWYp2Ug==",
"requires": {
"analyze-desumasu-dearu": "^2.1.2",
"japanese-numerals-to-number": "^1.0.2",
diff --git a/package.json b/package.json
index 2d0df4b5..adc026d2 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,7 @@
"textlint-rule-ja-unnatural-alphabet": "^2.0.1",
"textlint-rule-no-nfd": "^1.0.2",
"textlint-rule-no-todo": "^2.0.1",
- "textlint-rule-preset-jtf-style": "^2.3.5"
+ "textlint-rule-preset-jtf-style": "^2.3.6"
},
"devDependencies": {},
"scripts": {
diff --git a/source/_static/samples/aria-live-basic.html b/source/_static/samples/aria-live-basic.html
new file mode 100644
index 00000000..65171615
--- /dev/null
+++ b/source/_static/samples/aria-live-basic.html
@@ -0,0 +1,24 @@
+
+
+
+
+ ARIAライブ・リージョンの基本的な実装例
+
+
+
+ aria-live属性を使って自動的にメッセージが読み上げられる
+
+ 下のボタンを押すと、「ページが更新されました。」というテキストが表示され、自動的に同じ内容が読み上げられます。
+
+
+
diff --git a/source/_static/samples/aria-live-timer.html b/source/_static/samples/aria-live-timer.html
new file mode 100644
index 00000000..75f89dca
--- /dev/null
+++ b/source/_static/samples/aria-live-timer.html
@@ -0,0 +1,29 @@
+
+
+
+
+ ARIAライブ・リージョンをページのロード後に挿入する（要注意）
+
+
+
+ aria-live属性を使って自動的にメッセージが読み上げられる
+
+ 下のボタンを押すと、「ページが更新されました。」というテキストが表示され、自動的に同じ内容が読み上げられます。
+
+
+
\ No newline at end of file
diff --git a/source/_static/samples/lang-incorrect.html b/source/_static/samples/lang-incorrect.html
new file mode 100644
index 00000000..2673d32a
--- /dev/null
+++ b/source/_static/samples/lang-incorrect.html
@@ -0,0 +1,12 @@
+
+
+
+
+ 誤ったlang属性の指定
+
+
+ 日本語のテキストは日本語の合成音声で読み上げられます。
+ HTML要素のlang属性には、ページ全体で主に使われている言語を指定します。
+ Web Content Accessibility Guidelines 2.1や、それを元に作ったfreeeアクセシビリティー・ガイドラインでは、html要素に適切なlang属性を指定することを必須としています。
+
+
diff --git a/source/_static/samples/lang-partial.html b/source/_static/samples/lang-partial.html
new file mode 100644
index 00000000..ec50cf3e
--- /dev/null
+++ b/source/_static/samples/lang-partial.html
@@ -0,0 +1,17 @@
+
+
+
+
+ lang属性 - 日英混在
+
+
+ 日本語のテキストは日本語の合成音声で読み上げられます。
+ Webの考案者、Tim Berners-Leeは、以下のように言っています：
+
+
+ The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.
+
+
+ 適切にlang属性を使うことで、複数の言語が混在しているときの使い勝手が変わってきますが、状況や想定ユーザーに応じて、最善の実装方法が異なることが考えられます。
+
+
diff --git a/source/categories/link.rst b/source/categories/link.rst
index 5b291dd6..e93ceab5 100644
--- a/source/categories/link.rst
+++ b/source/categories/link.rst
@@ -72,6 +72,11 @@
スクリーン・リーダーが提供するリンクの一覧機能を使う視覚障害者が、リンク先について容易に判断できるようにする。
+参考
+````
+
+* :ref:`exp-link-text`
+
対応するWCAG 2.1の達成基準
````````````````````````````
@@ -80,23 +85,6 @@
* |SC 2.4.4|
* |SC 2.4.4ja|
-例
-``
-
-.. list-table:: 注意すべきリンク・テキストの文言（「」部分がリンク・テキスト）
- :header-rows: 1
-
- * - NG
- - OK
- * - ○○は「こちら」
- - 「○○はこちら」
- * - 「もっと見る」
- - 「○○についてもっと見る」
- * - 「詳細」
- - 「○○についての詳細」
-
-.. todo:: マークアップで意図が明示できている例を追加
-
.. raw:: html
diff --git a/source/categories/markup.rst b/source/categories/markup.rst
index c6d9e208..56c27db6 100644
--- a/source/categories/markup.rst
+++ b/source/categories/markup.rst
@@ -75,7 +75,7 @@
参考
````
-* :ref:`exp-v.nu`
+* :ref:`exp-nu-html-checker`
対応するWCAG 2.1の達成基準
````````````````````````````
diff --git a/source/categories/text.rst b/source/categories/text.rst
index c279b6cf..88f9e556 100644
--- a/source/categories/text.rst
+++ b/source/categories/text.rst
@@ -104,11 +104,6 @@
視覚障害者が、ページ内で目的のコンテンツを見つけやすくする。
-参考
-````
-
-* .. todo:: 見出しやラベルの文言について、適切/不適切な事例がたぶん必要
-
対応するWCAG 2.1の達成基準
````````````````````````````
diff --git a/source/checks/checklist.rst b/source/checks/checklist.rst
new file mode 100644
index 00000000..f8f507a1
--- /dev/null
+++ b/source/checks/checklist.rst
@@ -0,0 +1,17 @@
+.. _check-index:
+
+アクセシビリティー・チェック全項目一覧
+----------------------------------------
+
+書くガイドラインの「チェック内容」に示したものを、チェックID順に掲載しています。
+
+それぞれ、以下の項目を記しています。
+
+* チェックID
+* チェック内容
+* 対象：デザイン、コード、またはプロダクト
+* 関連ガイドライン：そのチェックによって対応状況を確認することができるガイドライン
+* 参考情報：そのチェックの意図や実施方法に関する情報が記されているものもあります（各関連ガイドラインで掲載しているものと同じです。）
+* チェック実施方法の例を記しているものもあります（ :ref:`check-example-index` からリンクされているページにある内容と同じものです）
+
+.. include:: inc/allchecks.rst
diff --git a/source/checks/examples/axe.rst b/source/checks/examples/axe.rst
new file mode 100644
index 00000000..d56d306a
--- /dev/null
+++ b/source/checks/examples/axe.rst
@@ -0,0 +1,67 @@
+.. _check-example-axe:
+
+axeを用いたチェック実施方法の例
+----------------------------------
+
+axeのインストールや基本的な使用方法については、 :ref:`exp-axe` を参照してください。
+
+.. _check-example-axe-0021:
+
+:ref:`check-0021`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0021
+ :end-before: .. END_check-0021
+
+.. BEGIN_axe-0021
+
+「要素には十分な色のコントラストがなければなりません」という問題が出ないことを確認する。
+
+ただし、ガイドラインを満たしていない状態であっても、以下の場合は問題として表示されませんので注意が必要です。
+
+* マウスホバーなどで背景色やテキスト色が変化する場合の、変化後のコントラスト比が不足する場合
+* 大きいテキストのコントラスト比が3:1以上4.5:1未満の場合
+
+ - freeeの場合日本語テキストを想定しているため、「大きいテキスト」を30px（22pt）以上または22px（18pt）以上の太字としているが、WCAGでは欧文テキストを想定して18pt以上または14pt以上の太字としているため、その間のサイズではコントラスト不足を検知できない
+
+* テキスト以外のコントラスト比が不足している場合
+
+ - アイコン、画像、画像化されたテキスト、ボタンやフィールドの枠線など
+
+* 半透明な要素などが重なって違う色に見えている場合の、実際に見えている色のコントラスト比が不足する場合
+* 要素が重なっていて背景色と前景色の特定が難しい場合
+
+.. END_axe-0021
+
+.. _check-example-axe-0441:
+
+:ref:`check-0441`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0441
+ :end-before: .. END_check-0441
+
+.. BEGIN_axe-0441
+
+「画像には代替テキストがなければなりません」という問題が出ないことを確認する。
+
+ただし、画像に何かしらの代替テキストが入っていれば問題として検知されないため、適切ではない代替テキストの検出をすることはできません。
+
+.. END_axe-0441
+
+.. _check-example-axe-0951:
+
+:ref:`check-0951`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0951
+ :end-before: .. END_check-0951
+
+.. BEGIN_axe-0951
+
+「フォーム要素にはラベルがなければなりません」という問題が出ないことを確認する。
+
+.. END_axe-0951
diff --git a/source/checks/examples/index.rst b/source/checks/examples/index.rst
new file mode 100644
index 00000000..1a43d959
--- /dev/null
+++ b/source/checks/examples/index.rst
@@ -0,0 +1,11 @@
+.. _check-example-index:
+
+チェック実施方法の例
+--------------------
+
+.. toctree::
+ :maxdepth: 1
+ :titlesonly:
+
+ nvda
+ axe
diff --git a/source/checks/examples/nvda.rst b/source/checks/examples/nvda.rst
new file mode 100644
index 00000000..d4b905ba
--- /dev/null
+++ b/source/checks/examples/nvda.rst
@@ -0,0 +1,209 @@
+.. _check-example-nvda:
+
+NVDAを用いたチェック実施方法の例
+----------------------------------
+
+NVDAのインストール方法や基本的な使い方などについては、 :ref:`exp-screen-reader-check` を参照してください。
+
+.. _check-example-nvda-0411:
+
+:ref:`check-0411`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0411
+ :end-before: .. END_check-0411
+
+.. BEGIN_nvda-0411
+
+以下の操作をしたとき、アイコンの示す状態や機能が分かる読み上げがされることを確認する。
+
+- ブラウズ・モードでカーソルキー操作をして当該箇所を読み上げさせたとき
+- そのアイコンがボタンやリンクなど、フォーカスを受け取るものの場合、Tab/Shift+Tabキーの操作でフォーカスされたとき
+
+.. END_nvda-0411
+
+.. _check-example-nvda-0441:
+
+:ref:`check-0441`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0441
+ :end-before: .. END_check-0441
+
+.. BEGIN_nvda-0441
+
+* 以下の操作をしたとき、画像に関する完結な読み上げがされることを確認する。
+ - ブラウズ・モードでカーソルキー操作をして当該箇所を読み上げさせたとき
+ - その画像がリンクなど、フォーカスを受け取るものの場合、Tab/Shift+Tabキーの操作でフォーカスされたとき
+* 詳細な説明が必要な画像の場合、以下のいずれかを満たしている
+ - 当該画像の直前または直後に詳細な説明があり、ブラウズ・モードでのカーソルキー操作で読み上げさせることができる
+ - ブラウズ・モードで次/前の画像への移動（G/Shift+Gキー）を実行して当該の画像を読み上げさせたときに、詳細な説明が読み上げられる
+
+.. END_nvda-0441
+
+.. _check-example-nvda-0471:
+
+:ref:`check-0471`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0471
+ :end-before: .. END_check-0471
+
+.. BEGIN_nvda-0471
+
+ブラウズ・モードでのカーソルキー操作で当該の画像がある箇所を通過したとき、画像の存在が分かるような読み上げがされない
+
+.. END_nvda-0471
+
+.. _check-example-nvda-0531:
+
+:ref:`check-0531`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0531
+ :end-before: .. END_check-0531
+
+.. BEGIN_nvda-0531
+
+ブラウズ・モードでのカーソルキー操作で当該の画像を読み上げさせたとき、画像に含まれるテキストと同じ内容が読み上げられる
+
+.. END_nvda-0531
+
+.. _check-example-nvda-0591:
+
+:ref:`check-0591`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0591
+ :end-before: .. END_check-0591
+
+.. BEGIN_nvda-0591
+
+以下のすべてを満たしている：
+
+* ブラウズ・モードでその部分を読み上げさせたとき、何らかの操作を受け付けるものであることが分かる
+* その部分で提供されているすべての機能を、最低限フォーカス・モードにおいてキーボードで操作できる
+* 操作の結果表示が変わる場合、そのことが読み上げられる内容から理解できる
+* 操作の結果表示が変わる場合、ブラウズ・モードで変更後の表示内容を読み上げさせて確認できる
+
+.. END_nvda-0591
+
+.. _check-example-nvda-0621:
+
+:ref:`check-0621`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0621
+ :end-before: .. END_check-0621
+
+.. BEGIN_nvda-0621
+
+1. NVDAの音声設定で、「サポートされている場合自動的に言語を切り替える」と「サポートされている場合自動的に方言を切り替える」がチェックされている状態にする。（ :ref:`exp-screen-reader-check` の「その他の初期設定」、「音声」の項を参照）
+2. ブラウズ・モードで上下矢印キーを用いて読み上げさせたとき、表示されているテキストが問題なく読み上げられることを確認する。
+
+.. END_nvda-0621
+
+.. _check-example-nvda-0681:
+
+:ref:`check-0681`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0681
+ :end-before: .. END_check-0681
+
+.. BEGIN_nvda-0681
+
+以下のいずれかの方法で、本文やその画面の中心的な機能の開始位置に移動することができる。
+
+* ブラウズ・モードで、次/前の見出しへの移動（H/Shift+Hキー）を実行して、容易に本文直前の見出しに移動できる
+* ブラウズ・モードで、次のランドマークへの移動（Dキー）でmain要素の先頭部分に容易に移動でき、その直後から本文が始まっている
+
+.. END_nvda-0681
+
+.. _check-example-nvda-0711:
+
+:ref:`check-0711`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0711
+ :end-before: .. END_check-0711
+
+.. BEGIN_nvda-0711
+
+ブラウズ・モードでページ先頭からカーソルキー操作で読み上げさせたとき、自然な、意味の理解を阻害しない順序で読み上げられる
+
+.. END_nvda-0711
+
+.. _check-example-nvda-0741:
+
+:ref:`check-0741`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0741
+ :end-before: .. END_check-0741
+
+.. BEGIN_nvda-0741
+
+以下の手順で見出しリストを表示して、ページ中の見出しが過不足なく表示されていることを確認する
+
+1. ブラウズ・モードで要素リストを表示（ :kbd:`NVDA+F7` ）
+2. 「種別」を「見出し」に設定（ :kbd:`Alt+H` ）
+
+.. END_nvda-0741
+
+.. _check-example-nvda-0861:
+
+:ref:`check-0861`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0861
+ :end-before: .. END_check-0861
+
+.. BEGIN_nvda-0861
+
+ブラウズ・モードでのカーソルキー操作による読み上げで、パンくずリストやグローバル・ナビゲーションの中で現在表示中のページを表す箇所を読み上げたとき、「現在のページ」というような発声がある
+
+.. END_nvda-0861
+
+.. _check-example-nvda-0921:
+
+:ref:`check-0921`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-0921
+ :end-before: .. END_check-0921
+
+.. BEGIN_nvda-0921
+
+1. NVDAの音声設定で、「サポートされている場合自動的に言語を切り替える」と「サポートされている場合自動的に方言を切り替える」がチェックされている状態にする。（ :ref:`exp-screen-reader-check` の「その他の初期設定」、「音声」の項を参照）
+2. ブラウズ・モードで上下矢印キーを用いて読み上げさせたとき、使用されている言語に応じて読み上げに用いられる音声が切り替わることを確認する。
+
+.. END_nvda-0921
+
+.. _check-example-nvda-1191:
+
+:ref:`check-1191`
+~~~~~~~~~~~~~~~~~
+
+ .. include:: /checks/inc/allchecks.rst
+ :start-after: .. BEGIN_check-1191
+ :end-before: .. END_check-1191
+
+.. BEGIN_nvda-1191
+
+設計資料に従ってステータス・メッセージが表示される操作を行い、ステータス・メッセージが自動的に読み上げられることを確認する。
+
+参考： 期待される挙動を確認する場合は、 :ref:`exp-dynamic-content-status` に示した実装例を参照
+
+.. END_nvda-1191
diff --git a/source/checks/inc/allchecks.rst b/source/checks/inc/allchecks.rst
index b717a707..c35651fc 100644
--- a/source/checks/inc/allchecks.rst
+++ b/source/checks/inc/allchecks.rst
@@ -4,6 +4,8 @@
チェックID: 0001
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0001
+
充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
@@ -11,6 +13,8 @@
* 画像および画像化されたテキストとその隣接領域
* テキストと背景色
+.. END_check-0001
+
対象
デザイン
関連ガイドライン
@@ -30,6 +34,8 @@
チェックID: 0021
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0021
+
充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
@@ -37,6 +43,8 @@
* 画像および画像化されたテキストとその隣接領域
* テキストと背景色
+.. END_check-0021
+
対象
プロダクト
関連ガイドライン
@@ -51,17 +59,28 @@
* :ref:`exp-contrast`
+axeを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/axe.rst
+ :start-after: .. BEGIN_axe-0021
+ :end-before: .. END_axe-0021
+
.. _check-0031:
チェックID: 0031
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0031
+
グレイスケール表示でも利用に支障が出ない:
* リンク箇所を判別できる
* 画像、テキストの意図が伝わる
* 入力フォームの必須項目、エラーを認知できる
+.. END_check-0031
+
対象
デザイン
関連ガイドライン
@@ -78,6 +97,8 @@
チェックID: 0032
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0032
+
形状、色、大きさ、視覚的な位置、方向、音などが分からないと理解できないような説明をしていない。
例：
@@ -91,6 +112,8 @@
* 右の表（表3）を参照してください
* 青い「保存」ボタンを押してください
+.. END_check-0032
+
対象
デザイン
関連ガイドライン
@@ -104,12 +127,16 @@
チェックID: 0051
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0051
+
グレイスケール表示でも利用に支障が出ない:
* リンク箇所を判別できる
* 画像、テキストの意図が伝わる
* 入力フォームの必須項目、エラーを認知できる
+.. END_check-0051
+
対象
プロダクト
関連ガイドライン
@@ -126,8 +153,12 @@
チェックID: 0071
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0071
+
マウス・ボタンのdownイベントをトリガーにしていない。
+.. END_check-0071
+
対象
コード
関連ガイドライン
@@ -141,8 +172,12 @@
チェックID: 0081
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0081
+
マウス・クリックを受け付けるリンクやボタンなどは、マウス・ボタンを押下した状態でマウス・ポインターを外し、マウス・ボタンを放した場合、その機能が実行されない。（ドラッグ&ドロップは対象外）
+.. END_check-0081
+
対象
プロダクト
関連ガイドライン
@@ -156,12 +191,16 @@
チェックID: 0091
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0091
+
ホバーで表示されるすべてのコンテンツは、以下のすべてを満たしている:
* ポインターを移動させることなく、ホバーで表示されたコンテンツを非表示にできる。（ESCキーで消える、など）
* ポインターを、ホバーで表示されたコンテンツ上に移動しても、コンテンツが消えない。
* ホバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、ホバーで表示されたコンテンツを非表示にする。
+.. END_check-0091
+
対象
デザイン
関連ガイドライン
@@ -175,12 +214,16 @@
チェックID: 0111
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0111
+
ホバーで表示されるすべてのコンテンツは、以下のすべてを満たしている:
* ポインターを移動させることなく、ホバーで表示されたコンテンツを非表示にできる。（ESCキーで消える、など）
* ポインターを、ホバーで表示されたコンテンツ上に移動しても、コンテンツが消えない。
* ホバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、ホバーで表示されたコンテンツを非表示にする。
+.. END_check-0111
+
対象
プロダクト
関連ガイドライン
@@ -194,11 +237,15 @@
チェックID: 0141
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0141
+
ショートカットキーを提供していて、それが画面のどこにフォーカスがあっても作動する仕様である場合、以下のいずれかを満たしている：
* ユーザーがショートカットキーを無効にできる
* ユーザーがショートカットキーの割当を変更できる
+.. END_check-0141
+
対象
プロダクト
関連ガイドライン
@@ -212,8 +259,12 @@
チェックID: 0151
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0151
+
デフォルトのフォーカス・インジケーターを用いない場合、代替となるフォーカス・インジケーターを明示している。
+.. END_check-0151
+
対象
デザイン
関連ガイドライン
@@ -227,6 +278,8 @@
チェックID: 0152
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0152
+
Tab/Shift+Tabキーでフォーカスを移動しているときに、以下のような変化が引き起こされない：
* フォームの送信
@@ -235,6 +288,8 @@ Tab/Shift+Tabキーでフォーカスを移動しているときに、以下の
* モーダル・ダイアログの表示
* 表示内容の大幅な変更、など
+.. END_check-0152
+
対象
デザイン
関連ガイドライン
@@ -250,6 +305,8 @@ Tab/Shift+Tabキーでフォーカスを移動しているときに、以下の
チェックID: 0171
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0171
+
Tab/Shift+Tabキーによるフォーカス移動時の挙動は以下のすべてを満たしている：
* フォーカス・インジケーターまたはそれを代替する表示がある
@@ -261,6 +318,8 @@ Tab/Shift+Tabキーによるフォーカス移動時の挙動は以下のすべ
- モーダル・ダイアログの表示
- 表示内容の大幅な変更など
+.. END_check-0171
+
対象
プロダクト
関連ガイドライン
@@ -277,12 +336,16 @@ Tab/Shift+Tabキーによるフォーカス移動時の挙動は以下のすべ
チェックID: 0172
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0172
+
Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイアウト、操作手順に即した自然な順序でフォーカスが移動する。
* リンクとボタン
* フォーム・コントロール
* その他、マウスやキーボードによる操作を受け付けるすべてのもの
+.. END_check-0172
+
対象
プロダクト
関連ガイドライン
@@ -300,8 +363,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0201
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0201
+
動画プレイヤーのような、何らかの機能を提供するためにページ中に埋め込まれているプログラムなどにフォーカスがある状態のとき、Tab, Shift+Tab, 矢印キー、ESCキーのいずれかの操作で、埋め込まれているものの外の領域にあるリンクなどにフォーカスを移動することができ、自動的にフォーカスが元の位置に戻されない。
+.. END_check-0201
+
対象
プロダクト
関連ガイドライン
@@ -316,8 +383,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0211
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0211
+
クリックやホバーなどのマウス操作を受け付けるものは、キーボードのみでも操作できる。
+.. END_check-0211
+
対象
デザイン
関連ガイドライン
@@ -331,8 +402,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0231
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0231
+
クリックやホバーなどのマウス操作を受け付けるものは、キーボードのみでも操作できる。
+.. END_check-0231
+
対象
プロダクト
関連ガイドライン
@@ -346,8 +421,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0241
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0241
+
リンク・テキストは「こちら」などになっておらず、リンク・テキストの文言から遷移先をある程度推測できるようになっている。
+.. END_check-0241
+
対象
デザイン
関連ガイドライン
@@ -358,8 +437,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0242
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0242
+
同じ文脈において、遷移先が同じリンク、目的が同じボタンには、一貫したテキストやアイコンが使われている。
+.. END_check-0242
+
対象
デザイン
関連ガイドライン
@@ -371,9 +454,13 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0261
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0261
+
* 「○○はこちら」の「こちら」の部分だけがリンクになっていない。（この場合は「○○はこちら」全体をリンクにする。）、または
* リンク・テキストの意図がマークアップで明確になっている。
+.. END_check-0261
+
対象
プロダクト
関連ガイドライン
@@ -384,8 +471,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0262
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0262
+
同じ文脈において、遷移先が同じリンク、目的が同じボタンには、一貫したテキストやアイコンが使われている。
+.. END_check-0262
+
対象
プロダクト
関連ガイドライン
@@ -397,8 +488,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0271
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0271
+
見出しのテキストは、内容を適切に示す文言になっている。
+.. END_check-0271
+
対象
デザイン
関連ガイドライン
@@ -412,8 +507,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0311
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0311
+
文字サイズの指定において、絶対値指定（例：px）と相対値指定（例：rem）が混在していない。
+.. END_check-0311
+
対象
コード
関連ガイドライン
@@ -427,8 +526,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0321
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0321
+
ブラウザーのズーム機能で200パーセントまで拡大しても、テキストの理解を妨げるようなレイアウト崩れが起こらない。
+.. END_check-0321
+
対象
プロダクト
関連ガイドライン
@@ -442,11 +545,15 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0322
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0322
+
1280x1024のサイズのウィンドウにおいて400パーセントの拡大表示をしたときに適切にリフローされ
* 縦書きのコンテンツでは縦スクロールが、横書きのコンテンツでは横スクロールが発声しない、かつ
* 読み取れない内容や利用できない機能がない
+.. END_check-0322
+
対象
プロダクト
関連ガイドライン
@@ -460,8 +567,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0323
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0323
+
ブラウザーの文字サイズ変更機能で200パーセントの拡大表示をする設定をしても、テキストの理解を妨げるようなレイアウト崩れが起こらない。
+.. END_check-0323
+
対象
プロダクト
関連ガイドライン
@@ -475,8 +586,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0324
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0324
+
ブラウザーの文字サイズ変更機能で200パーセントまで拡大することができ、その際テキストの理解を妨げるようなレイアウト崩れが起こらない。
+.. END_check-0324
+
対象
プロダクト
関連ガイドライン
@@ -490,8 +605,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0331
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0331
+
ボタンなどのサイズが充分に大きいことを確認している。
+.. END_check-0331
+
対象
デザイン
関連ガイドライン
@@ -506,8 +625,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0351
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0351
+
想定環境におけるクリッカブルなエリアのサイズが充分に大きいことを確認できている。
+.. END_check-0351
+
対象
プロダクト
関連ガイドライン
@@ -522,9 +645,13 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0361
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0361
+
* 特定の入力ディバイスで発生するイベントのみをトリガーにした機能がない。かつ
* 使用できる入力ディバイスを、特定の時点で検出されたものに限定していない。
+.. END_check-0361
+
対象
デザイン
関連ガイドライン
@@ -538,10 +665,14 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0391
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0391
+
* アイコンには、その役割や示している状態を表すテキスト・ラベルが併せて表示されている。または
* テキスト・ラベルを表示できない場合、色の違いだけでアイコンの意味の違いを表さず、形状（モチーフ）やサイズでも違いを示している。かつ
* 役割や意味がわかる alt 属性の値を設計資料で明示している。
+.. END_check-0391
+
対象
デザイン
関連ガイドライン
@@ -553,10 +684,14 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0401
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0401
+
* アイコンの役割や示している状態を表すテキストが表示されていて、 ``aria-labelledby`` 属性で関連付けられている。または
* ``alt`` 属性または ``aria-label`` 属性で、そのようなテキストが指定されている。
* 開発者ツールで確認すると、Accessible Nameに適切なテキストが設定されている状態になっている。
+.. END_check-0401
+
対象
コード
関連ガイドライン
@@ -567,20 +702,35 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0411
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0411
+
アイコンの役割や示している状態が分かるテキストが、スクリーン・リーダーで読み上げられる。
+.. END_check-0411
+
対象
プロダクト
関連ガイドライン
* アイコン： :ref:`gl-icon-visible-label`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0411
+ :end-before: .. END_nvda-0411
+
.. _check-0412:
チェックID: 0412
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0412
+
テキストのラベルが併せて表示されていないアイコンで、形状とサイズが同じで色だけが違うものがない。（例：異なる状態を表す複数のアイコンが、色の違いだけで状態の違いを表していない。）
+.. END_check-0412
+
対象
プロダクト
関連ガイドライン
@@ -591,9 +741,13 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0421
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0421
+
* 画像に関する簡潔で過不足ない説明（ ``alt`` 属性値）が、設計資料で明示されている。かつ
* 短いテキストでは充分に説明できない場合には、詳細な説明のテキストが設計資料で明示されている。
+.. END_check-0421
+
対象
デザイン
関連ガイドライン
@@ -607,9 +761,13 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0431
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0431
+
* 画像に関する簡潔で過不足ない説明が ``alt`` 属性や ``aria-label`` 属性で付加されている。かつ
* 詳細な説明が必要な場合には、その説明が当該の画像の直前または直後に表示されている、または ``aria-describedby`` 属性で関連付けられている。
+.. END_check-0431
+
対象
コード
関連ガイドライン
@@ -623,8 +781,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0441
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0441
+
画像の説明が適切に読み上げられる。
+.. END_check-0441
+
対象
プロダクト
関連ガイドライン
@@ -633,13 +795,31 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
* :ref:`exp-image-text-alternative`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0441
+ :end-before: .. END_nvda-0441
+
+axeを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/axe.rst
+ :start-after: .. BEGIN_axe-0441
+ :end-before: .. END_axe-0441
+
.. _check-0451:
チェックID: 0451
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0451
+
情報や機能性を一切持たない画像は、説明のテキストを付加してはならないことが設計資料で明示されている。
+.. END_check-0451
+
対象
デザイン
関連ガイドライン
@@ -653,8 +833,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0461
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0461
+
情報や機能性を一切持たない画像には、空の ``alt`` 属性（ ``alt=""`` ）や ``role="presentation"`` が付与されていて、スクリーン・リーダーで読み上げられない。
+.. END_check-0461
+
対象
コード
関連ガイドライン
@@ -668,8 +852,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0471
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0471
+
情報や機能性を一切持たない画像は、スクリーン・リーダーで読み上げられない。
+.. END_check-0471
+
対象
プロダクト
関連ガイドライン
@@ -678,13 +866,24 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
* :ref:`exp-image-text-alternative`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0471
+ :end-before: .. END_nvda-0471
+
.. _check-0481:
チェックID: 0481
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0481
+
自社および他者のロゴ、バナー、図や写真の中の文字列を除いて、画像化されたテキストがない。
+.. END_check-0481
+
対象
デザイン
関連ガイドライン
@@ -698,8 +897,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0501
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0501
+
自社および他者のロゴ、バナー、図や写真の中の文字列を除いて、画像化されたテキストがない。
+.. END_check-0501
+
対象
プロダクト
関連ガイドライン
@@ -713,8 +916,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0521
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0521
+
画像化されているテキストと同じ内容が ``alt`` 属性または ``aria-label`` 属性で示されていて、スクリーン・リーダーなとで確認できる。
+.. END_check-0521
+
対象
コード
関連ガイドライン
@@ -728,8 +935,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0531
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0531
+
画像化されているテキストと同じ内容がスクリーン・リーダーなとで確認できる。
+.. END_check-0531
+
対象
プロダクト
関連ガイドライン
@@ -738,13 +949,24 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
* :ref:`exp-iot-text-alternative`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0531
+ :end-before: .. END_nvda-0531
+
.. _check-0541:
チェックID: 0541
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0541
+
見出し（ ``h1`` ～ ``h6`` ）、箇条書き（ ``ul``, ``ol``, ``dl`` ）、表（ ``table`` ）など、HTMLのセマンティクスで表現できるものがそれらで表現されるよう、設計資料で明示されている。
+.. END_check-0541
+
対象
デザイン
関連ガイドライン
@@ -755,8 +977,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0551
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0551
+
見出し（ ``h1`` ～ ``h6`` ）、箇条書き（ ``ul``, ``ol``, ``dl`` ）、表（ ``table`` ）などを用いてセマンティクスが適切にマークアップされている。
+.. END_check-0551
+
対象
コード
関連ガイドライン
@@ -767,8 +993,12 @@ Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイア
チェックID: 0571
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0571
+
validatorやlinterでチェックが通る。
+.. END_check-0571
+
対象
コード
関連ガイドライン
@@ -782,8 +1012,12 @@ validatorやlinterでチェックが通る。
チェックID: 0591
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0591
+
静的なテキストではない部分（例：開閉するメニュー、タブ・パネル、日付選択UI）も、スクリーン・リーダーで問題なく操作できる。
+.. END_check-0591
+
対象
プロダクト
関連ガイドライン
@@ -792,13 +1026,24 @@ validatorやlinterでチェックが通る。
* :ref:`exp-markup-component`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0591
+ :end-before: .. END_nvda-0591
+
.. _check-0611:
チェックID: 0611
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0611
+
日本語のページには、 ```` の記述がある。
+.. END_check-0611
+
対象
コード
関連ガイドライン
@@ -807,13 +1052,43 @@ validatorやlinterでチェックが通る。
* :ref:`exp-text-lang`
+.. _check-0621:
+
+チェックID: 0621
+~~~~~~~~~~~~~~~~~~
+
+.. BEGIN_check-0621
+
+多言語対応している読み上げ環境を用いて読み上げさせたとき、適切な言語の音声エンジンで読み上げられる。
+
+.. END_check-0621
+
+対象
+ プロダクト
+関連ガイドライン
+ * テキスト： :ref:`gl-text-page-lang`
+参考情報
+ * :ref:`exp-text-lang`
+
+
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0621
+ :end-before: .. END_nvda-0621
+
.. _check-0631:
チェックID: 0631
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0631
+
そのページの目的を示し、かつ他のページとは異なる ページ・タイトル（ ``title`` 要素）が設計資料で定義されている。
+.. END_check-0631
+
対象
デザイン
関連ガイドライン
@@ -827,8 +1102,12 @@ validatorやlinterでチェックが通る。
チェックID: 0651
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0651
+
そのページの目的を示し、かつ他のページとは異なるページ・タイトルが付けられている。（ブラウザーのタイトルバー/タブバーに表示されている。）
+.. END_check-0651
+
対象
プロダクト
関連ガイドライン
@@ -842,8 +1121,12 @@ validatorやlinterでチェックが通る。
チェックID: 0661
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0661
+
ページのどの部分がそれぞれ ``header``, ``nav``, ``main``, ``footer`` 要素でマークアップされるべきかが、複数のページで一貫した形で設計資料に明示されている。
+.. END_check-0661
+
対象
デザイン
関連ガイドライン
@@ -858,9 +1141,13 @@ validatorやlinterでチェックが通る。
チェックID: 0671
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0671
+
* ``header``, ``main``, ``nav``, ``footer`` の各要素が適切に用いられている。または
* これらが ``role`` 属性で明示されている。
+.. END_check-0671
+
対象
コード
関連ガイドライン
@@ -874,9 +1161,13 @@ validatorやlinterでチェックが通る。
チェックID: 0672
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0672
+
* ``main`` 要素が本文の開始位置を反映している。または
* 本文の先頭部分に ``h1`` 要素や ``h2`` 要素でマークアップされた見出しがある。
+.. END_check-0672
+
対象
コード
関連ガイドライン
@@ -890,8 +1181,12 @@ validatorやlinterでチェックが通る。
チェックID: 0681
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0681
+
スクリーン・リーダーの見出しジャンプ機能やリージョン間ジャンプ機能で本文の開始位置を見つけることができる。
+.. END_check-0681
+
対象
プロダクト
関連ガイドライン
@@ -900,13 +1195,24 @@ validatorやlinterでチェックが通る。
* :ref:`exp-page-structure`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0681
+ :end-before: .. END_nvda-0681
+
.. _check-0711:
チェックID: 0711
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0711
+
ページの状態が変化したときも含めて、スクリーン・リーダーで読み上げさせた時、内容的、および視覚的に自然な順序で読み上げられる。
+.. END_check-0711
+
対象
プロダクト
関連ガイドライン
@@ -916,13 +1222,24 @@ validatorやlinterでチェックが通る。
* :ref:`exp-dynamic-content-maintain-dom-tree`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0711
+ :end-before: .. END_nvda-0711
+
.. _check-0721:
チェックID: 0721
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0721
+
ページ内の機能や内容の区切り、本分の先頭部分などに適切に見出しが配置されている。
+.. END_check-0721
+
対象
デザイン
関連ガイドライン
@@ -936,8 +1253,12 @@ validatorやlinterでチェックが通る。
チェックID: 0731
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0731
+
``h1`` ～ ``h6`` 要素で見出しが適切にマークアップされている。
+.. END_check-0731
+
対象
コード
関連ガイドライン
@@ -951,8 +1272,12 @@ validatorやlinterでチェックが通る。
チェックID: 0741
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0741
+
スクリーン・リーダーが見出しを適切に見出しとして認識している。
+.. END_check-0741
+
対象
プロダクト
関連ガイドライン
@@ -961,13 +1286,24 @@ validatorやlinterでチェックが通る。
* :ref:`exp-page-structure`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0741
+ :end-before: .. END_nvda-0741
+
.. _check-0751:
チェックID: 0751
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0751
+
特定の画面方向に固定した使用を前提としたデザインになっていない。
+.. END_check-0751
+
対象
デザイン
関連ガイドライン
@@ -981,8 +1317,12 @@ validatorやlinterでチェックが通る。
チェックID: 0771
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0771
+
画面方向を検知できる端末において、端末の方向を変えると適切に画面が回転する。
+.. END_check-0771
+
対象
プロダクト
関連ガイドライン
@@ -996,9 +1336,13 @@ validatorやlinterでチェックが通る。
チェックID: 0781
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0781
+
* グローバル・ナビゲーション、ヘッダー、フッター、パンくずリスト、サポートUIなど、複数のページで共通に用いられているページの構成要素は、すべてのページで同じ出現順序になっている。かつ
* これらの構成要素の中でのリンクやボタンの出現順序はすべてのページで同じになっている。
+.. END_check-0781
+
対象
デザイン
関連ガイドライン
@@ -1012,9 +1356,13 @@ validatorやlinterでチェックが通る。
チェックID: 0801
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0801
+
* グローバル・ナビゲーション、ヘッダー、フッター、パンくずリスト、サポートUIなど、複数のページで共通に用いられているページの構成要素は、すべてのページで同じ出現順序になっている。かつ
* これらの構成要素の中でのリンクやボタンの出現順序はすべてのページで同じになっている。
+.. END_check-0801
+
対象
プロダクト
関連ガイドライン
@@ -1028,6 +1376,8 @@ validatorやlinterでチェックが通る。
チェックID: 0811
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0811
+
そのページへの到達手段が複数ある。
例：
@@ -1036,6 +1386,8 @@ validatorやlinterでチェックが通る。
* 特定のページ中のリンクから遷移することに加えて、サイト内検索機能からも遷移できる。
* ヘルプ・ページ中のリンクからも遷移できる。
+.. END_check-0811
+
対象
デザイン
関連ガイドライン
@@ -1049,8 +1401,12 @@ validatorやlinterでチェックが通る。
チェックID: 0841
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0841
+
グローバル・ナビゲーション内の表示やいわゆるパンくずリストで、そのページのサイト内での位置が明示されている。
+.. END_check-0841
+
対象
デザイン
関連ガイドライン
@@ -1064,8 +1420,12 @@ validatorやlinterでチェックが通る。
チェックID: 0851
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0851
+
``aria-current`` 属性を用いて、グローバル・ナビゲーションやパンくずリスト内でそのページの位置が明示されている。
+.. END_check-0851
+
対象
コード
関連ガイドライン
@@ -1079,8 +1439,12 @@ validatorやlinterでチェックが通る。
チェックID: 0861
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0861
+
スクリーン・リーダーで、グローバル・ナビゲーションやパンくずリスト内でそのページの位置が分かるような読み上げがされる。
+.. END_check-0861
+
対象
プロダクト
関連ガイドライン
@@ -1089,13 +1453,24 @@ validatorやlinterでチェックが通る。
* :ref:`exp-page-navigation`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0861
+ :end-before: .. END_nvda-0861
+
.. _check-0862:
チェックID: 0862
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0862
+
グローバル・ナビゲーションやパンくずリスト内でそのページの位置が分かるような表示がされている。
+.. END_check-0862
+
対象
プロダクト
関連ガイドライン
@@ -1109,8 +1484,12 @@ validatorやlinterでチェックが通る。
チェックID: 0891
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0891
+
line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.12em以上に変更するユーザーCSSを適用しても、表示順序が変わる、文章を途中で読めなくなるなど、コンテンツおよび機能に損失が生じない。
+.. END_check-0891
+
対象
プロダクト
関連ガイドライン
@@ -1124,8 +1503,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 0911
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0911
+
複数の言語が含まれているテキストについて、適切に ``lang`` 属性が指定されている。
+.. END_check-0911
+
対象
コード
関連ガイドライン
@@ -1139,8 +1522,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 0921
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0921
+
複数の言語が含まれているテキストについて、iOS VoiceOverのように多言語対応している読み上げ環境を用いて読み上げさせたとき、適切な言語の音声エンジンで読み上げられる。
+.. END_check-0921
+
対象
プロダクト
関連ガイドライン
@@ -1149,14 +1536,25 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
* :ref:`exp-text-lang`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-0921
+ :end-before: .. END_nvda-0921
+
.. _check-0931:
チェックID: 0931
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0931
+
* フォーム・コントロールについて、役割が分かり、画面上に表示されているテキストまたは代替テキストが付加された画像を、ラベルとして設計資料に定義している。または
* ``aria-label`` 属性値として指定すべき、フォーム・コントロールの役割を示すテキストを設計資料に定義している。
+.. END_check-0931
+
対象
デザイン
関連ガイドライン
@@ -1171,10 +1569,14 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 0941
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0941
+
* フォーム・コントロールは、ラベルとなるテキストまたは画像と ``label`` 要素または ``aria-labelledby`` 属性で関連付けられている。または
* ``aria-label`` 属性で適切なラベルが付けられている。
* 開発者ツールで確認するとフォーム・コントロールのaccessible nameに役割が分かるテキストが指定されている状態になっている。
+.. END_check-0941
+
対象
コード
関連ガイドライン
@@ -1189,9 +1591,13 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 0951
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0951
+
* フォーム・コントロールの役割が分かるテキストまたは代替テキストが付加された画像がラベルとして表示されていて、このテキストをクリックすると当該のフォーム・コントロールにフォーカスが移動する。または
* スクリーン・リーダーでフォーム・コントロールとラベルの関連付けが分かるような読み上げがされる。
+.. END_check-0951
+
対象
プロダクト
関連ガイドライン
@@ -1201,11 +1607,20 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
* :ref:`exp-form-labeling`
+axeを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/axe.rst
+ :start-after: .. BEGIN_axe-0951
+ :end-before: .. END_axe-0951
+
.. _check-0961:
チェックID: 0961
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0961
+
フォームの入力に制限時間を設ける場合：
* 事前にユーザーがその制限時間を解除することができる。又は、
@@ -1215,6 +1630,8 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
* 制限時間が必要不可欠なもので、制限時間を延長することがフォームを無効にすることになる。又は、
* 制限時間が20時間よりも長い。
+.. END_check-0961
+
対象
デザイン
関連ガイドライン
@@ -1228,8 +1645,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 0991
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-0991
+
フォーム入力に制限時間が設けられていない。
+.. END_check-0991
+
対象
デザイン
関連ガイドライン
@@ -1243,8 +1664,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1021
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1021
+
制限時間が設定されているフォームの入力中に制限時間が超過した場合、それまでの入力内容を失うことなく入力を再開できるようになっている。
+.. END_check-1021
+
対象
デザイン
関連ガイドライン
@@ -1258,8 +1683,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1051
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1051
+
フォーム中のフィールドの値の変更や、値変更後のフォーカス移動がトリガーとなって、ページ全体に及ぶような大幅な表示内容の変更、ページ遷移、別のフィールドの値の変更が起こらない。
+.. END_check-1051
+
対象
デザイン
関連ガイドライン
@@ -1273,8 +1702,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1071
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1071
+
フォーム中のフィールドの値の変更や、値変更後のフォーカス移動がトリガーとなって、ページ全体に及ぶような大幅な表示内容の変更、ページ遷移、別のフィールドの値の変更が起こらない。
+.. END_check-1071
+
対象
プロダクト
関連ガイドライン
@@ -1288,8 +1721,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1081
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1081
+
フォーム入力でエラーが発生したとき、エラー内容が分かる具体的な表示文言が設計資料で定義されている
+.. END_check-1081
+
対象
デザイン
関連ガイドライン
@@ -1303,8 +1740,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1101
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1101
+
フォーム入力に関するエラー発生時には、エラーの内容が具体的に分かるテキスト情報が表示される。
+.. END_check-1101
+
対象
プロダクト
関連ガイドライン
@@ -1318,8 +1759,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1111
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1111
+
フォーム入力に関するエラー・メッセージには、エラーの修正方法が示されている。
+.. END_check-1111
+
対象
デザイン
関連ガイドライン
@@ -1333,8 +1778,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1131
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1131
+
フォーム入力に関するエラー・メッセージには、エラーの修正方法が示されている。
+.. END_check-1131
+
対象
プロダクト
関連ガイドライン
@@ -1348,8 +1797,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1141
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1141
+
法的行為、経済的取引、データの変更や削除を生じる機能については、取り消し、送信前の確認・修正、または送信時のエラー・チェックと修正が可能になっている。
+.. END_check-1141
+
対象
デザイン
関連ガイドライン
@@ -1363,8 +1816,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1171
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1171
+
ステータス・メッセージとして扱われるべきメッセージ、すなわち表示時や変更時に自動的に読み上げられる必要があるメッセージが、設計資料で特定されている。
+.. END_check-1171
+
対象
デザイン
関連ガイドライン
@@ -1378,8 +1835,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1181
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1181
+
操作の結果などを伝えるステータス・メッセージには適切に ``aria-live`` 属性が付与されている。
+.. END_check-1181
+
対象
コード
関連ガイドライン
@@ -1393,8 +1854,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1191
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1191
+
操作の結果などを伝えるステータス・メッセージは、スクリーン・リーダーで自動的に読み上げられる。
+.. END_check-1191
+
対象
プロダクト
関連ガイドライン
@@ -1403,13 +1868,24 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
* :ref:`exp-dynamic-content-status`
+NVDAを用いたチェック実施方法の例
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+.. include:: /checks/examples/nvda.rst
+ :start-after: .. BEGIN_nvda-1191
+ :end-before: .. END_nvda-1191
+
.. _check-1201:
チェックID: 1201
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1201
+
点滅、スクロールを伴うコンテンツがない。
+.. END_check-1201
+
対象
デザイン
関連ガイドライン
@@ -1423,8 +1899,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1221
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1221
+
点滅、スクロールを伴うコンテンツがない。
+.. END_check-1221
+
対象
プロダクト
関連ガイドライン
@@ -1438,9 +1918,13 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1231
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1231
+
* 自動更新されるコンテンツがない。または
* ユーザーが自動更新の間隔やタイミングの変更、自動更新の停止をできる。
+.. END_check-1231
+
対象
デザイン
関連ガイドライン
@@ -1454,9 +1938,13 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1251
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1251
+
* 自動更新されるコンテンツがない。または
* ユーザーが自動更新の間隔やタイミングの変更、自動更新の停止をできる。
+.. END_check-1251
+
対象
プロダクト
関連ガイドライン
@@ -1470,8 +1958,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1261
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1261
+
1秒間に3回以上光るコンテンツがない。
+.. END_check-1261
+
対象
デザイン
関連ガイドライン
@@ -1485,8 +1977,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1281
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1281
+
1秒間に3回以上光るコンテンツがない。
+.. END_check-1281
+
対象
プロダクト
関連ガイドライン
@@ -1500,8 +1996,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1291
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1291
+
ユーザーが予期しない形で発生する、画面の内容を大きく変更するような通知や自動的に表示されるモーダル・ダイアログがない。
+.. END_check-1291
+
対象
デザイン
関連ガイドライン
@@ -1515,8 +2015,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1311
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1311
+
ユーザーが予期しない形で発生する、画面の内容を大きく変更するような通知や自動的に表示されるモーダル・ダイアログがない。
+.. END_check-1311
+
対象
プロダクト
関連ガイドライン
@@ -1530,6 +2034,8 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1321
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1321
+
ログイン・セッションにタイムアウトを設ける場合：
* ログイン時などに、ユーザーがセッション・タイムアウトの設定を解除することができる。又は、
@@ -1538,6 +2044,8 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
* タイムアウトが必要不可欠なもので、タイムアウトを延長することがコンテンツの動作を無効にすることになる。又は、
* タイムアウトが20時間よりも長い。
+.. END_check-1321
+
対象
デザイン
関連ガイドライン
@@ -1551,8 +2059,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1351
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1351
+
ログイン・セッションに有効期限が設定されていない。
+.. END_check-1351
+
対象
デザイン
関連ガイドライン
@@ -1566,8 +2078,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1381
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1381
+
ログイン・セッションがタイムアウトした場合、再認証後にデータを失うことなくユーザーが操作を継続できるようになっている。
+.. END_check-1381
+
対象
デザイン
関連ガイドライン
@@ -1581,9 +2097,13 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1411
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1411
+
* ページ内に埋め込まれる音声/動画プレイヤーについて、適切なラベル付けがされていてそこにプレイヤーがあることが容易に認知できるようになっている。または
* 前後のテキストから、そこにプレイヤーがあることが推測できる。
+.. END_check-1411
+
対象
プロダクト
関連ガイドライン
@@ -1597,8 +2117,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1421
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1421
+
3秒以上の長さの自動再生される音声コンテンツがない。
+.. END_check-1421
+
対象
デザイン
関連ガイドライン
@@ -1612,8 +2136,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1441
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1441
+
3秒以上の長さの自動再生される音声コンテンツがない。
+.. END_check-1441
+
対象
プロダクト
関連ガイドライン
@@ -1627,9 +2155,13 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1451
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1451
+
* 自動的に開始し5秒以上続く動画、アニメーションがない。または
* 動画やアニメーションを呈し、一時停止、または非表示にすることができる。
+.. END_check-1451
+
対象
デザイン
関連ガイドライン
@@ -1640,9 +2172,13 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1471
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1471
+
* 自動的に開始し5秒以上続く動画、アニメーションがない。または
* 動画やアニメーションを呈し、一時停止、または非表示にすることができる。
+.. END_check-1471
+
対象
プロダクト
関連ガイドライン
@@ -1653,8 +2189,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1481
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1481
+
音声・映像コンテンツは、そのコンテンツがなくても不足なく情報が伝わるような内容で、そのコンテンツがテキスト情報の代替もしくは補助的な位置づけであることが明示されている。
+.. END_check-1481
+
対象
デザイン
関連ガイドライン
@@ -1668,8 +2208,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1501
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1501
+
音声・映像コンテンツは、そのコンテンツがなくても不足なく情報が伝わるような内容で、そのコンテンツがテキスト情報の代替もしくは補助的な位置づけであることが明示されている。
+.. END_check-1501
+
対象
プロダクト
関連ガイドライン
@@ -1683,8 +2227,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1531
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1531
+
音声を含むコンテンツには、同期したキャプションが提供されている。
+.. END_check-1531
+
対象
プロダクト
関連ガイドライン
@@ -1698,10 +2246,14 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1561
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1561
+
* 動画は、元々収録されている音声トラックの内容から容易に映像を推測できる。または
* 動画には音声解説が含まれている。または
* 映像に関するテキストによる説明が提供されている。
+.. END_check-1561
+
対象
プロダクト
関連ガイドライン
@@ -1715,8 +2267,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1591
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1591
+
映像がない音声のみのコンテンツについて、音声を書き起こしたテキストが提供されている。
+.. END_check-1591
+
対象
プロダクト
関連ガイドライン
@@ -1730,8 +2286,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1621
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1621
+
動画の音声情報には同期した手話通訳が提供されている。
+.. END_check-1621
+
対象
プロダクト
関連ガイドライン
@@ -1745,8 +2305,12 @@ line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.
チェックID: 1651
~~~~~~~~~~~~~~~~~~
+.. BEGIN_check-1651
+
音声コンテンツについて、充分に聴き取りやすい。
+.. END_check-1651
+
対象
プロダクト
関連ガイドライン
diff --git a/source/checks/inc/gl-dynamic-content-focus.rst b/source/checks/inc/gl-dynamic-content-focus.rst
index 3e2b170b..3b183a90 100644
--- a/source/checks/inc/gl-dynamic-content-focus.rst
+++ b/source/checks/inc/gl-dynamic-content-focus.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0152`）
+デザイン（ :ref:`check-0152` ）
* Tab/Shift+Tabキーでフォーカスを移動しているときに、以下のような変化が引き起こされない：
* フォームの送信
@@ -6,7 +6,7 @@
* ページの遷移
* モーダル・ダイアログの表示
* 表示内容の大幅な変更、など
-プロダクト（:ref:`check-0171`）
+プロダクト（ :ref:`check-0171` ）
* Tab/Shift+Tabキーによるフォーカス移動時の挙動は以下のすべてを満たしている：
* フォーカス・インジケーターまたはそれを代替する表示がある
diff --git a/source/checks/inc/gl-dynamic-content-hover.rst b/source/checks/inc/gl-dynamic-content-hover.rst
index cdcc830b..85e43857 100644
--- a/source/checks/inc/gl-dynamic-content-hover.rst
+++ b/source/checks/inc/gl-dynamic-content-hover.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0091`）、プロダクト（:ref:`check-0111`）
+デザイン（ :ref:`check-0091` ）、プロダクト（ :ref:`check-0111` ）
* ホバーで表示されるすべてのコンテンツは、以下のすべてを満たしている:
* ポインターを移動させることなく、ホバーで表示されたコンテンツを非表示にできる。（ESCキーで消える、など）
diff --git a/source/checks/inc/gl-dynamic-content-maintain-dom-tree.rst b/source/checks/inc/gl-dynamic-content-maintain-dom-tree.rst
index 64b493cf..aba393ce 100644
--- a/source/checks/inc/gl-dynamic-content-maintain-dom-tree.rst
+++ b/source/checks/inc/gl-dynamic-content-maintain-dom-tree.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0711`）
+プロダクト（ :ref:`check-0711` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* ページの状態が変化したときも含めて、スクリーン・リーダーで読み上げさせた時、内容的、および視覚的に自然な順序で読み上げられる。
diff --git a/source/checks/inc/gl-dynamic-content-no-flashing.rst b/source/checks/inc/gl-dynamic-content-no-flashing.rst
index db398e0e..6a3eb19a 100644
--- a/source/checks/inc/gl-dynamic-content-no-flashing.rst
+++ b/source/checks/inc/gl-dynamic-content-no-flashing.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1261`）、プロダクト（:ref:`check-1281`）
+デザイン（ :ref:`check-1261` ）、プロダクト（ :ref:`check-1281` ）
* 1秒間に3回以上光るコンテンツがない。
diff --git a/source/checks/inc/gl-dynamic-content-no-interrupt.rst b/source/checks/inc/gl-dynamic-content-no-interrupt.rst
index f3070ce5..f7391d92 100644
--- a/source/checks/inc/gl-dynamic-content-no-interrupt.rst
+++ b/source/checks/inc/gl-dynamic-content-no-interrupt.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1291`）、プロダクト（:ref:`check-1311`）
+デザイン（ :ref:`check-1291` ）、プロダクト（ :ref:`check-1311` ）
* ユーザーが予期しない形で発生する、画面の内容を大きく変更するような通知や自動的に表示されるモーダル・ダイアログがない。
diff --git a/source/checks/inc/gl-dynamic-content-pause-movement.rst b/source/checks/inc/gl-dynamic-content-pause-movement.rst
index 02d13c09..a71a208d 100644
--- a/source/checks/inc/gl-dynamic-content-pause-movement.rst
+++ b/source/checks/inc/gl-dynamic-content-pause-movement.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1201`）、プロダクト（:ref:`check-1221`）
+デザイン（ :ref:`check-1201` ）、プロダクト（ :ref:`check-1221` ）
* 点滅、スクロールを伴うコンテンツがない。
diff --git a/source/checks/inc/gl-dynamic-content-pause-refresh.rst b/source/checks/inc/gl-dynamic-content-pause-refresh.rst
index 675a9011..e646895a 100644
--- a/source/checks/inc/gl-dynamic-content-pause-refresh.rst
+++ b/source/checks/inc/gl-dynamic-content-pause-refresh.rst
@@ -1,3 +1,3 @@
-デザイン（:ref:`check-1231`）、プロダクト（:ref:`check-1251`）
+デザイン（ :ref:`check-1231` ）、プロダクト（ :ref:`check-1251` ）
* 自動更新されるコンテンツがない。または
* ユーザーが自動更新の間隔やタイミングの変更、自動更新の停止をできる。
diff --git a/source/checks/inc/gl-dynamic-content-status.rst b/source/checks/inc/gl-dynamic-content-status.rst
index 273d61c3..70201d53 100644
--- a/source/checks/inc/gl-dynamic-content-status.rst
+++ b/source/checks/inc/gl-dynamic-content-status.rst
@@ -1,6 +1,6 @@
-デザイン（:ref:`check-1171`）
+デザイン（ :ref:`check-1171` ）
* ステータス・メッセージとして扱われるべきメッセージ、すなわち表示時や変更時に自動的に読み上げられる必要があるメッセージが、設計資料で特定されている。
-コード（:ref:`check-1181`）
+コード（ :ref:`check-1181` ）
* 操作の結果などを伝えるステータス・メッセージには適切に ``aria-live`` 属性が付与されている。
-プロダクト（:ref:`check-1191`）
+プロダクト（ :ref:`check-1191` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* 操作の結果などを伝えるステータス・メッセージは、スクリーン・リーダーで自動的に読み上げられる。
diff --git a/source/checks/inc/gl-form-color-only.rst b/source/checks/inc/gl-form-color-only.rst
index 0a3f4acc..346ec441 100644
--- a/source/checks/inc/gl-form-color-only.rst
+++ b/source/checks/inc/gl-form-color-only.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0031`）、プロダクト（:ref:`check-0051`）
+デザイン（ :ref:`check-0031` ）、プロダクト（ :ref:`check-0051` ）
* グレイスケール表示でも利用に支障が出ない:
* リンク箇所を判別できる
diff --git a/source/checks/inc/gl-form-continue.rst b/source/checks/inc/gl-form-continue.rst
index db0f27e4..3f6c920d 100644
--- a/source/checks/inc/gl-form-continue.rst
+++ b/source/checks/inc/gl-form-continue.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1021`）
+デザイン（ :ref:`check-1021` ）
* 制限時間が設定されているフォームの入力中に制限時間が超過した場合、それまでの入力内容を失うことなく入力を再開できるようになっている。
diff --git a/source/checks/inc/gl-form-dynamic-content-change.rst b/source/checks/inc/gl-form-dynamic-content-change.rst
index ab6169d2..dc141458 100644
--- a/source/checks/inc/gl-form-dynamic-content-change.rst
+++ b/source/checks/inc/gl-form-dynamic-content-change.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1051`）、プロダクト（:ref:`check-1071`）
+デザイン（ :ref:`check-1051` ）、プロダクト（ :ref:`check-1071` ）
* フォーム中のフィールドの値の変更や、値変更後のフォーカス移動がトリガーとなって、ページ全体に及ぶような大幅な表示内容の変更、ページ遷移、別のフィールドの値の変更が起こらない。
diff --git a/source/checks/inc/gl-form-dynamic-content-focus.rst b/source/checks/inc/gl-form-dynamic-content-focus.rst
index 3e2b170b..3b183a90 100644
--- a/source/checks/inc/gl-form-dynamic-content-focus.rst
+++ b/source/checks/inc/gl-form-dynamic-content-focus.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0152`）
+デザイン（ :ref:`check-0152` ）
* Tab/Shift+Tabキーでフォーカスを移動しているときに、以下のような変化が引き起こされない：
* フォームの送信
@@ -6,7 +6,7 @@
* ページの遷移
* モーダル・ダイアログの表示
* 表示内容の大幅な変更、など
-プロダクト（:ref:`check-0171`）
+プロダクト（ :ref:`check-0171` ）
* Tab/Shift+Tabキーによるフォーカス移動時の挙動は以下のすべてを満たしている：
* フォーカス・インジケーターまたはそれを代替する表示がある
diff --git a/source/checks/inc/gl-form-errors-cancel.rst b/source/checks/inc/gl-form-errors-cancel.rst
index c268f888..00499b35 100644
--- a/source/checks/inc/gl-form-errors-cancel.rst
+++ b/source/checks/inc/gl-form-errors-cancel.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1141`）
+デザイン（ :ref:`check-1141` ）
* 法的行為、経済的取引、データの変更や削除を生じる機能については、取り消し、送信前の確認・修正、または送信時のエラー・チェックと修正が可能になっている。
diff --git a/source/checks/inc/gl-form-errors-correction.rst b/source/checks/inc/gl-form-errors-correction.rst
index 3fdb3f40..7a067c28 100644
--- a/source/checks/inc/gl-form-errors-correction.rst
+++ b/source/checks/inc/gl-form-errors-correction.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1111`）、プロダクト（:ref:`check-1131`）
+デザイン（ :ref:`check-1111` ）、プロダクト（ :ref:`check-1131` ）
* フォーム入力に関するエラー・メッセージには、エラーの修正方法が示されている。
diff --git a/source/checks/inc/gl-form-errors-identify.rst b/source/checks/inc/gl-form-errors-identify.rst
index 292d9738..35bbda00 100644
--- a/source/checks/inc/gl-form-errors-identify.rst
+++ b/source/checks/inc/gl-form-errors-identify.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-1081`）
+デザイン（ :ref:`check-1081` ）
* フォーム入力でエラーが発生したとき、エラー内容が分かる具体的な表示文言が設計資料で定義されている
-プロダクト（:ref:`check-1101`）
+プロダクト（ :ref:`check-1101` ）
* フォーム入力に関するエラー発生時には、エラーの内容が具体的に分かるテキスト情報が表示される。
diff --git a/source/checks/inc/gl-form-hidden-label.rst b/source/checks/inc/gl-form-hidden-label.rst
index 1c12d2a4..c9988ffe 100644
--- a/source/checks/inc/gl-form-hidden-label.rst
+++ b/source/checks/inc/gl-form-hidden-label.rst
@@ -1,10 +1,10 @@
-デザイン（:ref:`check-0931`）
+デザイン（ :ref:`check-0931` ）
* フォーム・コントロールについて、役割が分かり、画面上に表示されているテキストまたは代替テキストが付加された画像を、ラベルとして設計資料に定義している。または
* ``aria-label`` 属性値として指定すべき、フォーム・コントロールの役割を示すテキストを設計資料に定義している。
-コード（:ref:`check-0941`）
+コード（ :ref:`check-0941` ）
* フォーム・コントロールは、ラベルとなるテキストまたは画像と ``label`` 要素または ``aria-labelledby`` 属性で関連付けられている。または
* ``aria-label`` 属性で適切なラベルが付けられている。
* 開発者ツールで確認するとフォーム・コントロールのaccessible nameに役割が分かるテキストが指定されている状態になっている。
-プロダクト（:ref:`check-0951`）
+プロダクト（ :ref:`check-0951` 、 :ref:`axeによるチェック実施方法の例 ` ）
* フォーム・コントロールの役割が分かるテキストまたは代替テキストが付加された画像がラベルとして表示されていて、このテキストをクリックすると当該のフォーム・コントロールにフォーカスが移動する。または
* スクリーン・リーダーでフォーム・コントロールとラベルの関連付けが分かるような読み上げがされる。
diff --git a/source/checks/inc/gl-form-label.rst b/source/checks/inc/gl-form-label.rst
index 1c12d2a4..c9988ffe 100644
--- a/source/checks/inc/gl-form-label.rst
+++ b/source/checks/inc/gl-form-label.rst
@@ -1,10 +1,10 @@
-デザイン（:ref:`check-0931`）
+デザイン（ :ref:`check-0931` ）
* フォーム・コントロールについて、役割が分かり、画面上に表示されているテキストまたは代替テキストが付加された画像を、ラベルとして設計資料に定義している。または
* ``aria-label`` 属性値として指定すべき、フォーム・コントロールの役割を示すテキストを設計資料に定義している。
-コード（:ref:`check-0941`）
+コード（ :ref:`check-0941` ）
* フォーム・コントロールは、ラベルとなるテキストまたは画像と ``label`` 要素または ``aria-labelledby`` 属性で関連付けられている。または
* ``aria-label`` 属性で適切なラベルが付けられている。
* 開発者ツールで確認するとフォーム・コントロールのaccessible nameに役割が分かるテキストが指定されている状態になっている。
-プロダクト（:ref:`check-0951`）
+プロダクト（ :ref:`check-0951` 、 :ref:`axeによるチェック実施方法の例 ` ）
* フォーム・コントロールの役割が分かるテキストまたは代替テキストが付加された画像がラベルとして表示されていて、このテキストをクリックすると当該のフォーム・コントロールにフォーカスが移動する。または
* スクリーン・リーダーでフォーム・コントロールとラベルの関連付けが分かるような読み上げがされる。
diff --git a/source/checks/inc/gl-form-no-timing.rst b/source/checks/inc/gl-form-no-timing.rst
index ca3ef998..f3cfdd06 100644
--- a/source/checks/inc/gl-form-no-timing.rst
+++ b/source/checks/inc/gl-form-no-timing.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-0991`）
+デザイン（ :ref:`check-0991` ）
* フォーム入力に制限時間が設けられていない。
diff --git a/source/checks/inc/gl-form-tab-order.rst b/source/checks/inc/gl-form-tab-order.rst
index aa79628d..993f7783 100644
--- a/source/checks/inc/gl-form-tab-order.rst
+++ b/source/checks/inc/gl-form-tab-order.rst
@@ -1,4 +1,4 @@
-プロダクト（:ref:`check-0172`）
+プロダクト（ :ref:`check-0172` ）
* Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイアウト、操作手順に即した自然な順序でフォーカスが移動する。
* リンクとボタン
diff --git a/source/checks/inc/gl-form-target-size.rst b/source/checks/inc/gl-form-target-size.rst
index f1e0b3f5..8af49b58 100644
--- a/source/checks/inc/gl-form-target-size.rst
+++ b/source/checks/inc/gl-form-target-size.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0331`）
+デザイン（ :ref:`check-0331` ）
* ボタンなどのサイズが充分に大きいことを確認している。
-プロダクト（:ref:`check-0351`）
+プロダクト（ :ref:`check-0351` ）
* 想定環境におけるクリッカブルなエリアのサイズが充分に大きいことを確認できている。
diff --git a/source/checks/inc/gl-form-timing.rst b/source/checks/inc/gl-form-timing.rst
index 68107ba6..5f08d56e 100644
--- a/source/checks/inc/gl-form-timing.rst
+++ b/source/checks/inc/gl-form-timing.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0961`）
+デザイン（ :ref:`check-0961` ）
* フォームの入力に制限時間を設ける場合：
* 事前にユーザーがその制限時間を解除することができる。又は、
diff --git a/source/checks/inc/gl-icon-color-only.rst b/source/checks/inc/gl-icon-color-only.rst
index 7a62e226..746ed8d6 100644
--- a/source/checks/inc/gl-icon-color-only.rst
+++ b/source/checks/inc/gl-icon-color-only.rst
@@ -1,6 +1,6 @@
-デザイン（:ref:`check-0391`）
+デザイン（ :ref:`check-0391` ）
* アイコンには、その役割や示している状態を表すテキスト・ラベルが併せて表示されている。または
* テキスト・ラベルを表示できない場合、色の違いだけでアイコンの意味の違いを表さず、形状（モチーフ）やサイズでも違いを示している。かつ
* 役割や意味がわかる alt 属性の値を設計資料で明示している。
-プロダクト（:ref:`check-0412`）
+プロダクト（ :ref:`check-0412` ）
* テキストのラベルが併せて表示されていないアイコンで、形状とサイズが同じで色だけが違うものがない。（例：異なる状態を表す複数のアイコンが、色の違いだけで状態の違いを表していない。）
diff --git a/source/checks/inc/gl-icon-consistent.rst b/source/checks/inc/gl-icon-consistent.rst
index e255f911..28ca41a3 100644
--- a/source/checks/inc/gl-icon-consistent.rst
+++ b/source/checks/inc/gl-icon-consistent.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-0242`）、プロダクト（:ref:`check-0262`）
+デザイン（ :ref:`check-0242` ）、プロダクト（ :ref:`check-0262` ）
* 同じ文脈において、遷移先が同じリンク、目的が同じボタンには、一貫したテキストやアイコンが使われている。
diff --git a/source/checks/inc/gl-icon-contrast.rst b/source/checks/inc/gl-icon-contrast.rst
index a6ab53d0..3b334aba 100644
--- a/source/checks/inc/gl-icon-contrast.rst
+++ b/source/checks/inc/gl-icon-contrast.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0001`）、プロダクト（:ref:`check-0021`）
+デザイン（ :ref:`check-0001` ）、プロダクト（ :ref:`check-0021` 、 :ref:`axeによるチェック実施方法の例 ` ）
* 充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
diff --git a/source/checks/inc/gl-icon-target-size.rst b/source/checks/inc/gl-icon-target-size.rst
index f1e0b3f5..8af49b58 100644
--- a/source/checks/inc/gl-icon-target-size.rst
+++ b/source/checks/inc/gl-icon-target-size.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0331`）
+デザイン（ :ref:`check-0331` ）
* ボタンなどのサイズが充分に大きいことを確認している。
-プロダクト（:ref:`check-0351`）
+プロダクト（ :ref:`check-0351` ）
* 想定環境におけるクリッカブルなエリアのサイズが充分に大きいことを確認できている。
diff --git a/source/checks/inc/gl-icon-visible-label.rst b/source/checks/inc/gl-icon-visible-label.rst
index 914797ee..487abf75 100644
--- a/source/checks/inc/gl-icon-visible-label.rst
+++ b/source/checks/inc/gl-icon-visible-label.rst
@@ -1,10 +1,10 @@
-デザイン（:ref:`check-0391`）
+デザイン（ :ref:`check-0391` ）
* アイコンには、その役割や示している状態を表すテキスト・ラベルが併せて表示されている。または
* テキスト・ラベルを表示できない場合、色の違いだけでアイコンの意味の違いを表さず、形状（モチーフ）やサイズでも違いを示している。かつ
* 役割や意味がわかる alt 属性の値を設計資料で明示している。
-コード（:ref:`check-0401`）
+コード（ :ref:`check-0401` ）
* アイコンの役割や示している状態を表すテキストが表示されていて、 ``aria-labelledby`` 属性で関連付けられている。または
* ``alt`` 属性または ``aria-label`` 属性で、そのようなテキストが指定されている。
* 開発者ツールで確認すると、Accessible Nameに適切なテキストが設定されている状態になっている。
-プロダクト（:ref:`check-0411`）
+プロダクト（ :ref:`check-0411` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* アイコンの役割や示している状態が分かるテキストが、スクリーン・リーダーで読み上げられる。
diff --git a/source/checks/inc/gl-image-adjacent-contrast.rst b/source/checks/inc/gl-image-adjacent-contrast.rst
index a6ab53d0..3b334aba 100644
--- a/source/checks/inc/gl-image-adjacent-contrast.rst
+++ b/source/checks/inc/gl-image-adjacent-contrast.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0001`）、プロダクト（:ref:`check-0021`）
+デザイン（ :ref:`check-0001` ）、プロダクト（ :ref:`check-0021` 、 :ref:`axeによるチェック実施方法の例 ` ）
* 充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
diff --git a/source/checks/inc/gl-image-color-only.rst b/source/checks/inc/gl-image-color-only.rst
index 0a3f4acc..346ec441 100644
--- a/source/checks/inc/gl-image-color-only.rst
+++ b/source/checks/inc/gl-image-color-only.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0031`）、プロダクト（:ref:`check-0051`）
+デザイン（ :ref:`check-0031` ）、プロダクト（ :ref:`check-0051` ）
* グレイスケール表示でも利用に支障が出ない:
* リンク箇所を判別できる
diff --git a/source/checks/inc/gl-image-decorative.rst b/source/checks/inc/gl-image-decorative.rst
index a6573c11..8dfc23a7 100644
--- a/source/checks/inc/gl-image-decorative.rst
+++ b/source/checks/inc/gl-image-decorative.rst
@@ -1,6 +1,6 @@
-デザイン（:ref:`check-0451`）
+デザイン（ :ref:`check-0451` ）
* 情報や機能性を一切持たない画像は、説明のテキストを付加してはならないことが設計資料で明示されている。
-コード（:ref:`check-0461`）
+コード（ :ref:`check-0461` ）
* 情報や機能性を一切持たない画像には、空の ``alt`` 属性（ ``alt=""`` ）や ``role="presentation"`` が付与されていて、スクリーン・リーダーで読み上げられない。
-プロダクト（:ref:`check-0471`）
+プロダクト（ :ref:`check-0471` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* 情報や機能性を一切持たない画像は、スクリーン・リーダーで読み上げられない。
diff --git a/source/checks/inc/gl-image-description.rst b/source/checks/inc/gl-image-description.rst
index 1528bd17..9308343a 100644
--- a/source/checks/inc/gl-image-description.rst
+++ b/source/checks/inc/gl-image-description.rst
@@ -1,8 +1,8 @@
-デザイン（:ref:`check-0421`）
+デザイン（ :ref:`check-0421` ）
* 画像に関する簡潔で過不足ない説明（ ``alt`` 属性値）が、設計資料で明示されている。かつ
* 短いテキストでは充分に説明できない場合には、詳細な説明のテキストが設計資料で明示されている。
-コード（:ref:`check-0431`）
+コード（ :ref:`check-0431` ）
* 画像に関する簡潔で過不足ない説明が ``alt`` 属性や ``aria-label`` 属性で付加されている。かつ
* 詳細な説明が必要な場合には、その説明が当該の画像の直前または直後に表示されている、または ``aria-describedby`` 属性で関連付けられている。
-プロダクト（:ref:`check-0441`）
+プロダクト（ :ref:`check-0441` 、 :ref:`NVDAによるチェック実施方法の例 ` 、 :ref:`axeによるチェック実施方法の例 ` ）
* 画像の説明が適切に読み上げられる。
diff --git a/source/checks/inc/gl-image-text-contrast.rst b/source/checks/inc/gl-image-text-contrast.rst
index a6ab53d0..3b334aba 100644
--- a/source/checks/inc/gl-image-text-contrast.rst
+++ b/source/checks/inc/gl-image-text-contrast.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0001`）、プロダクト（:ref:`check-0021`）
+デザイン（ :ref:`check-0001` ）、プロダクト（ :ref:`check-0021` 、 :ref:`axeによるチェック実施方法の例 ` ）
* 充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
diff --git a/source/checks/inc/gl-input-device-focus-indicator.rst b/source/checks/inc/gl-input-device-focus-indicator.rst
index 5adfd580..af71f40d 100644
--- a/source/checks/inc/gl-input-device-focus-indicator.rst
+++ b/source/checks/inc/gl-input-device-focus-indicator.rst
@@ -1,6 +1,6 @@
-デザイン（:ref:`check-0151`）
+デザイン（ :ref:`check-0151` ）
* デフォルトのフォーカス・インジケーターを用いない場合、代替となるフォーカス・インジケーターを明示している。
-プロダクト（:ref:`check-0171`）
+プロダクト（ :ref:`check-0171` ）
* Tab/Shift+Tabキーによるフォーカス移動時の挙動は以下のすべてを満たしている：
* フォーカス・インジケーターまたはそれを代替する表示がある
diff --git a/source/checks/inc/gl-input-device-focus.rst b/source/checks/inc/gl-input-device-focus.rst
index aa79628d..993f7783 100644
--- a/source/checks/inc/gl-input-device-focus.rst
+++ b/source/checks/inc/gl-input-device-focus.rst
@@ -1,4 +1,4 @@
-プロダクト（:ref:`check-0172`）
+プロダクト（ :ref:`check-0172` ）
* Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイアウト、操作手順に即した自然な順序でフォーカスが移動する。
* リンクとボタン
diff --git a/source/checks/inc/gl-input-device-independent.rst b/source/checks/inc/gl-input-device-independent.rst
index bbfa3f53..0411f262 100644
--- a/source/checks/inc/gl-input-device-independent.rst
+++ b/source/checks/inc/gl-input-device-independent.rst
@@ -1,3 +1,3 @@
-デザイン（:ref:`check-0361`）
+デザイン（ :ref:`check-0361` ）
* 特定の入力ディバイスで発生するイベントのみをトリガーにした機能がない。かつ
* 使用できる入力ディバイスを、特定の時点で検出されたものに限定していない。
diff --git a/source/checks/inc/gl-input-device-keyboard-operable.rst b/source/checks/inc/gl-input-device-keyboard-operable.rst
index d4c6d5c4..36b88ae9 100644
--- a/source/checks/inc/gl-input-device-keyboard-operable.rst
+++ b/source/checks/inc/gl-input-device-keyboard-operable.rst
@@ -1,8 +1,8 @@
-プロダクト（:ref:`check-0172`）
+プロダクト（ :ref:`check-0172` ）
* Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイアウト、操作手順に即した自然な順序でフォーカスが移動する。
* リンクとボタン
* フォーム・コントロール
* その他、マウスやキーボードによる操作を受け付けるすべてのもの
-デザイン（:ref:`check-0211`）、プロダクト（:ref:`check-0231`）
+デザイン（ :ref:`check-0211` ）、プロダクト（ :ref:`check-0231` ）
* クリックやホバーなどのマウス操作を受け付けるものは、キーボードのみでも操作できる。
diff --git a/source/checks/inc/gl-input-device-no-trap.rst b/source/checks/inc/gl-input-device-no-trap.rst
index 7920d68d..b38daf38 100644
--- a/source/checks/inc/gl-input-device-no-trap.rst
+++ b/source/checks/inc/gl-input-device-no-trap.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0201`）
+プロダクト（ :ref:`check-0201` ）
* 動画プレイヤーのような、何らかの機能を提供するためにページ中に埋め込まれているプログラムなどにフォーカスがある状態のとき、Tab, Shift+Tab, 矢印キー、ESCキーのいずれかの操作で、埋め込まれているものの外の領域にあるリンクなどにフォーカスを移動することができ、自動的にフォーカスが元の位置に戻されない。
diff --git a/source/checks/inc/gl-input-device-shortcut-keys.rst b/source/checks/inc/gl-input-device-shortcut-keys.rst
index 348c9387..60445a2b 100644
--- a/source/checks/inc/gl-input-device-shortcut-keys.rst
+++ b/source/checks/inc/gl-input-device-shortcut-keys.rst
@@ -1,4 +1,4 @@
-プロダクト（:ref:`check-0141`）
+プロダクト（ :ref:`check-0141` ）
* ショートカットキーを提供していて、それが画面のどこにフォーカスがあっても作動する仕様である場合、以下のいずれかを満たしている：
* ユーザーがショートカットキーを無効にできる
diff --git a/source/checks/inc/gl-input-device-use-up-event.rst b/source/checks/inc/gl-input-device-use-up-event.rst
index 8269dff5..cb115e87 100644
--- a/source/checks/inc/gl-input-device-use-up-event.rst
+++ b/source/checks/inc/gl-input-device-use-up-event.rst
@@ -1,4 +1,4 @@
-コード（:ref:`check-0071`）
+コード（ :ref:`check-0071` ）
* マウス・ボタンのdownイベントをトリガーにしていない。
-プロダクト（:ref:`check-0081`）
+プロダクト（ :ref:`check-0081` ）
* マウス・クリックを受け付けるリンクやボタンなどは、マウス・ボタンを押下した状態でマウス・ポインターを外し、マウス・ボタンを放した場合、その機能が実行されない。（ドラッグ&ドロップは対象外）
diff --git a/source/checks/inc/gl-iot-adjacent-contrast.rst b/source/checks/inc/gl-iot-adjacent-contrast.rst
index a6ab53d0..3b334aba 100644
--- a/source/checks/inc/gl-iot-adjacent-contrast.rst
+++ b/source/checks/inc/gl-iot-adjacent-contrast.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0001`）、プロダクト（:ref:`check-0021`）
+デザイン（ :ref:`check-0001` ）、プロダクト（ :ref:`check-0021` 、 :ref:`axeによるチェック実施方法の例 ` ）
* 充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
diff --git a/source/checks/inc/gl-iot-avoid-usage.rst b/source/checks/inc/gl-iot-avoid-usage.rst
index 0554764a..5e4262e9 100644
--- a/source/checks/inc/gl-iot-avoid-usage.rst
+++ b/source/checks/inc/gl-iot-avoid-usage.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-0481`）、プロダクト（:ref:`check-0501`）
+デザイン（ :ref:`check-0481` ）、プロダクト（ :ref:`check-0501` ）
* 自社および他者のロゴ、バナー、図や写真の中の文字列を除いて、画像化されたテキストがない。
diff --git a/source/checks/inc/gl-iot-provide-text.rst b/source/checks/inc/gl-iot-provide-text.rst
index 3dd53fef..b0b09185 100644
--- a/source/checks/inc/gl-iot-provide-text.rst
+++ b/source/checks/inc/gl-iot-provide-text.rst
@@ -1,4 +1,4 @@
-コード（:ref:`check-0521`）
+コード（ :ref:`check-0521` ）
* 画像化されているテキストと同じ内容が ``alt`` 属性または ``aria-label`` 属性で示されていて、スクリーン・リーダーなとで確認できる。
-プロダクト（:ref:`check-0531`）
+プロダクト（ :ref:`check-0531` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* 画像化されているテキストと同じ内容がスクリーン・リーダーなとで確認できる。
diff --git a/source/checks/inc/gl-iot-text-contrast.rst b/source/checks/inc/gl-iot-text-contrast.rst
index a6ab53d0..3b334aba 100644
--- a/source/checks/inc/gl-iot-text-contrast.rst
+++ b/source/checks/inc/gl-iot-text-contrast.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0001`）、プロダクト（:ref:`check-0021`）
+デザイン（ :ref:`check-0001` ）、プロダクト（ :ref:`check-0021` 、 :ref:`axeによるチェック実施方法の例 ` ）
* 充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
diff --git a/source/checks/inc/gl-link-color-only.rst b/source/checks/inc/gl-link-color-only.rst
index 0a3f4acc..346ec441 100644
--- a/source/checks/inc/gl-link-color-only.rst
+++ b/source/checks/inc/gl-link-color-only.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0031`）、プロダクト（:ref:`check-0051`）
+デザイン（ :ref:`check-0031` ）、プロダクト（ :ref:`check-0051` ）
* グレイスケール表示でも利用に支障が出ない:
* リンク箇所を判別できる
diff --git a/source/checks/inc/gl-link-consistent-text.rst b/source/checks/inc/gl-link-consistent-text.rst
index e255f911..28ca41a3 100644
--- a/source/checks/inc/gl-link-consistent-text.rst
+++ b/source/checks/inc/gl-link-consistent-text.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-0242`）、プロダクト（:ref:`check-0262`）
+デザイン（ :ref:`check-0242` ）、プロダクト（ :ref:`check-0262` ）
* 同じ文脈において、遷移先が同じリンク、目的が同じボタンには、一貫したテキストやアイコンが使われている。
diff --git a/source/checks/inc/gl-link-tab-order.rst b/source/checks/inc/gl-link-tab-order.rst
index aa79628d..993f7783 100644
--- a/source/checks/inc/gl-link-tab-order.rst
+++ b/source/checks/inc/gl-link-tab-order.rst
@@ -1,4 +1,4 @@
-プロダクト（:ref:`check-0172`）
+プロダクト（ :ref:`check-0172` ）
* Tab/Shift+Tabキーを使ったフォーカスの移動時、文脈、レイアウト、操作手順に即した自然な順序でフォーカスが移動する。
* リンクとボタン
diff --git a/source/checks/inc/gl-link-text.rst b/source/checks/inc/gl-link-text.rst
index b27099df..277639f3 100644
--- a/source/checks/inc/gl-link-text.rst
+++ b/source/checks/inc/gl-link-text.rst
@@ -1,5 +1,5 @@
-デザイン（:ref:`check-0241`）
+デザイン（ :ref:`check-0241` ）
* リンク・テキストは「こちら」などになっておらず、リンク・テキストの文言から遷移先をある程度推測できるようになっている。
-プロダクト（:ref:`check-0261`）
+プロダクト（ :ref:`check-0261` ）
* 「○○はこちら」の「こちら」の部分だけがリンクになっていない。（この場合は「○○はこちら」全体をリンクにする。）、または
* リンク・テキストの意図がマークアップで明確になっている。
diff --git a/source/checks/inc/gl-login-session-continue.rst b/source/checks/inc/gl-login-session-continue.rst
index 53db98f3..54ca9eef 100644
--- a/source/checks/inc/gl-login-session-continue.rst
+++ b/source/checks/inc/gl-login-session-continue.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1381`）
+デザイン（ :ref:`check-1381` ）
* ログイン・セッションがタイムアウトした場合、再認証後にデータを失うことなくユーザーが操作を継続できるようになっている。
diff --git a/source/checks/inc/gl-login-session-no-timing.rst b/source/checks/inc/gl-login-session-no-timing.rst
index b94e4b09..6e418b6a 100644
--- a/source/checks/inc/gl-login-session-no-timing.rst
+++ b/source/checks/inc/gl-login-session-no-timing.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1351`）
+デザイン（ :ref:`check-1351` ）
* ログイン・セッションに有効期限が設定されていない。
diff --git a/source/checks/inc/gl-login-session-timing.rst b/source/checks/inc/gl-login-session-timing.rst
index d001edf3..ca9e3e91 100644
--- a/source/checks/inc/gl-login-session-timing.rst
+++ b/source/checks/inc/gl-login-session-timing.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-1321`）
+デザイン（ :ref:`check-1321` ）
* ログイン・セッションにタイムアウトを設ける場合：
* ログイン時などに、ユーザーがセッション・タイムアウトの設定を解除することができる。又は、
diff --git a/source/checks/inc/gl-markup-component.rst b/source/checks/inc/gl-markup-component.rst
index 616417d6..4f33d937 100644
--- a/source/checks/inc/gl-markup-component.rst
+++ b/source/checks/inc/gl-markup-component.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0591`）
+プロダクト（ :ref:`check-0591` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* 静的なテキストではない部分（例：開閉するメニュー、タブ・パネル、日付選択UI）も、スクリーン・リーダーで問題なく操作できる。
diff --git a/source/checks/inc/gl-markup-semantics.rst b/source/checks/inc/gl-markup-semantics.rst
index f7532469..32967b95 100644
--- a/source/checks/inc/gl-markup-semantics.rst
+++ b/source/checks/inc/gl-markup-semantics.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0541`）
+デザイン（ :ref:`check-0541` ）
* 見出し（ ``h1`` ～ ``h6`` ）、箇条書き（ ``ul``, ``ol``, ``dl`` ）、表（ ``table`` ）など、HTMLのセマンティクスで表現できるものがそれらで表現されるよう、設計資料で明示されている。
-コード（:ref:`check-0551`）
+コード（ :ref:`check-0551` ）
* 見出し（ ``h1`` ～ ``h6`` ）、箇条書き（ ``ul``, ``ol``, ``dl`` ）、表（ ``table`` ）などを用いてセマンティクスが適切にマークアップされている。
diff --git a/source/checks/inc/gl-markup-valid.rst b/source/checks/inc/gl-markup-valid.rst
index ef6c2be7..8b9f0769 100644
--- a/source/checks/inc/gl-markup-valid.rst
+++ b/source/checks/inc/gl-markup-valid.rst
@@ -1,2 +1,2 @@
-コード（:ref:`check-0571`）
+コード（ :ref:`check-0571` ）
* validatorやlinterでチェックが通る。
diff --git a/source/checks/inc/gl-multimedia-background-sound.rst b/source/checks/inc/gl-multimedia-background-sound.rst
index 900ec2a6..9c5dcf4d 100644
--- a/source/checks/inc/gl-multimedia-background-sound.rst
+++ b/source/checks/inc/gl-multimedia-background-sound.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-1651`）
+プロダクト（ :ref:`check-1651` ）
* 音声コンテンツについて、充分に聴き取りやすい。
diff --git a/source/checks/inc/gl-multimedia-caption.rst b/source/checks/inc/gl-multimedia-caption.rst
index 30f88771..b063b9fb 100644
--- a/source/checks/inc/gl-multimedia-caption.rst
+++ b/source/checks/inc/gl-multimedia-caption.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-1531`）
+プロダクト（ :ref:`check-1531` ）
* 音声を含むコンテンツには、同期したキャプションが提供されている。
diff --git a/source/checks/inc/gl-multimedia-no-trap.rst b/source/checks/inc/gl-multimedia-no-trap.rst
index 7920d68d..b38daf38 100644
--- a/source/checks/inc/gl-multimedia-no-trap.rst
+++ b/source/checks/inc/gl-multimedia-no-trap.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0201`）
+プロダクト（ :ref:`check-0201` ）
* 動画プレイヤーのような、何らかの機能を提供するためにページ中に埋め込まれているプログラムなどにフォーカスがある状態のとき、Tab, Shift+Tab, 矢印キー、ESCキーのいずれかの操作で、埋め込まれているものの外の領域にあるリンクなどにフォーカスを移動することができ、自動的にフォーカスが元の位置に戻されない。
diff --git a/source/checks/inc/gl-multimedia-operable.rst b/source/checks/inc/gl-multimedia-operable.rst
index 5b7295af..1955c39b 100644
--- a/source/checks/inc/gl-multimedia-operable.rst
+++ b/source/checks/inc/gl-multimedia-operable.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1421`）、プロダクト（:ref:`check-1441`）
+デザイン（ :ref:`check-1421` ）、プロダクト（ :ref:`check-1441` ）
* 3秒以上の長さの自動再生される音声コンテンツがない。
diff --git a/source/checks/inc/gl-multimedia-pause-movement.rst b/source/checks/inc/gl-multimedia-pause-movement.rst
index 46dc9a7a..f188cf93 100644
--- a/source/checks/inc/gl-multimedia-pause-movement.rst
+++ b/source/checks/inc/gl-multimedia-pause-movement.rst
@@ -1,3 +1,3 @@
-デザイン（:ref:`check-1451`）、プロダクト（:ref:`check-1471`）
+デザイン（ :ref:`check-1451` ）、プロダクト（ :ref:`check-1471` ）
* 自動的に開始し5秒以上続く動画、アニメーションがない。または
* 動画やアニメーションを呈し、一時停止、または非表示にすることができる。
diff --git a/source/checks/inc/gl-multimedia-perceivable.rst b/source/checks/inc/gl-multimedia-perceivable.rst
index 4280d248..a1edcdd0 100644
--- a/source/checks/inc/gl-multimedia-perceivable.rst
+++ b/source/checks/inc/gl-multimedia-perceivable.rst
@@ -1,3 +1,3 @@
-プロダクト（:ref:`check-1411`）
+プロダクト（ :ref:`check-1411` ）
* ページ内に埋め込まれる音声/動画プレイヤーについて、適切なラベル付けがされていてそこにプレイヤーがあることが容易に認知できるようになっている。または
* 前後のテキストから、そこにプレイヤーがあることが推測できる。
diff --git a/source/checks/inc/gl-multimedia-sign-language.rst b/source/checks/inc/gl-multimedia-sign-language.rst
index b6f7db2a..19a26cb5 100644
--- a/source/checks/inc/gl-multimedia-sign-language.rst
+++ b/source/checks/inc/gl-multimedia-sign-language.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-1621`）
+プロダクト（ :ref:`check-1621` ）
* 動画の音声情報には同期した手話通訳が提供されている。
diff --git a/source/checks/inc/gl-multimedia-text-alternative.rst b/source/checks/inc/gl-multimedia-text-alternative.rst
index 95a17e4a..0c69308d 100644
--- a/source/checks/inc/gl-multimedia-text-alternative.rst
+++ b/source/checks/inc/gl-multimedia-text-alternative.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-1481`）、プロダクト（:ref:`check-1501`）
+デザイン（ :ref:`check-1481` ）、プロダクト（ :ref:`check-1501` ）
* 音声・映像コンテンツは、そのコンテンツがなくても不足なく情報が伝わるような内容で、そのコンテンツがテキスト情報の代替もしくは補助的な位置づけであることが明示されている。
diff --git a/source/checks/inc/gl-multimedia-transcript.rst b/source/checks/inc/gl-multimedia-transcript.rst
index f774f424..6e0730dd 100644
--- a/source/checks/inc/gl-multimedia-transcript.rst
+++ b/source/checks/inc/gl-multimedia-transcript.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-1591`）
+プロダクト（ :ref:`check-1591` ）
* 映像がない音声のみのコンテンツについて、音声を書き起こしたテキストが提供されている。
diff --git a/source/checks/inc/gl-multimedia-video-description.rst b/source/checks/inc/gl-multimedia-video-description.rst
index 02897a04..86b7b410 100644
--- a/source/checks/inc/gl-multimedia-video-description.rst
+++ b/source/checks/inc/gl-multimedia-video-description.rst
@@ -1,4 +1,4 @@
-プロダクト（:ref:`check-1561`）
+プロダクト（ :ref:`check-1561` ）
* 動画は、元々収録されている音声トラックの内容から容易に映像を推測できる。または
* 動画には音声解説が含まれている。または
* 映像に関するテキストによる説明が提供されている。
diff --git a/source/checks/inc/gl-page-consistent-navigation.rst b/source/checks/inc/gl-page-consistent-navigation.rst
index 9f517e65..7b63f90d 100644
--- a/source/checks/inc/gl-page-consistent-navigation.rst
+++ b/source/checks/inc/gl-page-consistent-navigation.rst
@@ -1,5 +1,5 @@
-デザイン（:ref:`check-0661`）
+デザイン（ :ref:`check-0661` ）
* ページのどの部分がそれぞれ ``header``, ``nav``, ``main``, ``footer`` 要素でマークアップされるべきかが、複数のページで一貫した形で設計資料に明示されている。
-デザイン（:ref:`check-0781`）、プロダクト（:ref:`check-0801`）
+デザイン（ :ref:`check-0781` ）、プロダクト（ :ref:`check-0801` ）
* グローバル・ナビゲーション、ヘッダー、フッター、パンくずリスト、サポートUIなど、複数のページで共通に用いられているページの構成要素は、すべてのページで同じ出現順序になっている。かつ
* これらの構成要素の中でのリンクやボタンの出現順序はすべてのページで同じになっている。
diff --git a/source/checks/inc/gl-page-headings.rst b/source/checks/inc/gl-page-headings.rst
index 5e941903..e2dd2639 100644
--- a/source/checks/inc/gl-page-headings.rst
+++ b/source/checks/inc/gl-page-headings.rst
@@ -1,6 +1,6 @@
-デザイン（:ref:`check-0721`）
+デザイン（ :ref:`check-0721` ）
* ページ内の機能や内容の区切り、本分の先頭部分などに適切に見出しが配置されている。
-コード（:ref:`check-0731`）
+コード（ :ref:`check-0731` ）
* ``h1`` ～ ``h6`` 要素で見出しが適切にマークアップされている。
-プロダクト（:ref:`check-0741`）
+プロダクト（ :ref:`check-0741` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* スクリーン・リーダーが見出しを適切に見出しとして認識している。
diff --git a/source/checks/inc/gl-page-landmark.rst b/source/checks/inc/gl-page-landmark.rst
index 367c01a7..2296119d 100644
--- a/source/checks/inc/gl-page-landmark.rst
+++ b/source/checks/inc/gl-page-landmark.rst
@@ -1,5 +1,5 @@
-デザイン（:ref:`check-0661`）
+デザイン（ :ref:`check-0661` ）
* ページのどの部分がそれぞれ ``header``, ``nav``, ``main``, ``footer`` 要素でマークアップされるべきかが、複数のページで一貫した形で設計資料に明示されている。
-コード（:ref:`check-0671`）
+コード（ :ref:`check-0671` ）
* ``header``, ``main``, ``nav``, ``footer`` の各要素が適切に用いられている。または
* これらが ``role`` 属性で明示されている。
diff --git a/source/checks/inc/gl-page-location.rst b/source/checks/inc/gl-page-location.rst
index ea23a727..6440dc24 100644
--- a/source/checks/inc/gl-page-location.rst
+++ b/source/checks/inc/gl-page-location.rst
@@ -1,8 +1,8 @@
-デザイン（:ref:`check-0841`）
+デザイン（ :ref:`check-0841` ）
* グローバル・ナビゲーション内の表示やいわゆるパンくずリストで、そのページのサイト内での位置が明示されている。
-コード（:ref:`check-0851`）
+コード（ :ref:`check-0851` ）
* ``aria-current`` 属性を用いて、グローバル・ナビゲーションやパンくずリスト内でそのページの位置が明示されている。
-プロダクト（:ref:`check-0861`）
+プロダクト（ :ref:`check-0861` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* スクリーン・リーダーで、グローバル・ナビゲーションやパンくずリスト内でそのページの位置が分かるような読み上げがされる。
-プロダクト（:ref:`check-0862`）
+プロダクト（ :ref:`check-0862` ）
* グローバル・ナビゲーションやパンくずリスト内でそのページの位置が分かるような表示がされている。
diff --git a/source/checks/inc/gl-page-markup-main.rst b/source/checks/inc/gl-page-markup-main.rst
index 4cb058b7..d1d4fb6c 100644
--- a/source/checks/inc/gl-page-markup-main.rst
+++ b/source/checks/inc/gl-page-markup-main.rst
@@ -1,5 +1,5 @@
-コード（:ref:`check-0672`）
+コード（ :ref:`check-0672` ）
* ``main`` 要素が本文の開始位置を反映している。または
* 本文の先頭部分に ``h1`` 要素や ``h2`` 要素でマークアップされた見出しがある。
-プロダクト（:ref:`check-0681`）
+プロダクト（ :ref:`check-0681` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* スクリーン・リーダーの見出しジャンプ機能やリージョン間ジャンプ機能で本文の開始位置を見つけることができる。
diff --git a/source/checks/inc/gl-page-markup-order.rst b/source/checks/inc/gl-page-markup-order.rst
index 64b493cf..aba393ce 100644
--- a/source/checks/inc/gl-page-markup-order.rst
+++ b/source/checks/inc/gl-page-markup-order.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0711`）
+プロダクト（ :ref:`check-0711` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* ページの状態が変化したときも含めて、スクリーン・リーダーで読み上げさせた時、内容的、および視覚的に自然な順序で読み上げられる。
diff --git a/source/checks/inc/gl-page-orientation.rst b/source/checks/inc/gl-page-orientation.rst
index 46d2ad0c..6712c6c4 100644
--- a/source/checks/inc/gl-page-orientation.rst
+++ b/source/checks/inc/gl-page-orientation.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0751`）
+デザイン（ :ref:`check-0751` ）
* 特定の画面方向に固定した使用を前提としたデザインになっていない。
-プロダクト（:ref:`check-0771`）
+プロダクト（ :ref:`check-0771` ）
* 画面方向を検知できる端末において、端末の方向を変えると適切に画面が回転する。
diff --git a/source/checks/inc/gl-page-redundant-navigation.rst b/source/checks/inc/gl-page-redundant-navigation.rst
index 1a0af605..442fa0d1 100644
--- a/source/checks/inc/gl-page-redundant-navigation.rst
+++ b/source/checks/inc/gl-page-redundant-navigation.rst
@@ -1,3 +1,3 @@
-デザイン（:ref:`check-0811`）
+デザイン（ :ref:`check-0811` ）
* そのページへの到達手段が複数ある。
（例示有り）
diff --git a/source/checks/inc/gl-page-title.rst b/source/checks/inc/gl-page-title.rst
index 0d261355..a8e0889c 100644
--- a/source/checks/inc/gl-page-title.rst
+++ b/source/checks/inc/gl-page-title.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0631`）
+デザイン（ :ref:`check-0631` ）
* そのページの目的を示し、かつ他のページとは異なる ページ・タイトル（ ``title`` 要素）が設計資料で定義されている。
-プロダクト（:ref:`check-0651`）
+プロダクト（ :ref:`check-0651` ）
* そのページの目的を示し、かつ他のページとは異なるページ・タイトルが付けられている。（ブラウザーのタイトルバー/タブバーに表示されている。）
diff --git a/source/checks/inc/gl-text-color-only.rst b/source/checks/inc/gl-text-color-only.rst
index 0a3f4acc..346ec441 100644
--- a/source/checks/inc/gl-text-color-only.rst
+++ b/source/checks/inc/gl-text-color-only.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0031`）、プロダクト（:ref:`check-0051`）
+デザイン（ :ref:`check-0031` ）、プロダクト（ :ref:`check-0051` ）
* グレイスケール表示でも利用に支障が出ない:
* リンク箇所を判別できる
diff --git a/source/checks/inc/gl-text-contrast.rst b/source/checks/inc/gl-text-contrast.rst
index a6ab53d0..3b334aba 100644
--- a/source/checks/inc/gl-text-contrast.rst
+++ b/source/checks/inc/gl-text-contrast.rst
@@ -1,4 +1,4 @@
-デザイン（:ref:`check-0001`）、プロダクト（:ref:`check-0021`）
+デザイン（ :ref:`check-0001` ）、プロダクト（ :ref:`check-0021` 、 :ref:`axeによるチェック実施方法の例 ` ）
* 充分なコントラスト比 ([MUST]3:1以上、[SHOULD]4.5:1以上) が確保されている。
* アイコンと背景色
diff --git a/source/checks/inc/gl-text-customize.rst b/source/checks/inc/gl-text-customize.rst
index 7c418938..040cd8d2 100644
--- a/source/checks/inc/gl-text-customize.rst
+++ b/source/checks/inc/gl-text-customize.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0891`）
+プロダクト（ :ref:`check-0891` ）
* line-heightを1.5em以上、段落感の空白を2em以上、letter-spacingを0.12em以上に変更するユーザーCSSを適用しても、表示順序が変わる、文章を途中で読めなくなるなど、コンテンツおよび機能に損失が生じない。
diff --git a/source/checks/inc/gl-text-enable-enlarge.rst b/source/checks/inc/gl-text-enable-enlarge.rst
index 65604473..7b974dd1 100644
--- a/source/checks/inc/gl-text-enable-enlarge.rst
+++ b/source/checks/inc/gl-text-enable-enlarge.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0324`）
+プロダクト（ :ref:`check-0324` ）
* ブラウザーの文字サイズ変更機能で200パーセントまで拡大することができ、その際テキストの理解を妨げるようなレイアウト崩れが起こらない。
diff --git a/source/checks/inc/gl-text-enlarge-settings.rst b/source/checks/inc/gl-text-enlarge-settings.rst
index 676b2743..80cf094e 100644
--- a/source/checks/inc/gl-text-enlarge-settings.rst
+++ b/source/checks/inc/gl-text-enlarge-settings.rst
@@ -1,4 +1,4 @@
-コード（:ref:`check-0311`）
+コード（ :ref:`check-0311` ）
* 文字サイズの指定において、絶対値指定（例：px）と相対値指定（例：rem）が混在していない。
-プロダクト（:ref:`check-0323`）
+プロダクト（ :ref:`check-0323` ）
* ブラウザーの文字サイズ変更機能で200パーセントの拡大表示をする設定をしても、テキストの理解を妨げるようなレイアウト崩れが起こらない。
diff --git a/source/checks/inc/gl-text-heading-label.rst b/source/checks/inc/gl-text-heading-label.rst
index 10d62fa1..d05d0323 100644
--- a/source/checks/inc/gl-text-heading-label.rst
+++ b/source/checks/inc/gl-text-heading-label.rst
@@ -1,2 +1,2 @@
-デザイン（:ref:`check-0271`）
+デザイン（ :ref:`check-0271` ）
* 見出しのテキストは、内容を適切に示す文言になっている。
diff --git a/source/checks/inc/gl-text-multiple-modality.rst b/source/checks/inc/gl-text-multiple-modality.rst
index 06a9cdee..a2128132 100644
--- a/source/checks/inc/gl-text-multiple-modality.rst
+++ b/source/checks/inc/gl-text-multiple-modality.rst
@@ -1,3 +1,3 @@
-デザイン（:ref:`check-0032`）
+デザイン（ :ref:`check-0032` ）
* 形状、色、大きさ、視覚的な位置、方向、音などが分からないと理解できないような説明をしていない。
（例示有り）
diff --git a/source/checks/inc/gl-text-page-lang.rst b/source/checks/inc/gl-text-page-lang.rst
index 142fb446..259150f2 100644
--- a/source/checks/inc/gl-text-page-lang.rst
+++ b/source/checks/inc/gl-text-page-lang.rst
@@ -1,2 +1,4 @@
-コード（:ref:`check-0611`）
+コード（ :ref:`check-0611` ）
* 日本語のページには、 ```` の記述がある。
+プロダクト（ :ref:`check-0621` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
+ * 多言語対応している読み上げ環境を用いて読み上げさせたとき、適切な言語の音声エンジンで読み上げられる。
diff --git a/source/checks/inc/gl-text-phrase-lang.rst b/source/checks/inc/gl-text-phrase-lang.rst
index 66411ff5..4e9c22a3 100644
--- a/source/checks/inc/gl-text-phrase-lang.rst
+++ b/source/checks/inc/gl-text-phrase-lang.rst
@@ -1,4 +1,4 @@
-コード（:ref:`check-0911`）
+コード（ :ref:`check-0911` ）
* 複数の言語が含まれているテキストについて、適切に ``lang`` 属性が指定されている。
-プロダクト（:ref:`check-0921`）
+プロダクト（ :ref:`check-0921` 、 :ref:`NVDAによるチェック実施方法の例 ` ）
* 複数の言語が含まれているテキストについて、iOS VoiceOverのように多言語対応している読み上げ環境を用いて読み上げさせたとき、適切な言語の音声エンジンで読み上げられる。
diff --git a/source/checks/inc/gl-text-zoom-reflow.rst b/source/checks/inc/gl-text-zoom-reflow.rst
index ca8149d2..2d065ea0 100644
--- a/source/checks/inc/gl-text-zoom-reflow.rst
+++ b/source/checks/inc/gl-text-zoom-reflow.rst
@@ -1,4 +1,4 @@
-プロダクト（:ref:`check-0322`）
+プロダクト（ :ref:`check-0322` ）
* 1280x1024のサイズのウィンドウにおいて400パーセントの拡大表示をしたときに適切にリフローされ
* 縦書きのコンテンツでは縦スクロールが、横書きのコンテンツでは横スクロールが発声しない、かつ
diff --git a/source/checks/inc/gl-text-zoom.rst b/source/checks/inc/gl-text-zoom.rst
index 86c0e8a4..1f277358 100644
--- a/source/checks/inc/gl-text-zoom.rst
+++ b/source/checks/inc/gl-text-zoom.rst
@@ -1,2 +1,2 @@
-プロダクト（:ref:`check-0321`）
+プロダクト（ :ref:`check-0321` ）
* ブラウザーのズーム機能で200パーセントまで拡大しても、テキストの理解を妨げるようなレイアウト崩れが起こらない。
diff --git a/source/checks/index.rst b/source/checks/index.rst
index 1fa6e2c0..b16d7a35 100644
--- a/source/checks/index.rst
+++ b/source/checks/index.rst
@@ -1,17 +1,9 @@
-.. _check-index:
-
アクセシビリティー・チェック・リスト
--------------------------------------
-書くガイドラインの「チェック内容」に示したものを、チェックID順に掲載しています。
-
-それぞれ、以下の項目を記しています。
-
-* チェックID
-* チェック内容
-* 対象：デザイン、コード、またはプロダクト
-* 関連ガイドライン：そのチェックによって対応状況を確認することができるガイドライン
-* 参考情報：そのチェックの意図や実施方法に関する情報（各関連ガイドラインで掲載しているものと同じです。）
-
+.. toctree::
+ :maxdepth: 1
+ :titlesonly:
-.. include:: inc/allchecks.rst
+ checklist
+ examples/index
diff --git a/source/conf.py b/source/conf.py
index a7b82d0e..0000d30c 100644
--- a/source/conf.py
+++ b/source/conf.py
@@ -20,9 +20,9 @@
project = 'freeeアクセシビリティー・ガイドライン'
copyright = '2020, freee株式会社'
author = 'freee株式会社'
-version = 'Ver. 202009.0'
+version = 'Ver. 202010.0'
release = version
-publishedDate = u'2020年9月29日'
+publishedDate = u'2020年10月27日'
if 'internal' in tags:
publishedDate = datetime.datetime.now().strftime("%Y-%m-%d")
diff --git a/source/explanations/axe.rst b/source/explanations/axe.rst
new file mode 100644
index 00000000..1f4516d3
--- /dev/null
+++ b/source/explanations/axe.rst
@@ -0,0 +1,75 @@
+.. _exp-axe:
+
+axeを使用したアクセシビリティー・チェック
+------------------------------------------
+
+axeは非常によく使われているアクセシビリティー・チェック・ツールです。
+基本機能が `axe-core `_ として実装されているため様々な方法で使用することができますが、ここではブラウザー拡張機能として利用して、出来上がっているWebページのアクセシビリティーの対応状況をチェックする方法を紹介します。
+
+なお、axeを用いた具体的なチェックの実施方法については、 :ref:`check-example-axe` を参照してください。
+
+axeのインストールと起動の仕方
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+ChromeウェブストアからChrome拡張をインストールできます。
+
+https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd
+
+axe拡張機能はデベロッパーツール内で使用します。
+
+分析対象のページを開いた状態で、ツールバー右端のボタンから :menuselection:`その他のツール --> デベロッパーツール` を選択するか、ショートカットキー（Windowsでは :kbd:`Ctrl+Shift+I` 、macOSでは :kbd:`Command+Option+I` ）を使用してください。
+
+.. image:: /img/axe-1.png
+ :alt: メニューからデベロッパーツールを開こうとしているスクリーンショット
+
+デベロッパーツールのタブから「axe」を選択します。
+
+.. image:: /img/axe-6.png
+ :alt: デベロッパーツールのタブバーのスクリーンショット。右端に「axe」がある
+
+デベロッパーツールの表示領域が狭い場合は 「>>」アイコンに隠されていることがあります。
+
+.. image:: /img/axe-2.png
+ :alt: axeが「>>」アイコンに隠されているときのスクリーンショット。アイコンをクリックしたメニュー内に「axe」がある
+
+axeで今見ているページを分析する
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+分析対象のページを開いた状態でデベロッパーツール内のaxeのタブを開き、「分析する」ボタンをクリックします。
+
+.. image:: /img/axe-8.png
+ :alt: axeタブのスクリーンショット
+
+今見ているページの問題を瞬時に発見することができます。
+
+.. image:: /img/axe-9.png
+ :alt: 表示されているページの問題をaxeで表示しているスクリーンショット
+
+レポートの見方
+~~~~~~~~~~~~~~
+
+axeの画面には発見された問題のリストと、その詳細を表示するビューがあります。
+
+リストには「すべての問題」「レビューが必要」などのフィルターが用意されています。
+
+.. image:: /img/axe-3.png
+ :alt: 発見された問題のリスト部分のスクリーンショット
+
+詳細ビューにはその問題が起きているHTML上の場所や、修正するための情報が表示されています。
+
+.. image:: /img/axe-4.png
+ :alt: 問題の詳細部分のスクリーンショット
+
+同じ問題が複数箇所で見つかっている場合は、リスト上にその件数が表示され、詳細ビューのページャーで1つ1つ確認していくことができます。
+
+.. image:: /img/axe-7.png
+ :alt: 問題リストの項目のスクリーンショット。右側に件数が表示されている
+
+.. image:: /img/axe-5.png
+ :alt: 詳細ビューにあるページャーのスクリーンショット。
+
+axeを使用する上での注意点
+~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+* モーダルやアコーディオンが開閉するような場所では、開いた状態や閉じた状態で何度かaxeで分析してみる必要があります
+* axeだけではすべての問題を発見することはできませんが、機械的に発見できる問題を瞬時に発見することができます。また、調査の必要そうな場所を発見するために非常に有用です。
diff --git a/source/explanations/check-tools.rst b/source/explanations/check-tools.rst
index a6996f41..296bd5cb 100644
--- a/source/explanations/check-tools.rst
+++ b/source/explanations/check-tools.rst
@@ -3,79 +3,9 @@
アクセシビリティー・チェックのためのツール
--------------------------------------------
-参考： コントラストのチェックについては、 :ref:`exp-check-contrast` に詳述しています。
+.. toctree::
-.. _exp-v.nu:
-
-The Nu Html Checkerを用いたHTMLのバリデーション
-~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
-
-`The Nu Html Checker `_ は、 `W3C `_ や `WhatWG `_ でも利用されているHTMLのバリデーターです。
-上記W3CまたはWhatWGのページにアクセスして、チェック対象のページのURLを入力して、HTMLの仕様に準拠しているかどうかをチェックするというのが一般的な使い方です。
-
-しかし、この方法には以下の問題があります：
-
-#. 開発中のページのように社外からアクセスできないページや、ログインが必要なページのチェックができない
-#. 公開前のページなど、社外に出せないページのチェックに向いていない
-
-以下の方法で、これらの問題に対応することができます。
-
-ブックマークレットの利用
-^^^^^^^^^^^^^^^^^^^^^^^^^^
-
-以下の手順でブックマークレットを利用することで、ブラウザーに表示中のページのDOMツリーを送信してチェックすることができます。
-
-#. 以下のコードをターゲットとするブックマーク（ブックマークレット）を作成。
-
- .. raw:: html
-
- コードを表示
-
- .. code-block:: javascript
-
- javascript:(function(){function c(a,b){var c=document.createElement("textarea");c.name=a;c.value=b;d.appendChild(c)}var e=function(a){for(var b="",a=a.firstChild;a;){switch(a.nodeType){case Node.ELEMENT_NODE:b+=a.outerHTML;break;case Node.TEXT_NODE:b+=a.nodeValue;break;case Node.CDATA_SECTION_NODE:b+="";break;case Node.COMMENT_NODE:b+="<\!--"+a.nodeValue+"--\>";break;case Node.DOCUMENT_TYPE_NODE:b+="\n"}a=a.nextSibling}return b}(document),d=document.createElement("form");d.method="POST";d.action="https://validator.w3.org/nu/";d.enctype="multipart/form-data";d.target="_blank";d.acceptCharset="utf-8";c("showsource","yes");c("content",e);document.body.appendChild(d);d.submit()})();
-
- .. only:: html
-
- .. raw:: html
-
- コードを表示
+
+.. include:: ../_static/samples/aria-live-basic.html
+ :code: html
+ :number-lines:
+ :literal:
+
+.. raw:: html
+
+ 以下は上記のコードを表示したもので、「ページを更新」を押下するとARIAライブ・リージョンがサポートされている環境では、追加されたメッセージが読み上げられます。
+
+
+注意：ページのロード時時にARIAライブ・リージョンが存在しないと読み上げられない
+^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
+
+基本的に、ARIAライブ・リージョンはページのロード時に存在することが期待されています。
+そのため、メッセージを表示するのと同時に ``aria-live`` 属性が付いた要素を追加しても、適切に読み上げられません。
+一部読み上げられる環境が存在するという情報もありますが、本稿執筆時、NVDA日本語版2020.3とGoogle Chromeの組み合わせでは読み上げられないことを確認しています。
+
+しかし、以下のようにARIAライブ・リージョンの設置とその内容の更新に時間差を与えると、NVDAでも読み上げられることを確認しています。
+
+`aria-live-timer.html <../_static/samples/aria-live-timer.html>`_ ：
+
+.. raw:: html
+
+ コードを表示
+
+.. include:: ../_static/samples/aria-live-timer.html
+ :code: html
+ :number-lines:
+ :literal:
+
+.. raw:: html
+
+ コードを表示
+
+ .. code-block:: javascript
+
+ javascript:(function(){function c(a,b){var c=document.createElement("textarea");c.name=a;c.value=b;d.appendChild(c)}var e=function(a){for(var b="",a=a.firstChild;a;){switch(a.nodeType){case Node.ELEMENT_NODE:b+=a.outerHTML;break;case Node.TEXT_NODE:b+=a.nodeValue;break;case Node.CDATA_SECTION_NODE:b+="";break;case Node.COMMENT_NODE:b+="<\!--"+a.nodeValue+"--\>";break;case Node.DOCUMENT_TYPE_NODE:b+="\n"}a=a.nextSibling}return b}(document),d=document.createElement("form");d.method="POST";d.action="https://validator.w3.org/nu/";d.enctype="multipart/form-data";d.target="_blank";d.acceptCharset="utf-8";c("showsource","yes");c("content",e);document.body.appendChild(d);d.submit()})();
+
+ .. only:: html
+
+ .. raw:: html
+
+ コードを表示
+
+.. include:: ../_static/samples/lang-incorrect.html
+ :code: html
+ :number-lines:
+ :literal:
+
+.. raw:: html
+
+ コードを表示
+
+.. include:: ../_static/samples/lang-partial.html
+ :code: html
+ :number-lines:
+ :literal:
+
+.. raw:: html
+
+