2024年6月義務化されるWebアクセシビリティとは？具体例とSEOとの関係も解説

ウェブアクセシビリティは、ウェブのユニバーサルデザインのことです。2021年5月の障害者差別解消法改正（※）により、これまで民間企業にとって努力義務だったアクセシビリティの対応が義務化されることが決まりました。

この記事では、ウェブアクセシビリティ基盤委員会の委員を務めていたこともある私により、ウェブアクセシビリティとは何かと、要件、対応例、具体的に何をすればよいかというイメージを持っていただけるような内容を記載します。また、日本において義務化されるまでになった世界のウェブアクセシビリティ対応の流れ、日本でアクセシビリティに対応してない場合に今後どうなる可能性があるかについて述べます。

※当サイトでは「障がい」と記載するポリシーですが、「障害者差別解消法」に関して、この記事では正式な名称を用います。

ウェブアクセシビリティとは

ホームページを利用している全ての人が、
心身の条件や利用する環境に関係なく、
ホームページで提供されている情報や機能に支障なくアクセスし、利用できること

外務省のホームページ「ウェブアクセシビリティ」

上記は外務省のホームページで記されているウェブアクセシビリティの定義です。

制作時、ウェブアクセシビリティを考慮する際に行うべきことは多くあります。特にスクリーンリーダーと呼ばれる、ホームページの内容を読み上げるソフトウェアの対応を強く意識する必要があります。

スクリーンリーダーは視覚障がい者など画面を見ることができない方がウェブを利用する際に用いるもので、Windows、iOS、Androidなどには標準で搭載されています。

アクセシビリティの略称について

アクセシビリティは、専門家の間ではA11Y（エーイレブンワイ）と略します。AccessibilityのAとyの間の文字数が11文字だからです。ちなみに私は専門家でしたが、そう呼んだことはありません。呼びやすさはともかく、cが2回、sが2回、iとlが見分けがつきにくい、などで「Accessibility」と書くときに慎重にタイピングしたりはしていますが、A11Yと書いても通じないですしね・・という話はさておき、次からはアクセシビリティの関連規格から、具体的な対応例などについて解説していきます。

ウェブアクセシビリティ関連規格

WCAG2.2

ウェブアクセシビリティに関わる規格として、W3C（W3Cのことはこちらの記事を参照ください）が定める「Web Content Accessibility Cuidelines 2.2（WCAG2.2）」と呼ばれる世界的なルールがあります。

参照：
WCAG2.2原文
WCAG2.1日本語訳（ウェブアクセシビリティ基盤委員会による）

WCAG2.2は以下の4つの原則（要件）があり、それぞれに細かい要件が達成基準として定められています。なお、私が委員を務めていたこともあるウェブアクセシビリティ基盤委員会が、WCAG2.1の日本語訳を行っています。

知覚可能	情報及びユーザインタフェース コンポーネントは、利用者が知覚できる方法で利用者に提示可能でなければならない。
操作可能	ユーザインタフェース コンポーネント及びナビゲーションは操作可能でなければならない。
理解可能	情報及びユーザインタフェースの操作は理解可能でなければならない。
堅牢	コンテンツは、支援技術を含む様々なユーザエージェントが確実に解釈できるように十分に堅牢 (robust) でなければならない。

WCAG2.2の本体文書とは別に、Techniques for WCAG 2.2という達成基準を満たすための達成方法をまとめた文書があります。

参照：
Techniques for WCAG 2.2（原文）
Techniques for WCAG 2.1日本語訳（ウェブアクセシビリティ基盤委員会による）

以下はWCAGのこれまでの策定の歴史です。

WCAGバージョン	勧告日
WCAG1.0	1999年5月5日
WCAG2.0	2008年12月11日
WCAG2.1	2018年6月5日
WCAG2.2	2023年10月5日

このように、世界的なアクセシビリティの基準は、1999年に初めてルールが勧告されて以来、更新を続けており、最新の更新は2023年10月5日です。

最新のWCAG2.2の更新内容は、技術の進歩に合わせた達成方法の追加です。原則が変わっているわけではありません。

ISO/IEC 40500

WCAG2.0をもとに、2012年に国際規格「ISO/IEC 40500」が制定されました。

JIS X 8341-3

「JIS X 8341-3」は、WCAG1.0をベースに2004年に制定されました。その後、WCAG2.0をベースに2010年に改正、2016年にはISO/IEC 40500に合わせる形で2回目の改正が行われています。ISO/IEC 40500はJIS 8341-3が合わせていたWCAG2.0に合わせる形になっているのですが、JISは国際規格に合わせることが求められているため、文言を変える必要があった模様です。

ちなみに、JISの番号8341は、「やさしい」から付けられた番号です。

政府関連機関や、大企業のホームページなどは「JIS X 8341-3」に準拠しているケースが多いと思います。「JIS X 8341-3」は、指定された検証を行うことで、準拠したということを示すことができる仕組みがあります。例えば外務省のホームページでもJISの試験結果を示しているページがあります。他のホームページでも、準拠しているところは大抵、フッターに「アクセシビリティ」のメニューが用意されているので、気になる方は探してみてください。

みんなの公共サイト運用ガイドライン

国、地方公共団体などの公的機関のホームページがアクセシビリティすることを目的とした総務省が定める「みんなの公共サイト運用ガイドライン」があります。2003年に策定、JIS X 8341-3と同じく2010年、2016年に改正されています。これもあり、日本国内においても自治体のホームページなどはアクセシビリティへの配慮がされているものが多いと思います。

ウェブアクセシビリティ関連法律

米国

米国では、古くからは「リハビリテーション法501条」があります。これは政府関連機関の調達条件を定めているものです。1990年に「ADA法（The Americans with Disabilities Act）」が制定され、現在はこの法律をもとに、「利用できないことによる損害」についてエンドユーザーによる民間企業に対しての訴訟が可能です。訴訟の数は年々増えており、2018年には2,285件でその前年に比べて181%増加、その後も増加しており2019年は2,890件、2020年は3,503件、2021年は4,055件となっています。

参考：
2018 ADA WEB ACCESSIBILITY LAWSUIT RECAP REPORT

Amazon、Netflixなどの大企業が訴訟された事例は数多くあり、また歌手のビヨンセのウェブサイトがオンラインで購入できなかったことから訴訟された事例もあります。

参照：Beyonce’s Parkwood Entertainment Sued Over Website Accessibility

世界の動向

米国を筆頭にして諸外国の法整備は進んでおり、フランスでも訴訟事例があります。

欧州

欧州委員会は2015年12月、欧州連合（EU）を対象とした欧州アクセシビリティ法制定を決定し、2019年、欧州連合指令2019/882を発令しました。欧州アクセシビリティ法（European Accessibility Act）と呼ばれますが、これ自体は指令であって法律ではありません。

しかしヨーロッパ各国は、2022年6月28日までにアクセシビリティを保障するための立法化をする義務が生まれました。

カナダ

次の法律において、従業員50名以上の企業はWCAGの達成が義務となっています。

Accessibility for Ontarians with Disabilities Act, 2005

オーストラリア

1992年に障害者差別禁止法（Accessibility Laws and Policies）が制定され、2000年に開催されたシドニー五輪のウェブサイトがアクセシビリティを理由にした世界初の訴訟事例となっています。

ニュージーランド

1993年に障害者差別禁止法（Accessibility Laws and Policies）が制定されています。

韓国

障害者差別禁止法の中で、WCAGを基にした独自のKWCAGを採用し基準として設けています。

その他

その他にも、世界各国で法律制定は進んでおり、次の資料でまとめられています。

World Tour of Accessibility Policy and Standards

日本

日本においては法整備が遅れていました。障害者基本法（※）ではウェブサイトの利用に関しての要件は触れられておらず、2013年6月に制定された障害者差別解消法（※）でも、「努力義務」となっていました。2011年頃だったと思いますが、私はこの方針を人づてに聞いた時のことを今でも鮮明に覚えています。そのとき私がいた場所は奇しくもアメリカでした。先進国アメリカを実感しながら、日本はもはや先進国とは呼べないし、どんどん遅れていくのだな、とその時思ったものです。

そしてようやく、2021年5月に改正された障害者差別解消法において、その公布日である2021年6月4日から起算して３年以内に、民間企業でもウェブアクセシビリティへの配慮が義務化されることとなりました。なお、改正法の施行は2024年4月1日からです。そのため2024年4月1日から義務化という情報も出てきますが、それは施行日であって、実質的な対応リミットは2024年6月3日までということになっていると思われます。

※当サイトは「障がい」と記載するポリシーですが、ここでは法律の正式名称を用いています。

以下に改正前後の記述の比較をします。

障害者差別解消法の改正前

当該障害者の性別、年齢及び障害の状態に応じて、社会的障壁の除去の実施について必要かつ合理的な配慮をするように努めなければならない。

障害を理由とする差別の解消の推進に関する法律の一部を改正する法律

障害者差別解消法の改正後

当該障害者の性別、年齢及び障害の状態に応じて、社会的障壁の除去の実施について必要かつ合理的な配慮をしなければならない。

障害を理由とする差別の解消の推進に関する法律の一部を改正する法律

日本民間企業のウェブアクセシビリティ対応状況

総務省の「令和2年通信利用動向調査報告書（企業編）」によると、企業のホームページでJIS X 8341-3に準拠している企業はわずか5％弱です。

一方で次のグラフはGoogleトレンドという、特定の検索キーワードの検索ボリューム推移を確認できる無料ツールで、「アクセシビリティ」の検索ボリューム推移を調べた結果です。

法改正を境目に、検索ボリュームが2倍程度増加していることが読み取れます。アクセシビリティへの意識の高まりが感じ取れますね。

ウェブアクセシビリティに対応しないと日本においてどうなるのか？罰則は？

みなさん気になってらっしゃるであろう、実際に日本でウェブアクセシビリティに対応してない場合に、義務化によりどうなるのか、というところについて。

私は法律の専門家ではありませんが、アクセシビリティの専門家でもあったことや、企業の事業開発部に身を置いていたこともあり、割と法律関係に詳しいと思っています。また、本件に関して弁護士の方の見解もお聞きしています。

まず、法律で罰則規定が設けられているわけではありませんので、ウェブアクセシビリティに対応していないというだけで罰則があるわけではありません。

ただし、民事訴訟を起こされるリスクは今後高まると言えます。民事訴訟というのは、誰でも起こせますよね？法律というのは、訴訟して裁判になったときの、裁決の判断基準の一つです。

ウェブアクセシビリティの対応がなされてないがために、不利益を被った人がいた場合に、その損害賠償請求で裁判をするかどうかはその人の自由です。法律上義務となっていない状況よりも、義務化のリミットが過ぎてからの場合、裁判を起こしたときに勝てる可能性が高まるということは言えるのではないでしょうか。

このことと、実際に訴訟を起こす人が出てくるかどうかはまた別の問題です。米国と日本を比べた場合に、この類の訴訟の割合に差があることは一般的に知られているところです。

米国では飲食店で出されたものが熱すぎて火傷をすれば訴訟に繋がります。

事例：米マクドナルドに賠償責任、「熱すぎるナゲット」で子供が火傷

もちろん、日本でも訴訟されてもおかしい話ではないのですが、私は聞いたことはありません。

ここまでは事実と客観的なことを述べました。ここからは私の個人的な見解と意見ですが、まず焦点が当たるのは大きなECサイトではないでしょうか。ECサイトはとても便利です。家から出なくても購入できますし、私もよく使います。障がい者の方にとってはより有難いでしょう。目が不自由な人にとってもです。いやむしろ、使えるようになっていて欲しいはずですし、使えるようになっているべきでしょう。

事実の繰り返しですが、アメリカで訴訟を起こされた企業の一つは、Amazonです。

ウェブアクセシビリティの配慮ポイントと対応例

ウェブアクセシビリティの配慮ポイントはもちろんスクリーンリーダー対応だけではありません。以下に配慮ポイントと、対応例を示します。

身体機能	対応ポイントと対応例
視覚	画像など視覚的情報だけで情報を伝えないこと。 主にスクリーンリーダー（画面読み上げ）対応。
色覚	色だけで情報を伝えないこと。 例えばグラフの凡例は色だけで違いを示さず、形も変えるなど。
聴覚	音声だけで情報を伝えないこと。 動画など、伝えられるべき音声へのテキスト（キャプション）の表示など。
運動機能	重要な機能は操作が可能であること。 例えば、上肢障がい者のことなどを配慮してマウスだけでなくキーボード操作も可能にすること。
認知	認知の難しい情報提示の仕方をしないこと。 例えば、動くテキストはユーザー自身で止められるようになっていること。

ウェブアクセシビリティ対応内容

コーディングの品質と直接関わらないもの

ウェブアクセシビリティに対応するには、上記のような大まかな要件だけでなく、その中の細かい要件を知る必要があります。要件に詳しくないと、十分な対応は難しいでしょう。例えば、「操作可能」という原則（要件）の中に、次のような達成基準があります。

達成基準例：

セキュリティのために時間制限を設けるとした場合、制限時間内に達成が難しいユーザーのために制限時間について「解除」「調整」「延長」のいずれかが可能である（WCAG2.2の2.2.1項の意訳）。

これは知らないと対応が難しい例をあえて挙げただけであり、色のコントラストのことであったり、動画にキャプションをつけることであったりと、他にも様々な要件があります。とはいえコーディングの品質と直接関わらないものについては、詳しい人が監修していれば対応できるでしょう。

コーディングの品質と直接関わるもの

スクリーンリーダー対応については、コーディング方法、品質に依存し、時間がかかるかもしれません。それも私がコーディングする場合は標準で対応しているのですが、大規模なサイトになると一人でコーディングするわけにもいかず、詳しい人が検証し、修正指示を出すというやり方になると思います。

何をする必要があるのかというと、基本的にはHTMLの仕様に準拠することです。スクリーンリーダーなどのユーザーエージェントは、HTMLの内容を参照して、それをユーザーに伝えます。文章だと判断すれば文章であることを前提に伝えますし、画像だと判断すれば、画像であることに加え、そこに記されている代替テキスト（<img alt="ここに代替テキストを書きます">）を伝えます。それが装飾画像（altをあえて空にしている画像）であれば、目の不自由な方、視覚障がい者にそのことを伝えても邪魔なだけなのでスクリーンリーダーは無視をしてくれます。また、伝えるユーザーエージェントはスクリーンリーダーに限りません。例えばブラウザでCSSをオフにすれば、代替テキストが表示されます。

もうひとつわかりやすい例を挙げると、テーブル（表組）があります。縦にも、横にも見出しが並び交差する表というのがあると思います。画面を見ることができれば、どのセルが、どの見出しとどの見出しに該当するかが分かりやすくてよいのですが、スクリーンリーダーがそれを解釈するには、見出しに印が必要になります。このページにある上記のテーブル（表組）は私によるコーディングで、対応していますので、コードが読める方はぜひ確認してみてください。

障害者差別解消法に抵触しないようにするには

障害者差別解消法では「当該障害者の性別、年齢及び障害の状態に応じて、社会的障壁の除去の実施について必要かつ合理的な配慮をしなければならない。」と書かれているだけであって、具体的な要件は書かれていません。

何を持ってアクセシビリティ対応がされていないと言えるのか、そこは法律上において厳密には決まっていないということです。ただ、私はテレビドラマの世界しか知りませんが、実際にそのウェブサイトを目が不自由な人が使えるかどうかの実証を裁判の場で弁護士がして見せるようなシーンが浮かびます。「利用できない状態である」ということの証明はいとも簡単にできて、あとはウェブサイトを使えないことによる不利益、損害がどの程度認められるかというところが焦点のように思います。

つまり、JISなどのルールに対応しているかどうかといったことではなく、損害を感じるほどにユーザーが差別的な不便さを感じるかどうかです。

とはいえ、何か拠り所がないと、対応しようにも難しいというのがあるでしょう。「JIS X 8341-3:2016」は、準拠を示す方法まで定められているので、対応時の拠り所にはなりやすく、デジタル庁が示すウェブアクセシビリティ導入ガイドブックでも参照されています。発注者側の調達条件として示すのにも使いやすいようになっています。

JIS X 8341-3:2016への準拠を示す方法

ウェブサイトについて「JIS X 8341-3:2016」に準拠する場合、試験を行ってその試験結果と共に、試験の前提とした条件を当該ウェブサイト上に示すことで準拠を示すことができます。

例：デジタル庁ウェブサイトが示している「JIS X 8341-3:2016」への対応状況

以下に、示すべき内容をご紹介します。

対応度合いを決めて示す

JIS X 8341-3:2016の対応を示す場合、「準拠」「一部準拠」「配慮」の3種類があります。

• 「準拠」は、試験を行って達成基準すべてを満たしている場合に使えます。公開するときは試験結果を合わせて公開します。
• 「一部準拠」は、達成基準の一部を満たしている場合に使えます。一部準拠の場合は追加で今後の対応方針を記載します。
• 「配慮」は、試験の実施と公開の有無は問いません。

ウェブアクセシビリティ導入ガイドブック

ウェブアクセシビリティ対応方針を決めて示す

対象となる範囲を決める

ドメイン名などで、対象となる範囲を決めて示します。例外となる部分がある場合は、例外となる部分について、サブディレクトリやURLなどを示します。

適合レベルを決めて示す

「JIS X 8341-3:2016」は適合レベルA、適合レベルAA（ダブルA）、適合レベルAAA（トリプルA）の3つの適合レベルがあり、「適合レベルAAA」が最も高度な対応です。高度になるほど、対応すべき達成基準の項目が増えていきます。デジタル庁は最低限として「適合レベルAA」を推奨しています。

ウェブアクセシビリティの試験結果を示す

対象となる達成基準について試験を行い、当該ウェブサイトが対象となる達成基準とその試験結果を示します。

試験方法については、ウェブアクセシビリティ基盤委員会（WAIC）が示しています。

JIS X 8341-3:2016 試験実施ガイドライン

ウェブアクセシビリティとSEOとの関連性

コーディングの品質に関する話は、SEOに詳しい方であれば、どこかで聞いた話だと思うでしょう。そうです、アクセシビリティに対応すれば、SEO対策のベースにもなります。

次の図は、SEMRUSHという会社が、AccessibilityChecker.orgとBuiltWithとの協力で調査をした結果を示したものです。

アクセシビリティの対応をしたところ、

• 12%のサイトはトラフィックが増え、
• 73.4%のサイトは自然検索流入が増え、
• 66.1%のサイトが50%以上自然検索流入が増えた

という結果が生まれたということです。

Googleは検索順位を決めるのに、目で見て判断してるでしょうか？少なくともほとんどはそうでないはずです。スクリーンリーダーにしっかりと内容が伝わるようになっているということは、Googleに内容を伝えることに繋がります。

また、Googleは「ユーザーに焦点を絞れば、他のものはみな後からついてくる」の理念が先頭にあります。エンドユーザーにしっかりと伝わる内容になっているかの判断材料として、W3Cの活動に積極的に参画しているGoogleが、HTMLの仕様準拠を確認するのは当然といえます。

ウェブアクセシビリティの対応例／具体例

１つ具体例をお示しします。次の情報は画像を使ってません。

それだけでなく、Step1からStep3の見出しと、その中身の箇条書きとの関係を、table要素とul要素を使って構造で示しています。table要素ではなくdl要素を使う手などもあり、それはどちらでも良いと思います。

もちろんレスポンシブデザインにしていますので、PCでご覧の方は試しに、ブラウザの幅を伸び縮みさせてみてください。

画像にして、alt属性の値に代替情報となるテキストを書く、というのでもWCAG2.2はクリアするのですが、これほど視覚的に伝えている情報が多くなると、テキストだけでは伝わりづらくなりますので、構造を伝えることのできるtable要素と、ul要素を使って伝えています。

私の場合、このぐらいのものは画像を作るより、このようにHTMLとCSSを使って表現した方がむしろ時間がかからなかったりします。スマホの幅で試して、微調整というのを繰り返す回数が画像の場合の方が多くなってしまうためです。

以下のそれぞれで、SEOで差がつくのは想像がつくでしょうか？Googleは3の場合が最も内容を理解し、またユーザーにとっても分かりやすいと判断すると私は考えます。

1. 画像で作ってalt属性にテキスト情報さえ与えてない場合
2. 画像で作ってalt属性にテキスト情報でStep1からStep3の内容を書く場合
3. このようにHTMLとCSSだけで情報を伝えている場合

ウェブアクセシビリティ対応は経済を衰退させるか、推進するか

ウェブアクセシビリティ対応を愚直にやると、工数は増す方向です。そこに必要な予算は、経済を衰退させるでしょうか。この問いは私の専門外ですが、答えは先進国アメリカを見れば見えてくるような気がしませんか？

日本が世界的に見て差別大国と揶揄されるまでに至っている背景としてあるものは、性的マイノリティーだったりとか、種類によっても異なるでしょうし、意思決定のスピードの問題、日本にはびこってきた古い考え方など、色々と個人的に推察するところがあります。その一つとして、経済の衰退を恐れる考えがあったのではないか、という推察があり、このことを考えます。

ウェブアクセシビリティは最新技術の一つだと思っています。法整備の遅れは、最新技術への対応を遅らせている1つの原因になっていると考えます。ウェブアクセシビリティ対応にかかる予算、お金は、きちんと回ります。つまり経済は回りますし、日本の技術は進歩し、日本経済は潤うのではないでしょうか。違ってたら教えてください。

まとめ

ウェブの基盤は複雑かつ完成度の高いユニバーサルデザインになっていますが、コンテンツ制作者側がそのことを意識してなければユニバーサルデザインにはなりません。

ご相談までは無料ですので、よろしければご相談ください。