JISの個別要件と12のポイントの関連
「みんなが使えるホームページの作り方」の12のポイントが関連するJIS X 8341-3「高齢者・障害者等配慮設計指針−情報通信における機器，ソフトウェア及びサービス−第3部：ウェブコンテンツ」の「5.開発及び制作に関する個別要件」を一覧に整理しました。
「みんなが使えるホームページの作り方」は、JISが制定される前に作成したもので、JISの開発及び制作に関する個別要件には対応していません。12のポイントが関連するJISの個別要件及びその内容について、それぞれJIS原本を参照してください。
なおJISの各個別要件は、経済産業省産業技術環境局標準課情報電気標準化推進室のご理解により原本からそのま引用させて頂きました（転載禁止）。
| JIS X 8341-3 | みんなが使えるホームページの作り方 （該当する項目が無いJISについては、 簡単な補足説明を記載しています。） |
|
|---|---|---|
| 5.1 規格及び仕様 | 5.1.a ウェブコンテンツは、関連する技術の規格及び仕様に則り、かつそれらの文法に従って作成しなければならない。 |
1-a DOCTYPE宣言をつける 1-b 使うべきでないタグ 1-c 文法の確認 5-b 機種依存文字と記号に注意する |
| 5.1.b ウェブコンテンツには、アクセス可能なオブジェクトなどの技術を使うことが望ましい。 | 9-a テキストによる代わりの内容も用意しておく 9-b スクリプトに未対応でも利用できるようにする 9-c 入力装置に依存しないイベントハンドラを使う 12-c テキストだけの別ページは最後の手段 |
|
| 5.2 構造及び表示スタイル | 5.2.a ウェブコンテンツは、見出し、段落、リストなどの要素を用いて文書の構造を規定しなければならない。 | 2-a 見出しを明確に示す 2-b 強調したい部分のタグ付け 2-c ブロックレベルとインライン |
| 5.2.b ウェブコンテンツの表示スタイルは、文書の構造と分離して、書体、サイズ、色、行間、背景色などをスタイルシートを用いて記述することが望ましい。ただし、利用者がスタイルシートを使用できない場合、又は意図的に使用しないときにおいても、ウェブコンテンツの閲覧及び理解に支障が生じてはならない。 | 10-a CSSが適用されなくても読めるようにする 10-c フォントサイズはCSSで指定する |
|
| 5.2.c 表は、わかりやすい表題を明示し、できる限り単純な構造にして、適切なマーク付けによってその構造を明示しなければならない。 | 6-b 表のヘッダを明確に示す 6-c 表のヘッダとデータを関連付ける |
|
| 5.2.d 表組みの要素をレイアウトのために使わないことが望ましい。 | 6-a 音声環境での読み上げ順に注意する | |
| 5.2.e ページのタイトルには、利用者がページの内容を識別できる名称を付けなければならない。 | 【該当項目無し】音声ブラウザの利用者、検索エンジンの利用者などにとって、ページのタイトルは自分の探している情報がそのページにあるかどうかを判断する最初の手がかりになります。title要素にページ内容を把握できる分かりやすいタイトルを用意しましょう。 | |
| 5.2.f フレームは、必要以上に用いないことが望ましい。使用するときは、各フレームの役割が明確になるように配慮しなければならない。 | 8-a 各フレームの役割を明示する 8-b フレームが表示できない環境用の内容も入れる 8-c フレームの幅や高さを固定しない |
|
| 5.2.g 閲覧しているページがウェブサイトの構造のどこに位置しているか把握できるように、階層などの構造を示した情報を提供することが望ましい。 | 【該当項目無し】パンくずリストと呼ばれるような手法などを用いて、閲覧ページの現在位置を示すことにより、利用者が迷いにくくなったり、情報を探しやすくなります。 | |
| 5.3 操作及び入力 | 5.3.a ウェブコンテンツは、特定の単一のデバイスによる操作に依存せず、少なくともキーボードによってすべての操作が可能でなければならない。 | 7-a 入力・選択項目に対するラベルの配置位置 7-c tabキーによる移動順序を設定する 9-c 入力装置に依存しないイベントハンドラを使う |
| 5.3.b 入力欄を使用するときは、何を入力すればよいかを理解しやすく示し、操作しやすいよう配慮しなければならない。 | 7-a 入力・選択項目に対するラベルの配置位置 7-b 入力・選択項目とラベルを関連付ける |
|
| 5.3.c 入力に時間制限を設けないことが望ましい。制限時間があるときは事前に知らせなければならない。 | 【該当項目無し】障害がある場合など入力作業にかなりの時間を要する場合があります。制限時間があると利用が出来なくなってしまうかもしれません。また制限時間が設定されていることが分からないと、混乱の原因になります。 | |
| 5.3.d 制限時間があるときは、利用者によって時間制限を延長又は解除できることが望ましい。これができないときは、代替手段を用意しなければならない。 | 【該当項目無し】制限時間を利用者が自分で延長したり、制限設定を解除できるようにすべきです。それが難しい場合は、利用できない人が出る可能性がありますので、同じ目的を達成できる別の手段（メール、電話、FAX、対応窓口など）を合わせて用意し、案内しましょう。 | |
| 5.3.e 利用者の意思に反して、又は利用者が認識若しくは予期することが困難な形で、ページの全部若しくは一部を自動的に更新したり、別のページに移動したり、又は新しいページを開いたりしてはならない。 | 4-b 新しいウィンドウは混乱のもと 12-b 自動的に別のページに移動させない |
|
| 5.3.f ウェブサイト内においては、位置、表示スタイル及び表記に一貫性のある基本操作部分を提供することが望ましい。 | 【該当項目無し】サイト内で共通のナビゲーションメニューを設けることで、迷いにくく情報を探しやすいサイトになります。見栄えや操作の仕組みに一貫性があることが重要です。 | |
| 5.3.g ハイパリンク及びボタンは、識別しやすく、操作しやすくすることが望ましい。 | 4-a リンク先が予測できるようにする 4-c 連続するリンクは明確に区切る |
|
| 5.3.h 共通に使われるナビゲーションなどのためのハイパリンク及びメニューは、読み飛ばせるようにすることが望ましい。 | 12-a ナビゲーションを読み飛ばすためのリンク | |
| 5.3.i 利用者がウェブコンテンツにおいて誤った操作をしたときでも、元の状態に戻すことができる手段を提供しなければならない。 | 【該当項目無し】障害のある場合や、年配の利用者には、誤って意図しない操作をしてしまうことが比較的多くあります。そのような場合でも、ブラウザの戻るボタンや画面上のリンクなどから元の状態に簡単に戻れるよう設計し、必要に応じて補足説明などで分かりやすく案内しましょう。 | |
| 5.4 非テキスト情報 | 5.4.a 画像には、利用者が画像の内容を的確に理解できるようにテキストなどの代替情報を提供しなければならない。 | 3-a 画像には適切な代替テキストを |
| 5.4.b ハイパリンク画像には、ハイパリンク先の内容が予測できるテキストなどの代替情報を提供しなければならない。 | 3-a 画像には適切な代替テキストを 3-b イメージマップ使用時の注意 |
|
| 5.4.c ウェブコンテンツの内容を理解・操作するのに必要な音声情報には、聴覚を用いなくても理解できるテキストなどの代替情報を提供しなければならない。 | 9-a テキストによる代わりの内容も用意しておく 12-c テキストだけの別ページは最後の手段 |
|
| 5.4.d 動画など時間によって変化する非テキスト情報には、字幕又は状況説明などの手段によって、同期した代替情報を提供することが望ましい。同期して代替情報が提供できない場合には、内容についての説明を何らかの形で提供しなければならない。 | 9-a テキストによる代わりの内容も用意しておく 12-c テキストだけの別ページは最後の手段 |
|
| 5.4.e アクセス可能ではないオブジェクト、プログラムなどには、利用者がその内容を的確に理解し操作できるようにテキストなどの代替情報を提供しなければならない。また、アクセス可能なオブジェクト又はプログラムに対しても、内容を説明するテキストなどを提供することが望ましい。 | 9-a テキストによる代わりの内容も用意しておく 9-b スクリプトに未対応でも利用できるようにする 12-c テキストだけの別ページは最後の手段 |
|
| 5.5 色及び形 | 5.5.a ウェブコンテンツの内容を理解・操作するのに必要な情報は、色だけに依存して提供してはならない。 | 11-a 色が再現されなくてもわかるようにする |
| 5.5.b ウェブコンテンツの内容を理解・操作するのに必要な情報は、形又は位置だけに依存して提供してはならない。 | 【該当項目無し】音声でサイトを利用するような場合は、位置関係や形といった視覚的な表現の理解が難しくなります。情報を分かりやすく伝えるために位置関係や形を利用する場合がありますが、そのような視覚的な理解が難しい場合でも情報の把握などに支障が出ないように注意しましょう。 | |
| 5.5.c 画像などの背景色と前景色とには、十分なコントラストを取り、識別しやすい配色にすることが望ましい。 | 11-b 文字色と背景色のコントラストは十分にとる 11-c 文字色と背景色は常にセットで指定する |
|
| 5.6 文字 | 5.6.a 文字のサイズ及びフォントは、必要に応じ利用者が変更できるようにしなくてはならない。 | 10-b 大きさの指定には相対的な単位を使う |
| 5.6.b フォントを指定するとき、サイズ及び書体を考慮し読みやすいフォントを指定することが望ましい。 | 【該当項目無し】読みやすさや、デザイン性の向上のために、文字のサイズや書体を指定することがあります。障害のある場合や年配の利用者も含め、読みにくさの原因にならないよう注意して指定しましょう。 | |
| 5.6.c フォントの色には、背景色などを考慮し見やすい色を指定することが望ましい。 | 11-b 文字色と背景色のコントラストは十分にとる 11-c 文字色と背景色は常にセットで指定する |
|
| 5.7 音 | 5.7.a 自動的に音を再生しないことが望ましい。自動的に再生する場合は、再生していることを明示しなければならない。 | 【該当項目無し】音声で利用している場合、サイトから自動的に音が再生されると、二重になり内容を把握しづらくなります。また、音を再生できないパソコンを使っている人や、耳が聞こえない人などには、音が再生されていることが分かりません。情報が伝わらなかったり、利用者の知らないうちに音が流れていて周りに迷惑をかけたりということが起きないように、利用者の意図と無関係に音を再生することは避けましょう。 |
| 5.7.b 音は、利用者が出力を制御できることが望ましい。 | 【該当項目無し】サイト内で音を再生するコンテンツを用意する場合には、音の再生・停止や、音量の調整などを利用者自身が行えることを確認しましょう。 | |
| 5.8 速度 | 5.8.a 変化又は移動する画像又はテキストは、その速度、色彩・輝度の変化などに注意して作成することが望ましい。 | 5-c 文字を点滅・移動させない |
| 5.8.b 早い周期での画面の点滅を避けなければならない。 | 5-c 文字を点滅・移動させない | |
| 5.9 言語 | 5.9.a 言語が指定できるときは、自然言語に対応した言語コードを記述しなければならない。 | 【該当項目無し】ウェブでは日本語だけでなく様々な言語が用いられています。HTML要素のlang属性にそのページがどの言語で書かれているかを指定することで、音声や点字で読んでいる場合などでも適切に伝わるようになります。 |
| 5.9.b 日本語のページでは、想定する利用者にとって理解しづらいと考えられる外国語は、多用しないことが望ましい。使用するときは、初めて記載する時に解説しなければならない。 | 【該当項目無し】外国語が苦手な日本人はたくさんいます。特に年配の利用者にとっては、外国語が多用されていると非常に使いにくい印象になります。乱用を避け、日本語での説明をつけるなど配慮をしましょう。 | |
| 5.9.c 省略語、専門用語、流行語、俗語などの想定する利用者にとって理解しにくいと考えられる用語は、多用しないことが望ましい。使用するときは、初めて記載されるときに定義しなければならない。 | 【該当項目無し】一般的でない用語は乱用を避け、使用する場合は、説明をつけるなど配慮しましょう。 | |
| 5.9.d 想定する利用者にとって、読みの難しいと考えられる言葉（固有名詞など）は、多用しないことが望ましい。使用するときは、初めて記載されるときに読みを明示しなければならない。 | 【該当項目無し】難しい漢字は乱用を避け、使用する場合は、説明をつけるなど配慮しましょう。 | |
| 5.9.e 表現のために単語の途中にスペース又は改行を入れてはならない。 | 5-a 単語の途中に空白や改行を入れない | |
| 5.9.f ウェブコンテンツは、文章だけではなく、分かりやすい図記号、イラストレーション、音声などを合わせて用いることが望ましい。 | 【該当項目無し】文章だけの説明では分かりにくいケースは多々あります。図やイラスト、音声などを効果的に活用し、分かりやすさを向上させましょう。認知や記憶に障害があり文章の理解が難しい場合でも、図やイラストなどで分かりやすく表現されていると、理解が可能な場合があります。 | |
