ウェブサイトのバリアフリー「ウェブアクセシビリティ」とは？ 誰にでも使いやすいページのさまざまな配慮

日本における個人のインターネット利用率は国民の約9割にのぼり、その半数以上がスマートフォンを利用しているという。情報へのアクセスは年々容易で身近なものになった。老若男女を問わずインターネットを用いることが日常的になっている今、注目を集めているのが、ウェブサイトのバリアフリー化だ。

ウェブサイトにおける表示やユーザーへの配慮のことを「ウェブアクセシビリティ」と呼ぶが、具体的にはどんなことなのだろうか。少し難しく感じるウェブアクセシビリティだが、その概要と必要性、そしてその基準がどのように生かされているかを、分かりやすく解説する。

「アクセシビリティ（accessibility）」とは、access（利用する）＋ability（能力）という単語からなる造語だ。辞書には、「近づきやすいこと。物を得やすいこと。また、道具などの使いやすさ、情報やサービスに対する利用のしやすさ」（デジタル大辞泉）とある。
「ウェブアクセシビリティ」は、「使いやすさ」「利用のしやすさ」のうち、特にインターネットのウェブページに関する内容を指し、ウェブサイトの利用のしやすさという意味になるだろう。
利用者や端末を選ばず、平等にウェブコンテンツへアクセスでき、提供する情報を得るために必要な配慮のことを指す。
インターネット上のバリアフリー化やユニバーサルデザイン化と捉えると分かりやすい。

バリアフリーは身体に障害のある人へ向けた特別な配慮と思われがちだが、ウェブアクセシビリティの分野では、インターネットを利用するすべての人にとって利便性を損ねないための配慮という考え方が根底にある。

公共施設や競技施設、交通機関などでのバリアフリー化やユニバーサルデザイン化の取組みは著しく進んでいて、標準化されつつある。
だが、ウェブサイトに関しては、残念ながらあまり進んでいないのが現状だ。

自由度の高いインターネットの世界だが、「万人が使いやすい」環境にするためには指針が必要だ。

ウェブアクセシビリティに関する指針やガイドラインなどは国内外にかかわらず多種多様に発表されている。現在、日本国内で運用されているのは「WCAG 2.0」「ISO/IEC 40500:2012」「JIS X 8341-3:2016」の3つになる。

世界基準『WCAG 2.0』
WCAG 2.0は、Web技術の標準化を行う非営利団体「W3C」が提唱するアクセシビリティにおける世界基準のこと。2008年12月に勧告されて以降、多数存在する基準の根幹となっている。

4つの原則である、「知覚可能」「操作可能」「理解可能」「堅牢性」から構成されていて、それぞれを理解しウェブサイトに反映すべし、という指針を示している。それらがどれだけ達成できているか、A、AA、AAAの3つの適合レベルで評価されるのである。

また、「WCAG 2.0に適合している」と表記するためには、次の5つの要件をすべて満たしていなければならない。

・3つの適合レベルのうちいずれかを満たしているか
・ウェブサイト全体が設定のレベルに適合しているか
・ウェブサイトを利用する際のプロセス全体が設定のレベルに適合しているか
・使用している技術がブラウザや支援技術によってサポートされているか
・ページの中の部分がほかの部分へ干渉することがないか

それぞれの要件のなかには注意すべき事柄が細かく設定されているため、すべての対応を行うのは非常に厳しく、ウェブサイト制作に携わる人たち全体の対応力が求められる。

WCAGは年々改定され、最新版「WCAG 2.1」が2018年12月より勧告、次期バージョンとして2.2と3.0の策定が進行中だ。ただ、世界基準としてはWCAG 2.0が最も周知度の高いものといえるだろう。

国際規格『ISO/IEC 40500:2012』
ISO/IEC 40500:2012は、スイス民法による非営利法人国際標準化機構「ISO」と国際電気標準会議「IEC」が共同で定める国際規格。
2012年に先行していたWCAG 2.0 がそのまま国際規格ISO/IEC 40500:2012として制定されたものであるため、内容は同じだ。

日本工業規格『JIS X 8341-3:2016』
JIS X 8341-3:2016は、日本工業標準調査会（JISC）が制定した基準だ。
正式名称は「高齢者・障害者等配慮設計指針－情報通信における機器，ソフトウェア及びサービス－第3部：ウェブコンテンツ」である。「高齢者・障害者等配慮設計」と表記されているのが、日本らしい部分かもしれない。

2004年6月に制定されて以降、2010年8月に改訂。2016年3月にISO/IEC 40500:2012一致規格とすべく改正されて今に至り、内容はWCAG 2.0と同ものになる。
ちなみに、「8341」は「やさしい」の語呂合わせからきているそうだ。

厳しい規格に基づいたウェブアクセシビリティを取り入れることは非常に大変だ。しかし、サイト利用者が情報にアクセスしやすくなるだけでなく、ウェブサイトの運営者にとってもより多くのユーザーに情報を届けることができるというメリットがある。

ここまでは概論的な話だったが、それではウェブアクセシビリティとは具体的にどんなことなのだろうか。世界基準であるWCAG 2.0の4原則をもとに、実例からどのように配慮が行われているか見ていこう。

知覚可能
利用者が提示されている情報を知覚できなければならない。

【例】
リンク表示が画像で作られていると、画面を見られない状況にある人はその画像を押すことができない。視覚情報だけに頼らず、代替テキストの設定でスクリーンリーダーの読み上げでもリンク先や入力の指示が分かるようにすることが必要だ。

視覚だけでなく、音声情報が失われることで情報が欠如しないよう、動画に字幕を入れる、といったことも該当する。

操作可能
ユーザーが意図した操作ができなければならない。

【例】
ウェブサイト上へポインタを合わせるのに、タップやマウスクリックでしか操作できないと、それらを使えない状況の人には使いづらいページになる。フォームコントロール間のタブ移動など、すべての機能をキーボードの操作のみで行えるようにすれば、身体に障害があっても操作が可能になる。

また、セキュリティの関係で時間制限があるページにおいて、操作に時間がかかる人に配慮してセッションの制限時間の設定を長く設ける、といったことも挙げられる。

知覚可能の例。画像に含まれるテキストを代替テキストとして設定することで、スクリーンリーダー利用のユーザーにも情報が伝わるようになる

理解可能
提供する情報や操作が利用者の理解できるものでなければならない。日本語で書かれた文章の中に外国語が出た際、単語や表記の仕方によっては、スクリーンリーダーや機械翻訳にかけたときに正しく読んでくれない可能性がある。
意図した動作になるよう、文章内に他言語が入っている場合にlang属性（書かれている言語）の指定を行う必要がある。

また、次のような場合も該当する。

【例】
入力フォームの下に記入例を明記して入力エラーを回避したり、入力エラーがあった場合にはエラー箇所や修正方法を具体的に表示したりすると、スムーズに再入力ができるようになる。できるだけ利用者が分かりやすい仕様にすべきだろう。


堅牢性
使用している技術の標準仕様に厳密に沿うことで、将来にわたってコンテンツにアクセスできるようにする。ウェブサイトはプログラミング言語を用いて機能や表示される内容がプログラムされている。どんな状況においてもそれらのコンテンツにアクセスできるよう、都度チェッカーを利用して正しく修正する、といった方法を取る必要がある。

理解可能の例。入力したデータに誤りがあることに加えて、具体的なエラーの内容や修正方法を提示することで、より理解しやすい入力フォームにすることができる

ウェブアクセシビリティについて、理解が深まっただろうか。ちょっとした配慮とアイデアで使いやすいサイトに―し、ウェブアクセシビリティを高めることができるのである。ウェブサイトの仕様によってユーザーを限定せず、多様性にウェブサイトが対応できるようにすることが、この取組みで大切な考え方かもしれない。

次回はLIFULLの担当者を交えて、さらに具体的に取組み事例を紹介していく。

※本記事の内容は、LIFULL HOME'S ACTION FOR ALL note 2022年3月掲載当時のものです。

【LIFULL HOME'S ACTION FOR ALL】は、「FRIENDLY DOOR/フレンドリードア」や「えらんでエール」のプロジェクトを通じて、国籍や年齢、性別など、個々のバックグラウンドにかかわらず、誰もが自分らしく「したい暮らし」に出会える世界の実現を目指して取り組んでいます。