Web屋のネタ帳

以前紹介したWebアクセシビリティのJIS規格 ＝ JIS X 8341-3 高齢者・障害者等配慮設計指針−情報通信における機器， ソフトウェア及びサービス−第3部：ウェブコンテンツ ＝ について、筆者もようやくひととおり目を通せた。 そこで、その内容の全部は無理だがいくつかについて紹介しよう。

まず、このテの文書を読む場合にはshouldと mustの違いを意識したほうがいい。つまり、

• 「すべきである」「望ましい」＝should＝推奨
• 「でなければならない」「しなければならない」＝must＝必須

といったような言葉じりに注意。

まず、根本的な入力インターフェースの問題。

「特定の身体部位だけを想定した入力方法に限定しないで、多様な身体部位で、 ウェブコンテンツを操作又は利用できる」 （4.2 基本的要件 より）
... 特定の単一デバイスによる操作に依存せず、 少なくともキーボードによってすべての操作が可能でなければならない。
(5.3 操作及び入力 より)

つまり、マウスだけでしか操作できないようなサイトはダメということだ。 ご存じない方は試していただきたいが、 どんなブラウザでもたいていはマウス無しでも操作できるようになっている。 スペースキーでスクロールできるし、 キーボードのタブキーの連打でリンク部分を移動できる。シフトを押しながら タブキーを押せば逆移動もできる。見たいリンク部分でエンターキーを押すと そのリンクにジャンプできる。

ところが、せっかくブラウザがキーボードだけで操作できるようになっているのに、 WEBサイト側がそれを阻害しているケースが多々ある。 たとえばFlashなどによるコンテンツはこのキーボード操作ができない可能性が高い。 また、BIGLOBEのトップページのように、 メニュー部分をJavaScriptで書いている場合も、タブキーでの リンク部分移動ができない（各メニューの詳細を展開できない）。

フレームを使う場合はよくよく注意しましょう、的なことも書かれている。

フレームは、必要以上に用いないことが望ましい。 使用するときは、 各フレームの役割が明確になるように配慮しなければならない

• 音声ブラウザなどの利用者は、視覚的に全体を把握することができないため、 各フレームの役割を理解したりフレームの内容の変化を認識したりすることが 難しい場合がある。
• キーボードだけで操作するとき、フレームの切り替えが煩雑になる場合もある。
• フレームを使用したページは、各フレームの役割及び各フレーム内の データの変化がわかりにくいために、情報アクセシビリティを損ねる可能性がある。

(5.2 構造及び表示スタイル)

入力フォームの作り方にも興味深い指摘があった。

入力欄を使用する時は、何を入力すればよいかを理解しやすく示し、 操作しやすいように配慮しなければならない。
...（中略）...
電話番号、郵便番号など入力方法が複数考えられる場合、入力例を明示する。
良い例↓

電話番号(ハイフンを入力) 例：000-0000

悪い例↓

電話番号	(ハイフンを入力) 例：000-0000

(5.3 操作及び入力 より)

ハイフンの有無や入力例が無いのはもちろんまずいのだが、 それを入力フィールドの前に置くか後ろに置くかでも違う。 後ろに置くと、視覚障害者は入力が終わってから その入力例や制限に気づいてしまうのだそうだ。

また、文字サイズの可変性については必須として規格されている。

文字のサイズ及びフォントは、 必要に応じ利用者が変更できるようにしなくてはならない。
(5.6 文字)

これは当然だろう。
See: フォントサイズを固定するな！− 後悔しないためのWebデザイン

他にも紹介したいのだがとても全部は書ききれない。 総じて、さまざまな例示やHTML/CSSの実際の書き方も盛り込まれており、 意外と充実した内容なので驚いた。

これまでは「アクセシビリティ」という単語だけが一人歩きしていて そのココロは誰もわからないような感があった。 このJIS規格の出現で「アクセシビリティとは何ぞや」という問いに ようやく統一的なものが出たといえるだろう。 とはいってもあけてみれば単に 「見やすくて使い勝手の良いWebサイトのつくりかた」であって、 あたりまえと言えばあたりまえのことばかりだ。 しかし本当に実践できているサイトは多くは無いだろう。