WCAG 2.2 Working Draft (2021年5月21日版)
W3C が勧告している WCAG (Web Content Accessibility Guidelines) の次期バージョン、WCAG 2.2 の Working Draft が、2021年5月 (13日、さらに21日) にアップデートされています。
5月13日版と21日版の違いは、後者において、各達成基準に「Understanding WCAG 2.2」および「How To Meet」へのリンクが設けられていることのみで、各達成基準の文面は同一です。今回の Working Draft は、前回 (2020年8月11日版) と同じく、現行の WCAG 2.1 からの差分としては、9つの新しい達成基準が追加されています。ただし、2020年8月11日版と比べると、一部で達成基準名称が変わっていたり、また多くの達成基準で文面が変わっています。(参考 : 2021年5月13日付の W3C WAI の記事「What's New in WCAG 2.2 Working Draft 」の「Changes to 2.2 Working Draft」セクション)
この記事では、今回の Working Draft のうち、現行の WCAG 2.1 から追加されている達成基準を改めて私訳しなおす形で、ご紹介します。
ガイドライン 2.4 Navigable / ナビゲーション可能
2.4.11 Focus Appearance (Minimum) / フォーカスの外観 (最低限)
[レベル AA]
When user interface components receive keyboard focus, all of the following are true:
ユーザーインターフェースコンポーネントがキーボードフォーカスを受け取る場合、以下のすべてが真となる。
- Contrasting area : There is an area of the focus indicator that has a contrast ratio of at least 3:1 between the colors in the focused and unfocused states.
コントラストが生じる領域 : フォーカス状態と未フォーカス状態の色のコントラスト比が少なくとも 3:1 ある、フォーカスインジケーターの領域がある。 - Minimum area : The contrasting area is at least as large as:
最小の領域 : コントラストが生じる領域は、少なくとも以下と同じ大きさがある。- Outline : the area of a 1 CSS pixel thick perimeter of the unfocused component, or
アウトライン型 : 未フォーカス状態のコンポーネントの外周を 1 CSS ピクセルの太さで囲んだのと同じ面積、または - Shape : the area of a 4 CSS pixel thick line along the shortest side of a minimum bounding box of the unfocused component, and no thinner than 2 CSS pixels.
形状型 : 未フォーカス状態のコンポーネントの最小境界ボックスの最短辺に沿った 4 CSS ピクセルの太さの線と同じ面積で、かつ 2 CSS ピクセルより薄くないもの。
- Outline : the area of a 1 CSS pixel thick perimeter of the unfocused component, or
- Adjacent contrast : The contrasting area also has a contrast ratio of least 3:1 against adjacent colors in the focused component, or the contrasting area has a thickness of at least 2 CSS pixels.
隣接部分のコントラスト : コントラストが生じる領域はまた、フォーカス状態のコンポーネントにおいて、隣接する色に対してコントラスト比が 3:1 以上ある、あるいは、コントラストが生じる領域は少なくとも 2 CSS ピクセルの太さがある。 - Not fully obscured : The item with focus is not entirely hidden by author-created content.
完全には隠されていない : フォーカスのある項目が、コンテンツ制作者が作ったコンテンツによって完全には隠されていない。
2.4.12 Focus Appearance (Enhanced) / フォーカスの外観 (高度)
[レベル AAA]
When user interface components have keyboard focus, all of the following are true:
ユーザーインターフェースコンポーネントにキーボードフォーカスがある場合、以下のすべてが真となる。
- Contrasting area : There is an area of the focus indicator that has a contrast ratio of at least 4.5:1 between the colors in the focused and unfocused states.
コントラストが生じる領域 : フォーカス状態と未フォーカス状態の色のコントラスト比が少なくとも 4.5:1 ある、フォーカスインジケーターの領域がある。 - Minimum area : The contrasting area is at least double the area of a 1 CSS pixel perimeter of the unfocused component;
最小の領域 : コントラストが生じる領域は、未フォーカス状態のコンポーネントの外周を 1 CSS ピクセルの太さで囲んだのと同じ面積の、少なくとも2倍の大きさがある。 - Not obscured : No part of the focus indicator is hidden by author-created content.
隠されていない : フォーカスインジケーターの一部たりとも、コンテンツ制作者が作ったコンテンツによって隠されていない。
2.4.13 Page Break Navigation / 改ページのナビゲーション
[レベル A]
(旧達成基準名称 : Fixed Reference Points / 固定された参照点)
For web content with page break locators, a mechanism is available to navigate to each locator.
改ページのロケーターを持つウェブコンテンツにおいては、各ロケーターにナビゲートするためのメカニズムが利用可能である。
ガイドライン 2.5 Input Modalities / 入力モダリティ
2.5.7 Dragging Movements / ドラッグ動作
[レベル AA]
(旧達成基準名称 : Dragging / ドラッグ操作)
All functionality that uses a dragging movement for operation can be achieved by a single pointer without dragging, unless dragging is essential.
ドラッグ動作を用いて操作する機能はすべて、ドラッグなしのシングルポインタで完遂することができる。ただしドラッグが必要不可欠である場合は例外とする。
2.5.8 Target Size (Minimum) / ターゲットのサイズ (最小限)
[レベル AA]
(旧達成基準名称 : Pointer Target Spacing / ポインタのターゲットの間隔)
Targets have an area of at least 24 by 24 CSS pixels, except where:
ターゲットは、少なくとも 24 × 24 CSS ピクセル以上の大きさを持つ。ただし、以下の場合は例外とする。
- Spacing : The target offset is at least 24 CSS pixels to every adjacent target;
間隔がある : そのターゲットのオフセットが、隣接するすべてのターゲットまで 24 CSS ピクセル以上ある。 - Inline : The target is in a sentence or block of text;
インラインである : そのターゲットが文中、又はテキストブロック内に存在する。 - Essential : A particular presentation of the target is essential to the information being conveyed.
必要不可欠 : そのターゲットを特定の方法で提示することが、情報伝達にとって必要不可欠である。
ガイドライン 3.2 Predictable / 予測可能
3.2.6 Consistent Help / 一貫したヘルプ
[レベル A]
(旧達成基準名称 : Findable Help / 発見可能なヘルプ)
For each web page within a set of web pages that provides one or more of the following ways of finding help, access to at least one form of help is included in the same relative order on each page:
ウェブページ一式の中にある個々のウェブページにおいて、以下のヘルプ発見手段のうち1つ以上が提供される場合、少なくとも1つのヘルプ形式へのアクセスは、各ページにおいて相対的に同じ順序で含まれる。
- Human contact details;
人間がコンタクトする詳細情報 (例 : 電話番号、メールアドレス、営業時間) - Human contact mechanism;
人間がコンタクトするメカニズム (例 : メッセンジャー、チャット、問い合わせフォーム、SNS チャンネル) - Self-help option;
セルフヘルプのオプション (例 : FAQ、利用説明ページ) - A fully automated contact mechanism.
完全に自動化されたコンタクトのメカニズム (例 : チャットボット)
3.2.7 Visible Controls / 可視コントロール
[レベル A]
(旧達成基準名称 : Hidden Controls / 隠されたコントロール)
Where receiving pointer hover or keyboard focus triggers user interface components to be visible, information needed to identify that user interface components are available is visible, except when:
ポインタホバーまたはキーボードフォーカスを受けることでユーザーインターフェースコンポーネントが可視化される場合、そのユーザーインターフェースコンポーネントが利用可能であることを識別するために必要な情報が視覚的に表示される。ただし、以下の場合は例外とする。
- The information needed to identify the user interface components is available through an equivalent component that is visible on the same page or on a different step in a multi-step process without requiring pointer hover or keyboard focus;
ユーザーインターフェイスコンポーネントを識別するために必要な情報が、ポインターホバーやキーボードフォーカスを必要とせずに、同じページまたはマルチステッププロセスの別のステップに可視表示される同等のコンポーネントを通じて利用可能である。 - The component is provided specifically to enhance the experience for keyboard navigation;
そのコンポーネントが、キーボードによるナビゲーションのエクスペリエンスを向上させるために特別に提供されている。 - A mechanism is available to make the information persistently visible;
その情報を永続的に可視表示するメカニズムが利用可能である。 - Hiding the information needed to identify the component is essential.
そのコンポーネントを識別するために必要な情報を非表示にすることが必要不可欠である。
ガイドライン 3.3 Input Assistance / 入力支援
3.3.7 Accessible Authentication / アクセシブルな認証
[レベル A]
For each step in an authentication process that relies on a cognitive function test, at least one other authentication method is available that does not rely on a cognitive function test, or a mechanism is available to assist the user in completing the cognitive function test.
認知機能テスト (†) に依存する認証プロセスの各ステップにおいて、認知機能テストに依存しない少なくとも1つの他の認証方法が利用可能である、または、利用者が認知機能テストを完遂することを支援するメカニズムが利用可能である。
3.3.8 Redundant Entry / 冗長な入力
[レベル A]
Information previously entered by or provided to the user that is required to be entered again in the same process and in the same user-session is either:
同一のプロセスかつ同一のユーザーセッションで再入力する必要がある、利用者によって以前に入力または提供された情報は、以下のいずれかである。
- auto-populated, or
自動入力される。または、 - available for the user to select.
利用者が選択可能である。
Except when:
ただし、以下の場合は例外とする。
- re-entering the information is essential,
その情報の再入力が必要不可欠である場合。 - the information is required to ensure the security of the content, or
コンテンツのセキュリティを確保するためにその情報が必要である場合。あるいは - previously entered information is no longer valid.
以前に入力された情報が無効になっている場合。
なお、前回 (2020年8月11日版) の Working Draft と同様、今回も、既存の達成基準 2.4.7「Focus Visible / フォーカスの可視化」が、文面変更なしで、レベル AA から A に変更されています。これは、上述の達成基準 2.4.11 および 2.4.12「Focus Appearance / フォーカスの外観」(レベル AA および AAA) の新設に伴っての措置です。
また今回の Working Draft では、上述の達成基準 2.5.8 の名称が「Pointer Target Spacing / ポインタのターゲットの間隔」から「Target Size (Minimum) / ターゲットのサイズ (最小限)」に変更されたことを受けて、既存の達成基準 2.5.5 の名称が「Target Size / ターゲットのサイズ」から「Target Size (Enhanced) / ターゲットのサイズ (高度)」になっています。
私の個人的な感覚では、この新達成基準2.5.8「ターゲットのサイズ (最小限)」について、「24 × 24 CSS ピクセル」という規定の妥当性に若干の違和感を覚えたので、W3C AGWG (Accessibility Guidelines Working Group) にコメントを出してみました (SC 2.5.8 Target Size (Minimum) - Is "24 by 24 CSS pixels” reasonable? · Issue #1831 · w3c/wcag)。AGWG の見解としては、ここで言う「ターゲットサイズ」は、タッチインターフェースにおける指に限らずポインタ全般 (マウスを含む) で操作されるオブジェクトの大きさであって、ミニマムなサイズを (Apple Human Interface Guidelines に倣って) 「44 × 44」とするのは現実的ではなく、 「24 × 24」という基準を設けた、とのことです。