2020年8月20日時点の社内版の内容を反映。

freee · Aug 21, 2020 · 69de81b · 69de81b
1 parent 2eb4bff
commit 69de81b
Show file tree

Hide file tree

Showing 113 changed files with 2,573 additions and 385 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -6,7 +6,7 @@
   "dependencies": {
     "@textlint-ja/textlint-rule-no-synonyms": "^1.1.0",
     "sudachi-synonyms-dictionary": "^4.1.0",
-    "textlint": "^11.6.3",
+    "textlint": "^11.7.6",
     "textlint-filter-rule-whitelist": "^2.0.0",
     "textlint-plugin-rst": "^0.1.1",
     "textlint-rule-ja-hiragana-fukushi": "^1.2.0",

diff --git a/requirements.txt b/requirements.txt
@@ -1,3 +1,4 @@
 sphinx >= 3.0
 sphinx_rtd_theme
 docutils-ast-writer
+sphinxcontrib-trimblank
diff --git a/source/categories/dynamic_content.rst b/source/categories/dynamic_content.rst
@@ -20,7 +20,7 @@
 ガイドライン
    [MUST] ユーザーの操作によってコンテンツが増減するようなページでは、どの状態においても、最初から順に読み進めた場合にコンテンツの意味が正しく伝わるような順序にDOMツリーを維持する。
 チェック内容
-   *  |behavior|： ページがどの状態でも、スクリーン・リーダーで読み上げさせたとき、内容的、および視覚的に自然な順序で読み上げられる。
+   .. include:: ../checks/inc/gl-dynamic-content-maintain-dom-tree.rst
 
 .. raw:: html
 
@@ -65,8 +65,7 @@
    -  モーダル・ダイアログの表示
 
 チェック内容
-   *  |functionality|： このようなコンポーネントを作らない。
-   *  |behavior|： Tab/Shift+Tabキーでフォーカスを移動させたときに、このような挙動が発生するコンポーネントがない。
+   .. include:: ../checks/inc/gl-dynamic-content-focus.rst
 
 .. raw:: html
 
@@ -107,7 +106,7 @@
    -  ホバー状態ではなくなった場合、ユーザーが非表示にする操作を行った場合、内容が無効になった場合にのみ、ホバーで表示されたコンテンツを非表示にする。
 
 チェック内容
-   *  |behavior|： ホバーで表示されるすべてのコンテンツは、このガイドラインに挙げられている項目を満たしている。
+   .. include:: ../checks/inc/gl-dynamic-content-hover.rst
 
 .. raw:: html
 
@@ -121,7 +120,7 @@
 参考
 ````
 
-*  :ref:`exp-hover-content`
+*  :ref:`exp-dynamic-content-hover`
 
 対応するWCAG 2.1の達成基準
 ````````````````````````````
@@ -152,8 +151,7 @@
    -  ステータス・メッセージであることが分かるように適切なマークアップをする。
 
 チェック内容
-   *  |behavior|： 操作の結果などを伝えるステータス・メッセージは、適切にスクリーン・リーダーで自動的に読み上げられる。
-   *  |markup|： 操作の結果などを伝えるステータス・メッセージには、適切にaria-live属性が付与されている。
+   .. include:: ../checks/inc/gl-dynamic-content-status.rst
 
 .. raw:: html
 
@@ -187,7 +185,7 @@
 自動的に変化するコンテンツ
 ~~~~~~~~~~~~~~~~~~~~~~~~~~
 
-参考： :ref:`exp-dynamic-content-auto-update`
+参考： :ref:`exp-dynamic-content-auto-updated`
 
 .. _gl-dynamic-content-pause-movement:
 
@@ -198,7 +196,7 @@
    [MUST] 同じページ上に、自動的に開始し5秒以上継続する、点滅やスクロールを伴うコンテンツと、他のコンテンツを一緒に配置しない。
    そのようなコンテンツを作る場合は、ユーザーが一時停止、停止、または非表示にすることができるようにする。
 チェック内容
-   *  |visual|、|behavior|：点滅、スクロール、動きを伴うコンテンツがない。
+   .. include:: ../checks/inc/gl-dynamic-content-pause-movement.rst
 
 .. raw:: html
 
@@ -230,7 +228,7 @@
    [MUST] 予め設定された間隔で自動的に内容が更新されたり非表示になったりするコンテンツを作らない。
    そのようなコンテンツを作る場合は、ユーザーが一時停止、停止、非表示にすることができるか、更新頻度を調整できるようにする。
 チェック内容
-   *  |visual|、|behavior|：自動更新されるコンテンツがない。
+   .. include:: ../checks/inc/gl-dynamic-content-pause-refresh.rst
 
 .. raw:: html
 
@@ -261,7 +259,7 @@
 ガイドライン
    [MUST] どの1秒間においても3回を超える閃光を放つものがないようにする。
 チェック内容
-   *  |visual|、|behavior|：光り続けているようなコンテンツがない。
+   .. include:: ../checks/inc/gl-dynamic-content-no-flashing.rst
 
 .. raw:: html
 
@@ -297,7 +295,7 @@
 ガイドライン
    [SHOULD] 緊急性が高い情報を提示する場合を除いて、プッシュ通知や自動更新などによる割り込みを発生させない。
 チェック内容
-   *  |visual|、|behavior|：ユーザーが予期しない形で発生する、画面の内容を大きく変更するような通知や自動的に表示されるモーダル・ダイアログがない。
+   .. include:: ../checks/inc/gl-dynamic-content-no-interrupt.rst
 
 .. raw:: html
 

diff --git a/source/categories/form.rst b/source/categories/form.rst
@@ -20,7 +20,7 @@
 ガイドライン
    [MUST] フォーム・コントロールには、表示されているテキストをラベルとして明示的に関連付ける。
 チェック内容
-   *  |visual|、|behavior|、|markup|： フォーム・コントロールの役割が分かるテキストがラベルとして表示されていて、このテキストをクリックすると当該のフォーム・コントロールにフォーカスが移動する。（``label`` 要素と ``for`` 属性で適切なラベル付けがされている。）
+   .. include:: ../checks/inc/gl-form-label.rst
 
 .. raw:: html
 
@@ -71,7 +71,7 @@
 ガイドライン
    [MUST] フォーム・コントロールに対して表示されているテキストを用いたラベル付けができない場合は、非表示のテキストを用いてラベルを付ける。
 チェック内容
-   *  |markup|： フォーム・コントロールに対して ``label`` 要素と ``for`` 属性でのラベル付けができていない場合は、 ``aria-label`` 属性を用いて適切なラベルが指定されている。
+   .. include:: ../checks/inc/gl-form-hidden-label.rst
 
 .. raw:: html
 
@@ -122,7 +122,7 @@
 ガイドライン
    [MUST] 必須項目やエラー表示に際して、色に加えて他の視覚的要素も用いる。
 チェック内容
-   *  |visual|： グレースケール表示にしても、エラーや必須項目を特定できる。
+   .. include:: ../checks/inc/gl-form-color-only.rst
 
 .. raw:: html
 
@@ -161,10 +161,6 @@
 制限時間
 ~~~~~~~~~~~~~~~~~~~~
 
-.. todo:: 制限時間について、現実的なところを検討する。
-
-.. todo:: 制限時間関連のチェック内容を検討する
-
 参考： :ref:`exp-timing`
 
 .. _gl-form-timing:
@@ -183,7 +179,7 @@
    -  20時間の例外： 制限時間が20時間よりも長い。
 
 チェック内容
-   *  |functionality|：
+   .. include:: ../checks/inc/gl-form-timing.rst
 
 .. raw:: html
 
@@ -214,7 +210,7 @@
 ガイドライン
    [SHOULD] 入力や操作に制限時間を設けない。
 チェック内容
-   *  |functionality|：
+   .. include:: ../checks/inc/gl-form-no-timing.rst
 
 .. raw:: html
 
@@ -245,7 +241,7 @@
 ガイドライン
    [SHOULD] 制限時間を超過した場合も、データを失うことなくユーザーが操作を継続できるようにする。
 チェック内容
-   *  |functionality|：
+   .. include:: ../checks/inc/gl-form-continue.rst
 
 .. raw:: html
 
@@ -282,7 +278,7 @@ Tabキーによるフォーカスの移動順序
 ガイドライン
    [MUST] Tab/Shift+Tabキーでフォーカスを移動させたとき、コンテンツの意味に合った適切な順序でフォーカスを移動させる。
 チェック内容
-   *  |behavior|、|markup|： Tab/Shift+Tabキーを使ってフォーム・コントロールの間でフォーカスを移動させたとき、レイアウト的にも想定される入力順序的にも自然な順序でフォーカスが移動する。
+   .. include:: ../checks/inc/gl-form-tab-order.rst
 
 .. raw:: html
 
@@ -326,13 +322,7 @@ Tabキーによるフォーカスの移動順序
 ガイドライン
    [MUST] フォーカスを受け取ったときに、コンテンツの意味を変える、またはページ全体に及ぶような動的な変化を引き起こすフォーム・コントロールやコンポーネントを用いない。
 チェック内容
-   *  |behavior|： フォーカスを受け取ったときに以下のような変化を自動的に引き起こすようなフォーム・コントロールがない:
-
-      -  フォームの送信
-      -  レイアウトの変更
-      -  ページの遷移
-      -  モーダル・ダイアログの表示
-      -  表示内容の大幅な変更など
+   .. include:: ../checks/inc/gl-form-dynamic-content-focus.rst
 
 .. raw:: html
 
@@ -363,7 +353,7 @@ Tabキーによるフォーカスの移動順序
 ガイドライン
    [MUST] 値が変更されたときに、コンテンツの意味の変更、ページ全体に及ぶような変化、他のフォーム・フィールドの値の変更などを引き起こすようなフォーム・フィールドを作らない、またはそのようなフォーム・フィールドの挙動について、事前にユーザーに知らせる。
 チェック内容
-   *  |behavior|： フォーム中のフィールドの値の変更や、値変更後のフォーカス移動がトリガーとなって、ページ全体に及ぶような大幅な表示内容の変更、ページ遷移、別のフィールドの値の変更が起こらない。
+   .. include:: ../checks/inc/gl-form-dynamic-content-change.rst
 
 .. raw:: html
 
@@ -402,7 +392,7 @@ Tabキーによるフォーカスの移動順序
 ガイドライン
    [MUST] 入力エラーがある場合、エラー箇所とエラー内容をテキストで知らせる。
 チェック内容
-   *  |visual|： フォーム入力に関するエラー発生時には、エラーの内容が具体的に分かるテキスト情報が表示される。
+   .. include:: ../checks/inc/gl-form-errors-identify.rst
 
 .. raw:: html
 
@@ -433,7 +423,7 @@ Tabキーによるフォーカスの移動順序
 ガイドライン
    [SHOULD] 入力エラーがある場合に、修正方法を示す。
 チェック内容
-   *  |visual|： フォーム入力に関するエラー・メッセージには、エラーの修正方法が示されている。
+   .. include:: ../checks/inc/gl-form-errors-correction.rst
 
 .. raw:: html
 
@@ -464,8 +454,7 @@ Tabキーによるフォーカスの移動順序
 ガイドライン
    [SHOULD] 法的行為、経済的取引、データの変更や削除を生じる機能については、取り消し、送信前の確認・修正、または送信時のエラー・チェックと修正を可能にする。
 チェック内容
-   *  |functionality|：
-   *  .. todo:: SC 3.3.4のチェック内容を検討する
+   .. include:: ../checks/inc/gl-form-errors-cancel.rst
 
 .. raw:: html
 
@@ -505,7 +494,7 @@ Tabキーによるフォーカスの移動順序
    -  モバイル向けは44 x 44 CSS px以上
 
 チェック内容
-   *  |visual|： 開発者ツールを用いて、想定環境におけるクリッカブルなエリアのサイズが充分に大きいことを確認できている。
+   .. include:: ../checks/inc/gl-form-target-size.rst
 
 .. raw:: html
 

diff --git a/source/categories/icon.rst b/source/categories/icon.rst
@@ -23,8 +23,7 @@
 ガイドライン
    [MUST] アイコンにはテキストのラベルを併せて表示し、それが難しい場合はアイコンの目的（表している状態、操作の結果）が分かるような代替テキストを付与する。
 チェック内容
-   *  |visual|、|markup|： すべてのアイコンにはテキストのラベルが付けられていて表示されている。または
-   *  |visual|、|markup|： アイコンの役割や意味が分かるテキスト情報が付与されている。 (例： ``alt`` 属性の使用)
+   .. include:: ../checks/inc/gl-icon-visible-label.rst
 
 .. raw:: html
 
@@ -55,7 +54,7 @@
 ガイドライン
    [MUST] アイコンに付与されているラベルが非表示のテキストの場合は、形状、サイズが同じで色だけが違う複数のアイコンを用いない。
 チェック内容
-   *  |visual|： テキストのラベルが併せて表示されていないアイコンで、形状とサイズが同じで色だけが違うものがない。
+   .. include:: ../checks/inc/gl-icon-color-only.rst
 
 .. raw:: html
 
@@ -86,7 +85,7 @@
 ガイドライン
    [MUST] 同じ目的で用いられるアイコンには、サイト内で一貫性のある画像とテキストを用いる。
 チェック内容
-   *  |visual|： テキストのラベルが併せて表示されていないアイコンで、形状とサイズが同じで色だけが違うものがない。
+   .. include:: ../checks/inc/gl-icon-consistent.rst
 
 .. raw:: html
 
@@ -117,7 +116,7 @@
 ガイドライン
    [MUST] 背景色とのコントラスト比を3:1以上にする。
 チェック内容
-   *  |visual|： アイコンの背景色とのコントラスト比が3:1以上になっている。
+   .. include:: ../checks/inc/gl-icon-contrast.rst
 
 .. raw:: html
 
@@ -158,7 +157,7 @@
    -  モバイル向けは44 x 44 CSS px以上
 
 チェック内容
-   *  |visual|： 開発者ツールを用いて、想定環境におけるクリッカブルなエリアのサイズが充分に大きいことを確認できている。
+   .. include:: ../checks/inc/gl-icon-target-size.rst
 
 .. raw:: html
 

diff --git a/source/categories/image.rst b/source/categories/image.rst
@@ -21,8 +21,7 @@
 ガイドライン
    [MUST] 画像に関する過不足のない説明をテキストで提供する。
 チェック内容
-   *  |markup|： 画像に関する簡潔で過不足ない説明が ``alt`` 属性や ``aria-label`` 属性で付加されている。かつ
-   *  |markup|： 短いテキストでは充分に説明できない場合には、aria-describedby属性を使うなどして、詳細な説明が提供されている。
+   .. include:: ../checks/inc/gl-image-description.rst
 
 .. raw:: html
 
@@ -53,7 +52,7 @@
 ガイドライン
    [MUST] 純粋な装飾目的の画像は、スクリーン・リーダーなどの支援技術が無視するようにする。
 チェック内容
-   *  |markup|： 情報や機能性を一切持たない画像は、スクリーン・リーダーで読み上げさせたとき、画像の存在が分からないようになっている。（空の ``alt`` 属性、 ``role="img"`` などの使用）
+   .. include:: ../checks/inc/gl-image-decorative.rst
 
 .. raw:: html
 
@@ -91,7 +90,7 @@
 ガイドライン
    [MUST] 特定の色に何らかの意味を持たせている場合、形状、模様など他の視覚的な要素も併せて用い、色が判別できなくてもその意味を理解できるようにする。
 チェック内容
-   *  |visual|： グレースケール表示でも意図が伝わるようになっている。
+   .. include:: ../checks/inc/gl-image-color-only.rst
 
 .. raw:: html
 
@@ -128,7 +127,7 @@
 ガイドライン
    [MUST] 画像の隣接領域の色とのコントラスト比を3:1以上にする。
 チェック内容
-   *  |visual|： 画像の隣接領域の色とのコントラストが3:1以上になっている。
+   .. include:: ../checks/inc/gl-image-adjacent-contrast.rst
 
 .. raw:: html
 
@@ -170,7 +169,7 @@
    -  その他の場合： 4.5:1以上（[SHOULD] 7:1以上）
 
 チェック内容
-   *  |visual|： 画像内のテキストや、重要な情報を伝える視覚的要素の色と背景の色に、十分なコントラストが確保されている。
+   .. include:: ../checks/inc/gl-image-text-contrast.rst
 
 .. raw:: html
 

diff --git a/source/categories/images_of_text.rst b/source/categories/images_of_text.rst
@@ -7,7 +7,7 @@
 
 たとえば写真に写っている人物の名札にある名前、図中のテキスト・ラベルなど、文字情報以外の視覚的情報が、コンテンツのより重要な要素となっているようなものは、このガイドラインの対象外です。
 
-注： WCAG 2.1では ``images of text`` という用語が用いられ、WCAG 2.1日本語訳では「文字画像」という訳語が当てられています。
+注： WCAG 2.1では "images of text" という用語が用いられ、WCAG 2.1日本語訳では「文字画像」という訳語が当てられています。
 
 参考： :ref:`exp-iot-usage`
 
@@ -24,7 +24,7 @@
 ガイドライン
    [MUST] 画像化されたテキストを用いないと実現できない表現が不可欠な場合（例： ロゴ）を除いて、文字情報は画像化せず、テキスト・データで提供する。画像化されたテキストを用いる場合は、以下に示すコントラスト比に関する要件と、代替情報に関する要件を満たす。
 チェック内容
-   *  |visual|、|markup|： 画像化されたテキストは、自社および他社のロゴ、バナー以外には用いられていない。
+   .. include:: ../checks/inc/gl-iot-avoid-usage.rst
 
 .. raw:: html
 
@@ -62,7 +62,7 @@
 ガイドライン
    [MUST] 画像に含まれる文字情報をテキストでも提供する。
 チェック内容
-   *  |markup|： 画像化されているテキストと同じ内容がスクリーン・リーダーなとで確認できる。
+   .. include:: ../checks/inc/gl-iot-provide-text.rst
 
 .. raw:: html
 
@@ -98,7 +98,7 @@
 ガイドライン
    [MUST] 隣接領域の色とのコントラスト比を3:1以上にする。
 チェック内容
-   *  |visual|： 画像化されたテキストの隣接領域の色とのコントラストが3:1以上になっている。
+   .. include:: ../checks/inc/gl-iot-adjacent-contrast.rst
 
 .. raw:: html
 
@@ -140,7 +140,7 @@
    -  その他の場合： 4.5:1以上（[SHOULD] 7:1以上）
 
 チェック内容
-   *  |visual|： 画像化されたテキストにおいて、画像内のテキストの色と背景の色に十分なコントラストが確保されている。
+   .. include:: ../checks/inc/gl-iot-text-contrast.rst
 
 .. raw:: html