視覚障害者対応Webページへの修正ガイドライン
2006年09月21日更新
ここでは、信州大学e-Learning Web教材を視覚障害者(全盲)の方が音声ブラウザ
(
IBM ホームページー・リーダー 3.01を標準とする)
を使って理解できる形式に修正する方法について説明する。
また、今後の視覚障害者対応Webページ製作のガイドラインとする。
Webブラウザのタイトルバーに表示されるタイトルが下記のような場合、修正を行う：
- 複数ページに同じタイトルがつけられている。
- タイトルがページ内容を適切に示していない。
- タイトルが存在しない。
対処方法：
- 適切なタイトル名に変更、あるいはタイトルを付加する。
どのようなタイトルにしていいか分からない場合は、教材作成教員に問い合わせる。
- トップページのタイトル名には、「信州大学教材 - 教材名・トップページ」
をつける。その他のページでは、ページ内容を示すタイトルをつける。
また、章や節の番号がついている場合は、それをつける。
- HTML文書の変更点：
- HTML文書上部にある<TITLE>〜</TITLE>部分に適切なタイトル
を挿入する。
- 例：<TITLE>1.1節 集合とは</TITLE>
- 参考HP：
ページの先頭・末尾部分に、微小画像にALT属性を付加する形式で、
本文(本文先頭)へのリンクをつける
(サンプルページ)。
ページ内に現在のページの文書構造上の位置をリンクメニューとして、
ページの上下につける(サンプルページ)。
例：トップページ > 第1章 事象 > 1.1節 表の種類
ページの上下に現在のページの前後ページへのリンクをつける
(サンプルページ)。
例：前のページへ、次のページへ
|
図、画像、写真、イメージマップ、アプレット、アニメ、ビデオ
|
図、画像、写真、イメージマップ、アプレット、アニメーション、ビデオに
代替テキストが設定されていない場合、
設定されていても説明不足の場合は、下記の方法で代替テキストを付加・修正する。
代替テキストの説明は、それと同等の意味や役割を表現するものでなくてはならない。
例えば、ジャンプボタンの場合は、
そのリンク先の名称を代替テキストとして指定することになる。
対処方法：
- 説明の不要な画像には、スペースのALT属性を付加する。
例：alt=" "
- 短い説明で十分な場合は、ALT属性を付加する。
設定方法詳説
- 長い説明になる場合は、LONGDESC属性を付加し、説明テキストを別に作成する。
設定方法詳説
- イメージマップによってリンク先を指定している場合、
ホットスポットに代替テキストを付加する。
設定方法詳説
- 図の開始と終了がわかるように、ALT属性に「図の開始」、「図の終了」
の説明を加える(グラフについては、「グラフの開始」、「グラフの終了」と
説明を加える)。
(サンプルページ１、
サンプルページ２)
- アニメーション部の前には、微小画像を付加し、その画像の代替テキストとして
アニメーションの説明を加える。
この場合、アニメーションの説明の開始と終了がわかるように、
ALT属性の最初と最後に、それぞれ「アニメーションの説明開始」、「説明終了」
と説明を加える
(サンプルページ３)。
- 参考HP：
表の中には、画像形式やアスキーテキストで表現された表がある。
全ての表は、HTML文書のTABLEタグを用いて表現することとする。
対処方法：設定方法詳細
- TABLEタグで表現されていない表は、TABLEタグ形式で表現しなおす。
- TABLEタグのsummary属性を使用して、表構造の説明をつける。
- 表題をCAPTIONタグで入れる。
- ヘッダ(見出し)はTHタグで示し、データセルはTDタグで示す。
- 表のヘッダ・本体・フッタを分類するためにTHEAD・TFOOT・TBODYを、
表内の行と列を分類するのにscopeを使用する。
データ間のさらに複雑な関係を示すにはid、headers の各属性を使用する。
- ヘッダに音声ブラウザで読ませるテキストを埋め込みたい場合
(表中に書かれたテキストと異なるテキストを読ませたいとき)、
THタグのabbr属性を使用する。
- 表の前後には、極小画像を配置し、ALT属性として「表の開始」、
「表の終了」を指定する
(サンプルページ)。
- 音声ブラウザによっては、表中の項目間の関連づけを表現できない場合がある。
このため、Excelのような表計算ソフトの表を添付する
(サンプルページ)。
- 参考HP：
数式は、アスキーテキスト、画像など、さまざまな形式で記述されている。
ここでは、画像と代替テキストを使った形式に統一することにする。
対処方法：
数式の読み上げ規則(2006/05/15更新)を参照
上記規則に記載されていない記号については、
記号の読み方辞典
の「読み1」に準じて読む。
数量単位、記号、英単語、用語、数値などは、音声ブラウザで正確に読み上げられない
場合がある。これらについては、音声ブラウザの単語辞書への読み方の登録、あるいは
画像と代替テキストを使って表現することにする。
対処方法：
- 現在、単語辞書に登録してある読みは、ここを参照
(今後、必要に応じて登録する)。
- 上記の単語辞書と異なる読み、音声ブラウザで正確に読み上げられない可能性
のある部分については、画像と代替テキスト形式で置き換える。
例：100 は通常は10進数の「ひゃく」と読ませるが、
場合によっては2進数として「いちれいれい」と読ませたい場合がある。
このような場合、音声ブラウザでうまく読めない2進数の「100」を画像と
代替テキストで置き換える。
- 読みが分からない場合は、Webページ作成教員に問い合わせる。
- 見出し部分は、
単に文字を大きくしたり太字にするなどの見た目の効果を使うのではなく、
h1〜h6タグを用いて表現する。
- レイアウトに表を使っている場合、音声ブラウザの読み順を考慮すること。
参考：
http://www.phoenix-c.or.jp/~takayan/html/tag/table-x.html
- 複数行にわたるASCIIアートで数式、図、表を形成している(絵文字を含む)
場合は、上述の方法により、適切な形式に変換する。
- 色を使って説明している部分がある場合は、色に依存しない説明に書き換える。
- PDF文書になっている場合は、担当教員からソーステキスト(LaTeX文書、
PowerPoint文書)を提供していただき、HTML文書化を行う。
LaTeXからHTML形式への変換はlatex2htmlプログラム、
PowerPoint文書からHTML形式への変換は、
PowerPointの変換機能を使って行えばよいだろう。
- 文書、プログラムなど、本来テキストで表現すべき部分が、
画像形式となっている場合は、その部分をHTML文書化する。
- 句読点は「。」と「、」に統一する(「．」と「，」はそれぞれ、
「ぴりおど」、「こんま」と音声ブラウザに読ませるため、これとは区別する)。
- プログラムなどの特殊文書では、その前後に「命令始まり」、
「命令終わり」などのマークを入れる
(やり方の詳細2005/01/21追加)。
- 文章に下線が引かれている場合は、その前後に「下線始まり」、
「下線終わり」のマークを入れる(やり方の詳細)。
- 日付の区切り記号にスラッシュを使うと分数として読まれてしまう場合がある。
この場合、年月日を入れる。例：2002/12/11 → 2002年12月11日
- 金額の単位は金額の後ろにつける。例：￥500 → 500円
- 文字列間にスペースや改行を入れない。例：「政 治」→「政治」
- リンク部に表記する文章に改行を入れない。
悪い例：ここで改行
しない
- 伸ばす音に「〜」を使わず、「ー」を使う。例：「わ〜い」→「わーい」
- 丸数字やローマ数字などの機種依存文字は使用しない。例：� ↓困覆�
- 英語部分は <span lang="en">English Words</span> のように括る。
ただし、プログラムや命令部分に含まれる英語は除く(2005/01/28追加)。
作成したページは、下記のツールを使ってチェックすることが望ましい。
文責：
宮尾(miyao@cs.shinshu-u.ac.jp)