Zenn
⚓️

WCAGについてざっくり理解する

2022/08/03に公開
CSS
HTML
JavaScript
WCAG
idea

記事の目的

WCAG 2.2で追加される達成基準／木達 一仁 — TechFeed Conference 2022

ライトニングトーク「WCAG 2.2で追加される達成基準」のフォローアップ

TechFeedのLTで「WCAG 2.2で追加される達成基準」という内容の発表がありました。
自分なりに内容を要約したり、少し深掘りしたことを記事にまとめました。

以下のことに観点を置いてまとめています

  • WCAGについてざっくり理解する
  • WCAGの必要性について理解する
  • JIS規格化次第ではWCAGが必要になることを理解する

WCAGとは

WCAG(Web Content Accessibility Guidelines)はW3C(World Wide Web Consortium)のサブグループのWAI(Web Accessibility Initiative)が策定したwebアクセシビリティのガイドラインのこと。

※W3Cは日本にも拠点がある

何を目的にしているか

ウェブコンテンツをよりアクセシブルにするための広範囲に及ぶ推奨事項を網羅している。 このガイドラインに従うことで、全盲又はロービジョン、ろう又は難聴、学習障害、認知障害、運動制限、発話困難、光感受性発作及びこれらの組合せ等を含んだ、様々な障害のある人に対して、コンテンツをアクセシブルにすることができる。又、このガイドラインに従うと、多くの場合、ほとんどの利用者にとってウェブコンテンツがより使いやすくなる。

引用元: https://waic.jp/docs/WCAG20/Overview.html

要するに障がいを持つ人でも使いやすいウェブサイトを作成することを目的にしているようです。

WCAGの歴史

WCAGの歴史は古く、1999年まで遡ります。
2022年現在、広く使用されているWCAGは2.0やWCAGは2.1です。

WCAG1.0(1999年5月 勧告) 廃止済み

W3C: https://www.w3.org/TR/1999/WAI-WEBCONTENT-19990505/

  • 14のガイドライン、65項目のチェックポイントによって構成されている
    • ガイドライン1: 聴覚的かつ視覚的コンテンツと同等の代替手段を提供する
    • ガイドライン2: 色だけに頼らない
    • ガイドライン3: マークアップとスタイルシートを使い、かつ適切に使用する
    • ガイドライン4: 明確な自然言語の用法
    • ガイドライン5: 円滑に変換するテーブルを作成する
    • ガイドライン6: 新技術を特徴とするページが円滑に動くようにする
    • ガイドライン7: 時間に敏感なコンテンツ変更のユーザー制御を確保する
    • ガイドライン8: 組み込みユーザーインターフェースの直接的なアクセシビリティを確保する
    • ガイドライン9: 独立したデバイス設計
    • ガイドライン10: ユーザー暫定ソリューション
    • ガイドライン11: W3Cの技術およびガイドラインの使用
    • ガイドライン12: コンテキストとオリエンテーション情報の提供
    • ガイドライン13: 明快なナビゲーション機構の提供
    • ガイドライン14: 文章が明快かつ簡潔であること
  • 各項目にチェックポイントと１～３の優先度が振られている
  • どの優先度に対する項目を満たしているかという観点から、適合レベルをA～AAAと3つのレベルで定義
  • HTMLやCSSによる解決を中心とした内容

引用元: https://ja.wikipedia.org/wiki/Web_Content_Accessibility_Guidelines

参考: ミツエーリンクスの記事(2004年6月15日)：https://www.mitsue.co.jp/release/20040615.html

WCAG2.0(2008年12月 勧告)

W3C: https://www.w3.org/TR/WCAG20/
日本語訳: https://waic.jp/docs/UNDERSTANDING-WCAG20/Overview.html

  • 4つの原則、12のガイドラインで構成されている
    • 知覚可能
      • テキストによる代替
      • 時間依存メディア
      • 適応可能
      • 判別可能
    • 操作可能
      • キーボード操作可能
      • 十分な時間
      • 発作の防止
      • ナビゲーション可能
    • 理解可能
      • 読みやすさ
      • 予測可能
      • 入力支援
    • 堅牢
      • 互換性
  • WCAG1.0と異なり、各ガイドラインに対して達成基準が準備されており、各達成基準に対して適合レベル(A、AA、AAA)が定義されている。AAAが最高基準。
  • WCAG1.0と異なり、HTMLやCSSに限定されずに将来の技術開発にも幅広く適用できるような内容に変更された

WCAG2.1(2018年6月　勧告)

W3C: https://www.w3.org/TR/WCAG21/
日本語訳: https://waic.jp/docs/WCAG21/#background-on-wcag-2

  • WCAG 2.0では不十分だった領域をカバー
    • モバイル / 弱視 / 認知・学習障害の各分野を強化
  • WCAG2.0の内容に、17個の達成基準が追加された（以下追加された達成基準）
    • 1.3.4表示の向き
    • 1.3.5入力目的の特定
    • 1.3.6目的の特定
    • 1.4.10リフロー
    • 1.4.11非テキストのコントラスト
    • 1.4.12テキストの間隔
    • 1.4.13ホバー又はフォーカスで表示されるコンテンツ
    • 2.1.4文字キーのショートカット
    • 2.2.6タイムアウト
    • 2.3.3インタラクションによるアニメーション
    • 2.5.1ポインタのジェスチャ
    • 2.5.2ポインタのキャンセル
    • 2.5.3名前 (name) のラベル
    • 2.5.4動きによる起動
    • 2.5.5ターゲットのサイズ
    • 2.5.6入力メカニズム非依存
    • 4.1.3ステータスメッセージ
  • 基準はWCAG2.0と同様
  • ISOの規格となっている

WCAG2.2(2022年9月 勧告予定←本当に？)

W3C: https://www.w3.org/TR/WCAG22/
日本語訳: 勧告前なので存在していないようです

  • WCAG2.1の内容に、9つの達成基準が追加された（以下追加された達成基準）
    • 2.4.11フォーカスの外観（最低限）
    • 2.4.12フォーカスの外観（高度）
    • 2.4.13改ページのナビゲーション
    • 2.5.7ドラッグ操作
    • 2.5.8ターゲットサイズ
    • 3.2.6一貫したヘルプ
    • 3.2.7可視コントロール
    • 3.3.7アクセシブルな認証
    • 3.3.8冗長な入力
  • 既存の達成基準の1つにつき適合レベルを変更（AA→A）
  • WCAG2.1からWCAG2.2への変更点のみが記載されたページ
  • 2022年9月に勧告予定となっているが、、、

    • 2022年8月3日の時点で、OPENなIssueが26個ある

    • 本当に9月に勧告できるのか、、、

    • W3Cで主導的な立場のWilcoFiersの記事では遅れそうなことが示唆されている。

      W3C は現在、2022 年 9 月に WCAG 2.2 を推奨することを目指しています。今からそれまでに多くの作業が残されています。目標を持つことは良いことですが、この作業はしばしば予測不可能です。個人的には、それがさらに数か月遅れても驚かないでしょうが、現在の段階では、年末までに WCAG 2.2 を完成させる可能性が高いようです。

      引用: https://www.deque.com/blog/why-wcag-2-2-is-still-in-the-oven/

  • WCAG2.0と同じく、ISOの規格になる可能性があることがAGWGの議事録に記載されていた

WCAG3.0(2022年度以降)

W3C: https://www.w3.org/TR/wcag-3.0/
日本語訳: 草案段階なので存在していないようですが、WCAG3.0の概要の日本語記事がありました

本文の中にこのような文章がありました。

This guideline demonstrates how the WCAG3 structure can be used with emerging technologies such as virtual reality, augmented reality and other immersive web technologies (XR). Research in this area is ongoing and we expect to complete more details in future drafts.

どうやらWeb XR（拡張現実、仮想現実、複合現実）についてもガイドラインの詳細を完成させる予定らしいい。。。

達成基準をどうやって実現するか

達成基準やガイドラインが細かく指定されていることはわかりましたが、明確にどのような技術を使ってそれを実現させるかは明記されていません。
その理由として、WCAG2.0の概要に書かれているように、技術に依存しない形で記載されているためです。WCAGはあくまでも"達成基準のガイドライン”であって、"技術やテクニックを記述したもの"ではないようです。

WCAG 2.0 の達成基準は、技術に依存しない検証可能なものとして記述されている。特定の技術において達成基準を満たすためのガイドについては、達成基準を理解するための一般的な情報とあわせて、別の文書群として提供している。

引用: https://waic.jp/docs/WCAG20/Overview.html

余談： 達成基準のコードへの落とし込み方

これは個人的な感想ですが「HTML解体新書 - 仕様から紐解く本格入門」のような書籍を使って逆引きしていくしかない気がします。
webアクセシビリティはWAI-ARIAのようなHTMLの属性で指定することがメインな気がしており、HTMLの使用について理解することが地道ながらも近道かもしれません。
「HTML解体新書」の制作に関わった方の記事が参考になりました。
その記事の最後に以下のような記載がありました。

この本は、ゴールではありません。最終的な答えでもありません。答えはあくまでHTML仕様の中にあります。これが著者のスタンスです。

達成基準をクリアするために、技術に捉われずにHTMLの仕様などを読み解いていくしかないのか。。。

日本でWCAGが重要視されることはあるか

結論

今はなくても、将来的にありそう。JIS規格になるし、デジタル省が取り組んでいきそう。

背景

最近(？)デジタル省ができました。

デジタル省の政策にUI・UX／アクセシビリティの項目があります。

デジタル省のサイトにもウェブアクセシビリティの項目があります。

またその指標として、日本産業規格JIS X 8341-3:2016「高齢者・障害者等配慮設計指針　情報通信における機器、ソフトウェア、及びサービス－第3部：ウェブコンテンツ」を活用してまいります。

JIS X 8341-3:2016 とは

WCAGのISOをJIS規格に落とし込んだものという認識でよさそう
https://waic.jp/docs/jis2016/understanding/201604/

ウェブアクセシビリティ基盤委員会（WAIC）とは

ウェブアクセシビリティ基盤委員会（Web Accessibility Infrastructure Committee）は、日本におけるウェブアクセシビリティの公的規格であるJIS X 8341-3の理解と普及を促進するとともに、JIS X 8341-3を利用してウェブアクセシビリティを高めていくために必要な基盤を構築するために、さまざまな活動を行っています。

引用: https://waic.jp/

ウェブアクセシビリティに詳しい人が組織されている
https://waic.jp/committee/about/

JIS規格になるということは。。。

現在WCAG2.0の内容がISOになり、JISにもなりました。
今回WCAG2.2がISO規格になることが議事録に記載されていたので、そのうちJIS規格にもなります。
JIS規格になると、日本におけるウェブアクセシビリティの基準になるので、数年後に必要になる可能性は全然ある気がします。

おわりに

WCAGは今は必要なくても、いつか必要になるかもしれません。
アクセシビリティに対する関心を持っておいて損はないので、ざっくりと理解しておくことで、

参考

https://www.youtube.com/watch?v=26zQ8sloqlI
https://www.youtube.com/watch?v=6ZGANgMlAsg
https://service.shiftinc.jp/column/4531/

Discussion