当面の基準
ユーザビリティ・アクセシビリティの配慮に関する下記の基準は当面の最小の記述です。(JIS-6.1)
この基準にかかわらず、各依頼者よりのご希望に従い、制作者は個別の対応をいたします。
また、今後この基準を充実・改定するためにご意見をお寄せください。
-
一般原則
- 基本構造(内容が把握しやすいか)
- 操作性(リンク・入力欄・など)
- 視覚障害者に対する配慮
- 言葉・デザイン(一般に理解しやすいか)
-
基本的なページ構成例
このページのソース最初の48行(35~45 を除く)および末尾の6行
(ソースは画面空白部分を右クリック「ソースの表示」でご参照)
- 適用 html 文法の指定、 Strict「第1行末尾:html 4.01//EN 」、または、
Transitional「第1行末尾:html 4.01 Transitional//EN 」(JIS-5.1.a)
- 言語の指定(文字化けの回避、JIS-5.9.a)
-
- 文字コードの指定(文字化けの回避、JIS-5.9.a)
- CSS 使用 の指定(JIS-5.2.b)
- 検索エンジンに対する配慮
- 同上
- 同上(回避の場合は「none」)
-
- 文字相対サイズ指定、ブラウザによる変更可(JIS-5.6.a)
文字の大きさ基準(本件95%)の指定(高齢者に対する配慮、JIS-5.6.b)
- 表構成は事前指定(表示速度の確保)
- 表構成<td>タグ内文字の大きさ基準の指定(高齢者に対する配慮、JIS-5.6.b)
- 見出しに<H>タグを使用(視覚障害者に対する配慮、JIS-5.2.a)
- 同上
- 同上
- 同上
- <address>タグ内文字の大きさの指定
-
-
- 右本文欄、画面表示の場合の設定(本文欄は左目次欄に対しスクロール)
-
-
- 右本文欄、印刷の場合の設定(本文欄は左目次欄に対しスクロールせず)
-
- タイトルは各ページの内容を正確に(視覚障害者に対する配慮、JIS-5.2.e)
-
- ナビゲーションスキップ(視覚障害者に対する配慮)
- レイアウトに表構成<table>の使用を回避(視覚障害者に対する配慮、JIS-5.2.d)
内容幅を600pxに固定(A4 コピー印刷に対応)または
内容幅の限度は740px(800x600 スクリーンに対応)
- トップ欄:サイトの全ページを通じてデザイン統一性の確保に留意、
位置、表示スタイル及び表記には一貫性のある基本部分を提供(JIS-5.3.f)
1)サイトID(標題、ロゴ)
2)グロ-バル・ナビゲーション・バー
3)階層リスト(パンくずリスト)
- 左目次欄:フレームの使用を回避(視覚障害者に対する配慮、JIS-5.2.f)
-
-
- 更新日(SSI)
- 「Webかわさき」(JIS-6.4&5)
- この行より本文
-
その他、ユーザビリティ(PC未熟者、高齢者に対する配慮)
- 表紙に大きな画像は避け(表示速度の確保)
内容(リンク)構成をわかりやすく
- グローバルナビゲーション、階層リスト、サイト内検索、サイトマップ(共用ナビゲーター)
- 文章はわかりやすく
外国語を多用しない(国語研:外来語言い換え)
読みやすく(箇条書き、区切り)
- リンク・ボタンは識別・操作しやすくする(JIS-5.3.g)
リンクテキストは初期設定に(青色、下線つき)
リンク(階層リスト)に用いる言葉の統一
- サイト内ページ・リンクの階層限度は原則 50 ページまで2段階(閲覧効率の確保)
- ページの長さはA4:1/2 ~ 2(コピー印刷対応、過大スクロールの回避)
- 重要情報、新しい情報は縦スクロールしなくても見える範囲に、横スクロールは回避
- <IMG>タグには「height」「width」を明記し、
画像の実サイズをそれに合せる(表示速度の確保、サーバ容量の節減)
- 機種依存文字(丸数字、ローマ数字など)は使用しない(JIS-5.1.a)
- 個人情報(利用目的・管理体制の明記)
-
その他、アクセシビリティ
視覚障害者(全盲・弱視・色覚)に対する配慮
(ページ読み上げソフトに対応)
- <IMG>タグには「alt」により画像(リンクに用いている場合はリンク先)の内容を明記する。(JIS-5.4.a/b)
- 単語の途中にスペース・改行を入れない(JIS-5.9.e)
- 文字・背景の色にコントラスト(弱視者に対する配慮)
黒背景・太白字、回避:緑・赤、黄・白、そのほか類似色(モノクロプリンタで確認)
聴覚障害者に対する配慮
-
-
-
肢体不自由者に対する配慮
-
-
-
知的障害者(または新規入国者)に対する配慮
- ルビ付(ソースご参照)
-
-
-
検証(ASP)・資料サイト(良いサイトをご推薦ください)
-
検証ツール
検証は下記1、から行うことをお勧めします。
- W3C(ASP):html コード検証
- W3C(ASP):CSS コード検証
- W3C(ASP):Link チェック
- NTT データ(ASP):HAREL Accessibility Check
- NTT(ASP):はなまるチェッカー
-
一般指針
- W3C:World Wide Web Consortium
- W3C:Web Content Accessibility Guidelines(日本語訳)
- 情報通信研究機構:
情報バリアフリーのための情報提供サイト
- モバイルコンテンツ審査・運用監視機構
- Microsoft Accesibility
- ウェブ・アクセシビリティ指針 富士通
-
視覚障害関連指針
- IBM:ホームページリーダー 音声ブラウザ
- PC-Talker 高知システム:音声ブラウザ
- Focus talk Skyfish: 音声ブラウザ
- こころWeb 香川大学教育学部 中邑研究室
- ハンディがあっても利用できるページづくり
- カラーバリアフリーガイド
- 音声メーラ・Voice Popper(ボイスポッパー)
-
実例参考サイト(良いサイトをご推薦ください)
- 企業サイトランキング 2008(主要500社) 日経BP
- 自治体サイトWebアクセシビリティ調査 2008(都道府県・政令都市。特別区) Universal Works
- e-都市ランキング2008(合計1481自治体) 日経BP