トップページ 
ウェブアクセシビリティとは
ウェブアクセシビリティ・サンプルサイト
レベルAAの解説
最低限のアクセシビリティはレベルＡで確保されましたが、より多くの人に正確に情報を伝えるために、目に見えないHTMLの記述方法についても修正を行ったのが、このＷＥＢページです。
フレームの使用は取りやめ、レイアウトをテーブルで実現しました。また、背景画像や文字の装飾などの表現のために、スタイルシートの機能を積極的に活用しました。同時に、レイアウトの指定はすべて相対的な指定にしました。
HTMLの記述方法は、バージョン4.01のルールを遵守するように心がけて再構成してあります。文章を表現する場合にも、見出しタグを利用しています。
配色についても、文字のコントラストに注意しながら、修正を加えています。
a. 各ページの修正箇所と修正方法
1 全体
- フレームの使用をやめ、テーブルを用いてレイアウトを実現した（注1）
- HTML文書のルールに従って、ドキュメントタイプや文字コードの指定など、メタ要素を適切に記述した（3.2.1）
- バックグラウンドの画像やレイアウト、文字の装飾などをスタイルシートを用いて表示するようにした（3.3.1）
- ページ内の文章の各見出しに見出しタグを適切に指定した（3.5.1）
2 トップページ
- 動画（FLASH）を取りやめ、画像のみとした（7.3.2）
- 文字のコントラストに注意した配色に変更した（2.2.1：注2）
3 ニュース
- 文字の大きさを自由に変えられるよう、画像で表現された文字の多く（ページ内の見出しや表内の文字）を取りやめ、テキストにした（注3）
- データテーブルに、表題を追加した（5.5.2）
4 営業案内
- 地図を見るために、新しいウィンドウが開かないようにした（10.1.1）
5 飼育日記
- 一部、難しいと思われる漢字を、ひらがなにした（14.1.10：注4）
- 注1：
- WCAG1.0、AERTでは「フレームの使用は避ける」とまでは言及されていません。しかし、フレームを表示できない環境があることや、フレームを使用していると操作性が悪くなる場合がありますので注意しましょう。
- 注2：
- 画像の色と背景画像の色とのコントラストの問題のため、ウェブヘルパーのチェックでは自動検出されませんが、色のコントラストによっては認識しづらくなることがありますので注意しましょう。
- 注3：
- ウェブヘルパーでは自動検出できませんが、画像化された文字は、サイズが小さい場合でも、多くの場合ブラウザ側ではサイズを変えられませんので注意しましょう。
- 注4：
- ウェブヘルパーでは、JIS第二水準の漢字が含まれていないかどうかをチェックしていますが、第一水準の漢字であっても、難しい読み方や難しい熟語などの使用には注意しましょう。
by (C)情報通信研究機構 バリアフリーサイト, all rights reserved. barrierfree@nict.go.jp