見出し画像

【設定】アクセシビリティの基準はこうやって決められる!

すっかり秋ですね。今年も残すところあと2ヶ月、、1年ってあっという間。

Webサイトを作る際、アクセシビリティ対応するぞ!と意気込んでも、はて?何を基準に何をすればいいの?となりますよね。

弊社は、ウェブ制作を専門にしているため、アクセシビリティの基準はクライアントである企業様の方で設定されることが多いのです。

そこで、どのような原則に従って設定しているのか、その背景をまとめてみることにしました。

アクセシビリティの設定は、4つの基準で構成される

アクセシビリティの設定は、いわばゲームの初期設定のようなものです。

  1. 対応範囲:アクセシビリティを対応するページ、(サイト全体、企業ページなどの所定のページ)など。

  2. ガイドライン規格:JIS X 8341-3:1016(WCAG2.0)を基本としつつ、ケースによりWCAG2.1、WCAG2.2を採用。

  3. 適合レベル(3択):A, AA, AAAのうちのどれか。

  4. アクセシビリティ対応度合い(3択):準拠、一部準拠、配慮のうちのどれか。

以上を組み合わせると以下のような文面で、基準を設定することができます。

例)サイト全体に対し、WCAG2.2適合レベルAA準拠
例)サイトの一部に対し、JIS X 8341-3:2016適合レベルAA一部準拠    
  
※この場合、サイトの一部に該当するページのURLを合わせて記載します。

参考:https://waic.jp/docs/jis2016/compliance-guidelines/202104/

ほんとにこれだけです。まとめてみたらめちゃ簡単。
情報量とわけのわからない言葉が並んで圧倒されるんですが、設定自体はいたってシンプルです。

アクセシビリティ基準の例

実際に企業などで設定されているアクセシビリティ基準を見てみましょう。

Smart HRでは、本方針における「準拠、一部準拠、配慮」とはウェブアクセシビリティ基盤委員会による「ウェブコンテンツの JIS X 8341-3:2016 対応度表記ガイドライン」で定められた表記を指します。という記載があります。アクセシビリティの公式に基づいたことがわかって安心感がありますね。

日本の企業は主にJIS X 8341-3:2016の適合レベルAAに準拠し、WCAG 2.1とWCAG 2.2を一部準拠するケースが多いです。

国外の事例も見てみましょう。

海外だと国際規格のWCAGをどこまで準拠するかが記載されているケースが多いです。


WCAG 2.1とWCAG 2.2を一部準拠する

WCAG、JIS、ISOの比較表

各企業のアクセシビリティ規格を見ると、JIS X 8341-3:2016をベースに、WCAG2.2と2.1からも一部準拠していることがわかります。

お分かりの通り、JIS X 8341-3:2016は2016年に発行されたガイドラインなので、、

(8年も、、)古い!!


国際規格のWCAGは、その後もリリースを繰り返し、2023年10月にリリースしたWCAG2.2が最新版のため、WCAG2.2(とWCAG2.1)からも必要な最新アクセシビリティを採用すると良さそうですね。

❓なんで、WCAG2.2からも採用する必要があるの?国内で使用するWebサイトだから、JIS X 8341-3:2016を網羅できてたらそれで良くない?

はい、それでもいいです。WCAG2.2の一部を採用するかは、アクセシビリティ基準を設定する際の判断次第です。
ですが、JIS X 8341-3の情報は、先ほども言った通り古いです。2024年現在でWCAG2.2と8年のギャップがあります。
現在のユーザーを意識して定めたWCAG2.2から必要な項目を準拠することで、よりWebサイトの信頼性が高まるというわけです。

❓なら直接国際規格の最新のWCAG2.2を踏襲すれば良くない?
海外のサイトならそのままWCAG2.2を使用するのでいいと思いますが、英語で表記されているため、メインユーザーが日本人になる国内のサイトでは、日本語で対応されているJIS X 8341-3の最新を使用するのがマストになってきますね。

WCAG 2.1とWCAG 2.2の差分項目はどこで確認するの?

WCAG 2.1、WCAG 2.2の差分は、ウェブアクセシビリティ基盤委員会 (WAIC) の翻訳ワーキンググループから翻訳されている、それぞれのページの「新しい特徴」というセクションで説明されています。

「WCAG 2.1 の新しい特徴」の場合

「WCAG 2.2 の新しい特徴」の場合

WCAG 2.2を一部準拠するときの事例

アクセシビリティの基準の設定は、要件定義の段階で設定することをお勧めします。その際は、クライアント様や制作メンバーと相談しながら進めましょう。以下は、一例です。

例:企業A SaaSサイト

WCAG2.2からターゲットのサイズの項目を採用した理由
幅広い年齢層のユーザーに使用される想定から、44 × 44px以上のクリックしやすいボタンを担保するというターゲットのサイズの項目を追加しました。

例:企業B コーポレートサイト

WCAG2.2からフォーカスに関する項目を採用した理由
身体障害のあるユーザーを含むキーボード操作を好むユーザーへの配慮として、フォーカス機能に関わるアクセシビリティー対策の項目を追加しました。

設定者じゃなくても、理解しておくとが大事

アクセシビリティの項目はいろいろあって複雑ですよね。
感覚的にはAppleの最新iOSの情報を追いかけてるような感じです。
一見ルールがいっぱいで窮屈そうですが、理解することで柔軟に対応でいる範囲もありそうですね。

奥が深い、、、

この記事を書いた人:ITO KANAKO
デザイナー(WEB/UI/UX)

ITO KANAKO

カバー画像:Nishimori

シリーズ記事一覧

【基礎知識】WCAG?JIS??アクセシビリティガイドラインの理解を深めよう
【設定】アクセシビリティの基準はこうやって決められる!
【徹底解剖】アクセシビリティJIS X 8341-3:2016とは
【アクセシビリティの登竜門】アクセシビリティ試験とは?
【実用】アクセシビリティのためのFigmaプラグイン2024