アクセシビリティ

サイトマップ

トップページ

サイト内検索

アクセシビリティ

適用範囲
- 　誰もが当ウェブコンテンツを利用するときの情報アクセシビリティを確保し、向上させるために、ウェブコンテンツの企画、設計、開発、制作、保守及び運用をするときの配慮すべき事項を規定する。
参考規格
1. JIS X 8341-1:2004　高齢者・障害者等配慮設計指針－情報通信における機器、ソフトウェア及びサービス－第1部：共通指針
2. JIS X 8341-3:2004　高齢者・障害者等配慮設計指針－情報通信における機器、ソフトウェア及びサービス－第3部：ウェブコンテンツ
基本方針
1. ウェブコンテンツを企画・制作するときに、可能な限り誰もが操作又は利用できるように配慮する。
2. ウェブコンテンツは、できるだけ多くの情報通信機器、表示機器の画面解像度及びサイズ、ウェブブラウザ及びバージョンで、操作又は利用できるように配慮する。
3. ウェブコンテンツの企画から運用に至るプロセスで情報アクセシビリティを常に確保し、更に向上するように配慮する。
開発・制作に関する個別要件
1. 規格及び仕様
 1. ウェブコンテンツは、関連する技術の規格及び仕様に則り、かつそれらの文法に従って作成しなければならない。
 - 適切なマーク付け言語が存在する場合は、そのマーク付け言語を使用する。
 2. ウェブコンテンツには、アクセス可能なオブジェクトなどの技術を使うことが望ましい。
 - コンテンツの一部が特定のアプリケーションの文書ファイルである場合、又はレイアウトを決めて表示・印刷されることを前提とした一般用文書ファイルである場合は、WORD、EXCEL、PDF形式として提供する。
 - コンテンツを、動画又は動的なメニューを生成するプラグインを用いて提供する場合、そのプラグインの情報アクセシビリティ支援機能の他、普及状況を勘案して利用する。
2. 構造及び表示スタイル
 1. ウェブコンテンツの表示スタイルは、文書の構造と分離して、書体、サイズ、色、行間、背景色などをスタイルシートを用いて記述することが望ましい。
 - ウィンドウの横幅を指定する場合は、800ピクセル以下として横スクロールが発生しないようにする。
 - レイアウト表示のためには、文書構造を規定するタグを使用せず、文書表現を規定するタグ、あるいはスタイルシートを使用することとする。
 - スタイルシート未対応のブラウザでも内容が把握できるよう確認し、特にプロパティ（ボックスの配置方法）には注意する。
 - スクロールバー、ツールバーなどのブラウザの基本的な機能や表示方法は変更しない。
 2. 表は、分かりやすい表題を明示し、できる限り単純な構造にして、適切なマーク付けによってその構造を明示しなければならない。
 3. 表組みの要素をレイアウトのために使わないことが望ましい。
 - レイアウトに表組みを利用する場合には、読上げ順序を考慮し、単純な構造にする。
 4. フレームは、必要以上に用いないことが望ましい。使用するときは、各フレームの役割が明確になるよう配慮しなければならない。
 - フレーム分割は原則として2つまで（メニューと本文）とし、フレーム内の各ページにもタグを用いて固有のタイトルを付ける。 </LI ><LI >フレームをサポートしていないウェブブラウザのために<noframes>タグを用いてフレームを使用している旨の代替情報を提供する。 </LI ></UL ></LI ><LI >閲覧しているページがウェブサイトの構造のどこに位置しているか把握できるように、階層などの構造を示した情報を提供することが望ましい。 <UL ><LI >サイトマップを設けて、各項目にリンクを設ける。 </LI ><LI >ウェブサイトの構造と現在位置を示すため、いわゆるパンくずメニューを配置する。 </LI ></UL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >操作及び入力 <OL ><LI >ウェブコンテンツは、特定の単一のデバイスによる操作に依存せず、少なくともキーボードによってすべての操作が可能でなければならない。 <UL ><LI >メニューなど重要箇所では、マウスでのみ操作可能なメニュー展開（JavaScript利用）を行わない。 </LI ></UL ></LI ><LI >入力欄を使用するときは、何を入力すればよいかを理解しやすく示し、操作しやすいよう配慮しなければならない。 <UL ><LI >仮名の入力のとき、ひらがなかカタカナを入力欄の前に明示する。 </LI ><LI >入力欄に入力する文字種が全角又は半角のどちらかに制限されているとき、そのことを入力欄の前に明示する。 </LI ><LI >電話番号、郵便番号など入力方法が複数考えられる場合、入力例を明示する。入力欄でハイフンが必要であることを入力欄で明示する。 </LI ><LI >各コントロールには適切な初期値を設定し、必要最小限の操作とする。 </LI ><LI >ラベル（対応するコントロールの名称）とチェックボックスなどのコントロールを関連付けること。ラベル部分をクリックしてもコントロールを選択できるようになる。 </LI ></UL ></LI ><LI >入力に時間制限を設けないことが望ましい。制限時間があるときは事前に知らせなければならない。 <UL ><LI >セキュリティ上の配慮などから入力を一定時間内に終えなければならないときは、その時間を明示する。 </LI ></UL ></LI ><LI >制限時間があるときは、利用者によって時間制限を延長又は解除できることが望ましい。 </LI ><LI >利用者の意思に反して、又は利用者が認識若しくは予期することが困難な形で、ページの全部若しくは一部を自動的に更新したり、別のページに移動したり、又は新しいページを開いたりしてはならない。 <UL ><LI >ページの自動的な移動又は更新をするときは、その旨を記述し利用者に知らせる。 </LI ></UL ></LI ><LI >ウェブサイト内においては、位置、表示スタイル及び表記に一貫性のある基本操作部分を提供することが望ましい。 <UL ><LI >基本操作バナーを設け、各リンクに形状・色・配置に一貫性をもたせる。 </LI ><LI >ホームページ内の自由語検索機能を設ける。 </LI ></UL ></LI ><LI >リンク及びボタンは、識別しやすく、操作しやすくすることが望ましい。 <UL ><LI >「詳細情報はこちら」と指示代名詞部分のみにリンクを設定せず、「詳細情報を表示」と分かりやすく記述する。 </LI ><LI >リンク及びボタンは、操作可能なものであることが分かるような表現にする。 </LI ><LI >リンク及びボタンは、操作しやすい大きさにする。 </LI ><LI >リンク及びボタンは、誤操作しないように隣り合うものとの間隔（文字間・行間）をとり、必要に応じて縦線（｜）や斜線（／）で区切る。 </LI ><LI >リンクのあるテキストは、アンダーラインを消去しない。 </LI ></UL ></LI ><LI >利用者がウェブコンテンツにおいて誤った操作をしたときでも、元の状態に戻すことができる手段を提供しなければならない。 </LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >非テキスト情報 <OL ><LI >画像には、利用者が画像の内容を的確に理解できるようにテキストなどの代替情報を提供しなければならない。 <UL ><LI >文字を含む画像にはalt属性をつけ、内容を記述する。 </LI ><LI >画像は表示サイズと同じサイズの画像ファイルを制作し、<width>・<height>属性を指定する。 </LI ></UL ></LI ><LI >リンク画像には、リンク先の内容が予測できるテキストなどの代替情報を提供しなければならない。 <UL ><LI >HTMLでは、画像にalt属性を付ける。 </LI ><LI >イメージマップにはリンク先の内容を示すalt属性をつけ、代替手段としてのテキストリンクも設ける。 </LI ></UL ></LI ><LI >ウェブコンテンツの内容を理解・操作するのに必要な音声情報には、聴覚を用いなくても理解できるテキストなどの代替情報を提供しなければならない。 <UL ><LI >警告音などの場合、警告を表すテキスト情報などを併用する。 </LI ></UL ></LI ><LI >動画など時間によって変化する非テキスト情報には、字幕又は状況説明などの手段によって、同期した代替情報を提供することが望ましい。 </LI ><LI >アクセス可能ではないオブジェクト、プログラムなどには、利用者がその内容を的確に理解し操作できるようにテキストなどの代替情報を提供しなければならない。また、アクセス可能なオブジェクト又はプログラムに対しても、内容を説明するテキストなどを提供することが望ましい。 <UL ><LI >特定のプラグインを用いる場合は、そのプラグインの最新版を得られるウェブサイトへのリンクを提供する。 </LI ><LI >プラグイン利用時には<object>タグに説明文を記述し、Javaアプレット利用時には<applet>タグに代替情報を記述する。 </LI ><LI >メニューなどの重要な情報を、アクセス可能ではないオブジェクトを用いて提供する場合は、代替テキストリンクを用意する。 </LI ></UL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >色及び形 <OL ><LI >ウェブコンテンツの内容を理解・操作するのに必要な情報は、色だけに依存して提供してはならない。 <UL ><LI >入力フォーム中で「赤は必須項目」と指示する場合には、その必須項目を赤い文字にするだけでなくテキストで「（必須）」を加える。 </LI ></UL ></LI ><LI >ウェブコンテンツの内容を理解・操作するのに必要な情報は、形又は位置だけに依存して提供してはならない。 <UL ><LI >印刷やダウンロードなど、ウェブコンテンツを操作するのに必要な情報にはテキスト情報を付加する。 </LI ></UL ></LI ><LI >画像などの背景色と前景色とには、十分なコントラストを取り、識別しやすい配色にすることが望ましい。 <UL ><LI >テキスト範囲に背景画像を使うときは、単色または文字識別が容易なものとする。 </LI ><LI >文字を画像化するときは、文字に縁取り線を入れるなどして十分な視認性を確保する。 </LI ></UL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >文字 <OL ><LI >文字のサイズ及びフォントは、必要に応じ利用者が変更できるようにしなくてはならない。 <UL ><LI >文字サイズは、ウェブブラウザで変更が可能なようにポイント指定を行わない。タグまたは、・<%>プロパティをスタイルシートで相対的に指定する。 </LI ></UL ></LI ><LI >フォントを指定するとき、サイズ及び書体を考慮し読みやすいフォントを指定することが望ましい。 <UL ><LI >日本語テキストが読みにくくなる斜体（タグ）は使用しない。 </LI ><LI >意味が大きく変わる打ち消し線（<s>・<strike>・<del>タグ）は使用しない。 </LI ></UL ></LI ><LI >フォントの色には、背景色などを考慮し見やすい色を指定することが望ましい。 <UL ><LI >文字色と背景色の識別が困難な、「白と黄」「青と黒」「青紫と黒」の組み合わせは使用しない。 </LI ></UL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >音 <OL ><LI >自動的に音を再生しないことが望ましい。自動的に再生する場合には、再生していることを明示しなければならない。 <UL ><LI ><bgsound>タグによる音の自動再生は行わない。 </LI ><LI >音を提供する場合は、利用者が再生することを選択できるようにする。 </LI ></UL ></LI ><LI >音は、利用者が出力を制御できることが望ましい。 <UL ><LI >音を提供する場合は、広く普及しているプラグインを利用し、利用者が再生、停止、音量調整などを制御可能とする。 </LI ></UL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >速度 <OL ><LI >変化又は移動する画像又はテキストは、その速度、色彩・輝度の変化などに注意して作成することが望ましい。 <UL ><LI >文字が移動する場合、文字移動はコントラストや速度に配慮し認識しやすくする。なお、<marquee>タグは使用しない。 </LI ><LI >表示文字を変化させる場合や、複数の画面を順番に繰り返し表示する場合、背景色とのコントラストや変化速度に配慮し認識しやすくする。 </LI ></UL ></LI ><LI >早い周期での画面の点滅を避けなければならない。 <UL ><LI >テキスト情報は点滅させない。 </LI ><LI >点滅はアイコン等の小範囲のものに限定して利用し、画面全体が1秒間に2回以上明滅する表現は行わない。 </LI ><LI >画面全体を占めるような、しま、渦巻き、同心円などの規則的なパターン模様の使用は、画面の点滅の場合と同様の危険があるため行わない。 </LI ></UL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >言語 <OL ><LI >言語が指定できるときは、自然言語に対応した言語コードを記述しなければならない。 <UL ><LI >日本語ページでは、文字コードをMETA要素で「Shift_JIS」に指定する。 </LI ><LI >文書中で日本語または英語と異なる言語を使用するとき、文書要素（<html>等）または段落要素（・等）でlang属性を指定する。 </LI ></UL ></LI ><LI >日本語のページでは、想定する利用者にとって理解しづらいと考えられる外国語は、多用しないことが望ましい。使用するときは、初めて記載する時に解説しなければならない。 <UL ><LI >日本語ページでは英単語を特に表記する必要がない場合は、カタカナで表記する。 </LI ><LI >機種依存文字（丸付き数字やローマ数字等）や半角カタカナは使用しない。 </LI ></UL ></LI ><LI >省略語、専門用語、流行語、俗語などの想定する利用者にとって理解しにくいと考えられる用語は、多用しないことが望ましい。使用するときは、初めて記載される時に定義しなければならない。 <UL ><LI >文章中に、略語が初めて記載されるとき、正式名称を括弧で付け加える。 </LI ><LI >期間・範囲を示す場合は、「-（ハイフン）」を使用せず、「～」と記述する。 </LI ></UL ></LI ><LI >想定する利用者にとって、読みの難しいと考えられる言葉（固有名詞など）は、多用しないことが望ましい。使用するときは、初めて記載されるときに読みを明示しなければならない。 <UL ><LI >人名や地名などの表記には必要に応じてふりがなを付けるよう留意する。 </LI ></UL ></LI ><LI >表現のために単語の途中にスペース又は改行を入れてはならない。 <UL ><LI >簡素な表枠やスタイルシートにより段落幅を制御してレイアウトすることとし、文中の改行やスペース挿入は原則として行わない。 </LI ><LI >原文どおりに表示する必要がある場合は、<pre>タグを使用するか、PDFファイルを利用することとする。 </LI ></UL ></LI ></OL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ><LI >情報アクセシビリティの確保・向上に関する全般的要件 <OL ><LI >企画・制作に関する要件 <UL ><LI >情報アクセシビリティ指針に適合した標準ページ（画面デザイン、基本操作バナー等）を規定し、必要に応じて利用する。 </LI ><LI >ウェブコンテンツの制作に当たっては、情報アクセシビリティのチェック機能を持つプログラムを利用する。但し、レイアウト目的の構造化タグの使用など機械的なチェックが困難な項目は、情報アクセシビリティ指針に基づきチェックを行う。 </LI ><LI >情報アクセシビリティ指針は、制作に携わる職員が参照可能なよう文書化して掲載し、必要に応じて適宜見直しを行う。 </LI ></UL ></LI ><LI >保守・運用に関する要件 <UL ><LI >必要に応じて情報アクセシビリティのチェック機能を持つプログラムで確認を行う。 </LI ></UL ></LI ><LI >検証に関する要件 <UL ><LI >ウェブコンテンツの検証に当たっては、情報アクセシビリティのチェック機能を持つプログラムを利用する。但し、レイアウト目的の構造化タグの使用など機械的なチェックが困難な項目は、情報アクセシビリティ指針に基づきチェックを行う。 </LI ><LI >高齢者・障害者支援技術など、新しい検証用プログラムを、必要に応じて利用する。 </LI ></UL ></LI ><LI >フィードバックに関する要件 <UL ><LI >利用者の意見、要望、質問は、積極的に情報アクセシビリティ指針へ反映するよう検討する。 </LI ></UL ></LI ><LI >サポートに関する要件 <UL ><LI >ウェブコンテンツには、問い合わせ先の電子メールアドレス、担当部署名を明示する。 </LI ></UL ></LI ></OL ><HR class="gray-line" style="HEIGHT: 2px" /></LI ></OL ></DIV ></DIV ></TD ></TR ></TBODY ></TABLE ><TABLE border="0" cellPadding="1" cellSpacing="0" style="WORD-BREAK: break-all; POSITION: static; background: #c0c0c0" width="750" ><TBODY ><TR ><TD ><TABLE border="0" borderColor="#ffffff" cellPadding="2" cellSpacing="0" class="wakusen" style="WORD-BREAK: break-all; background: #ffffff" width="750" ><TBODY ><TR ><TD align="left" class="text-normal" ><A href="/accessibility.jsp" >ページ先頭へ</A >｜<A href="/accessibility.jsp" >アクセシビリティ</A >｜<A href="/shiyo_joken.jsp" >使用条件</A >｜</TD ><TD align="right" class="text-normal" >Copyright c 2005 soja city. all rights reserved</TD ></TR ></TBODY ></TABLE ></TD ></TR ></TBODY ></TABLE > </DIV ></TD ></TR ><TR ><TD ></TD ></TR ></TBODY ></TABLE ></TD ></TR ></TBODY ></TABLE ></BODY> </HTML>