Ｗｅｂを作られている皆さんはブラウザ・ＯＳ等、環境による見え方の違いについては配慮しながら作られていると思いますが、以外に忘れられているのが、それを見る人の違いについてではないでしょうか。
インターネットで情報を得ているのは若い人達だけではありません。視覚・聴覚・肢体に障害を持つ人や高齢者・日本語を母国語としない人等もいます。より多くの人に見ていただくために、できるだけ配慮したアクセシブルなＷｅｂ作りを心がけて戴ければと思います。
ガイドラインはW3Cや郵政省等（関連情報参照）からでていますが、内容は多岐に渡り難解な部分も多いので、まずアクセシブルＷｅｂ作成の第一歩として、取りあえず配慮して戴きたいことを簡単にまとめて見ました。
Ｗｅｂを見る人が作成者と同じ知識を持っているとは限りません。できるだけ英語・専門用語・略語等は避け、誰にでも解るような配慮をしてください。
【例】画像の場合はＡＬＴ属性を付けることで解決できます。（画像にマウスポインターを乗せてみて下さい）
【悪い例】
【良い例】
当然ですが、視覚障害者が使う音声ブラウザでは画像の中身は解りません。ＡＬＴ属性を付けることで簡単な内容の情報を得ることができます。あまり長くならない程度に説明を入れて下さい。
【悪い例】
【良い例】
【例外】ただし、ワンポイント等で使う特に意味を持たない画像には全角スペースを入れてもかまいません。親切のつもりでリンク先をＡＬＴ属性に書くのはやめましょう。二重読みになって聞きづらくなります。
音声ブラウザでは、コメント(ALT 属性)がある時はその文字を、無い時はそこに書かれているリンク先のURLアドレスを読み上げます。つまりＡＬＴ属性があれば「リンク、こころＷｅｂトップページ」と読みます。
ところが、ＡＬＴ属性が無いと「リンク、http://www.jeida.or.jp/document/kokoroweb/」と読む事になります。これでは、どこにリンクされているのか解りにくいで、特にリンク画像にはＡＬＴ属性を付けて下さい。
【悪い例】
【良い例】
リンクした下位ページにも、同じタイトルが使われていることがよく見られます。例えば、「○○のホームページ」から下位ページに行っても、また「○○のホームページ」の様にタイトルが同じになっている場合です。音声ブラウザではタイトル情報がページの内容を判断する情報となっているので、内容にあった適切なタイトルを付けてください。
【悪い例】
【良い例】
例えば、内容が同じでも（その１）（その２）（その３）の様に番号を付ける等して下さい。
音声ブラウザでは、スペースを文の区切りと見ているので、下記のようにすると「政治」は「まつりごと、おさむ」、「経済」は「けい、すみ」等と読んでしまい意味が解りにくくなります。レイアウトの為に１単語内にスペースを入れないようにして下さい。
【悪い例】
【良い例】
よく使われるイメージマップですが、クライアントサイド・イメージマップの場合は、HTMLファイルの中にそれぞれのリンク情報があるので、音声ブラウザでもリンク先を確認できますが、サーバーサイド・イメージマップの場合、リンク先情報はサーバーにしかないため、基本的にはジャンプすることができません。そこで、なるべくクライアントサイド・イメージマップを使用するようにして下さい。
【タグでの指定例】
<img src="gif/tips1_15.gif" alt="メニュー" width="201" height="129" border="0" usemap="#kokoro1">
<map name="kokoro1">
<area shape="rect" coords="13,15,111,34" href="../index.html" alt="こころＷｅｂ">
<area shape="rect" coords="118,40,189,63" href="part1-2.html" alt="関連情報">
<area shape="rect" coords="27,98,189,120" href="part1-1.html" alt="アクセシブルなＷｅｂ">
</map>
●どうしてもサーバーサイド・イメージマップを使用する場合は、それに対応するテキストのリンクを 併用してください。
こころＷｅｂ／
関連情報／
アクセシブルなＷｅｂ
音声ブラウザではフレームを別々のホームページとして読み上げて、ページを切り替えながら使用する仕組みになっています。それぞれのページには解りやすいタイトルを付けて、広告の為だけにフレームを付けたりする事等は止めて、必要以上にフレームを使わないで下さい。
商品の説明
商品の申込
問い合わせ先