板橋区公式ホームページ指針（ガイドライン）　9の2

※このページは、ガイドラインに関するページ全9ページの中の2ページ目です

【　目次へ戻る　/　1ページ目へ戻る　/　3ページ目へ進む　】

 （2）画像

　画像の掲載やリンクを貼る場合は、画像が見えない利用者（画面読み上げソフト等で利用している方等）向けに代替情報を用意しないと、情報が伝わらなかったり、どのようなリンク先なのかがわからないために使用することができないことがありますので、注意が必要です。

[1]　画像の持つ意味の有無に関わらず、alt属性（代替テキスト）を設定します。

（用語説明）

[2]　見出しを画像化したもの等は、画像内のテキスト内容を代替テキストへ設定します。

[3]　箇条書きの前のポイント画像、意味をもたない写真やイラスト、配置場所（レイアウト）を調整・制御するための透明や白色等の画像については、代替テキストの中身を読みとばせるように設定し、画面読み上げソフト等で読み上げる必要のない事柄まで発声されることのないようにします。

 （3）リンク画像

　画面読み上げソフト等を使用している方は、ハイパーリンク画像に代替情報がないと、その識別・理解が困難になります。

　また、リンク画像の大きさや形に配慮していないと操作できない方が出てしまうことになりますので注意が必要です。

[1]　ハイパーリンク画像には、代替テキストを設定します。

（用語説明）

[2]　代替テキストに「ここ」や「こちら」等の指示代名詞のみを用いません。

[3]　代替テキストには、「ここをクリック」等のリンク先の内容が推測できない表現を用いません。

[4]　代替テキストの内容は、その部分だけでもリンク先の内容がわかるようにします。

[5]　フォームボタンを画像にする場合は、input要素のalt属性に、代替テキストを設定します。

（用語説明）

[6]　ボタンやアイコンを設置する場合、それがボタンやアイコンであることを推測できるように設置します。

[7]　リンク画像は、適度なリンク範囲を確保できるように、適切な大きさの画像を用います。

[8]　リンク画像は、選択しやすい形のデザインにします。

[9]　リンク画像を並べる場合、利用者の誤操作を防ぐため、ボタン間の間隔を適切に空けます。

[10]　イメージマップを用いる場合は、原則としてクライアントサイド・イメージマップを用います。

（用語説明）

[11]　マップ内のリンク領域の代替テキストをarea要素のalt属性に記述します。

（用語説明）

[12]　イメージマップ全体の代替テキストをimg要素のalt属性に記述します。

（用語説明）

[13]　指針の適用を除外しているホームページ及びウェブシステムについては、やむを得ずサーバサイド・イメージマップを用いる場合、次のとおりとします。

（用語説明）

 （4）ページタイトル

　ページタイトルはページの概要を理解したり、目的のページかを判断するための重要な情報です。ブラウザのタイトルバーに表示されるだけではなく、「お気に入り」に登録された際にも表示されるものです。

　ページタイトルによって内容が把握できないと、わかりにくさや混乱の原因になりますので、適切に設定する必要があります。

[1]　利用者が効率よくページ内容を把握できるように、タイトルは「○○○（今回設定するページタイトル）」＋「| 板橋区」とします。

　（例　くらしのガイド | 板橋区）

（用語説明）

[2]　タイトルには、ページの内容を最も端的に表す単語やフレーズを含めます。

[3]　同一タイトルのページが複数存在しないようにします。

 （5）リンク

　リンクの貼られている部分の文章（リンクテキスト）やリンク画像の内容がわかりにくいと利用者が混乱しますので、識別や操作がしやすいような配慮が必要です。

[1]　リンクテキストだけで、リンク先の内容が想像できるようにします。

[2]　文字列の中の特定の単語のみにリンクを設けるのではなく、適度な範囲を確保できるようにリンク指定する範囲を広げて、リンク先がわかりやすくなる配慮をします。

[3]　「ここ」や「こちら」等の指示代名詞だけでリンク先を指定しないようにします。

[4]　リンクが隣接する場合、適切な間隔を空けます。

[5]　テキストリンクが横に並ぶ場合、各テキストリンクの間には、縦線や斜線を入れます。

[6]　行間を設定する場合、通常より狭くしません。

[7]　外部のホームページとのリンクについては、「板橋区公式ホームページリンク基準」によります。

 （6）スタイルシート

[1]　原則として、スタイルシートを用いて表示方法を記述することとし、table要素やfont要素等で配置や見映えを表現しません。

（用語説明）

[2]　スタイルシートが利用できない環境にも配慮をします。

[3]　使用するスタイルシートのバージョンは、原則として「CSS2.1」とします。

（用語説明）

[4]　画面読み上げソフト等を用いて、スタイルシートが利用できない場合の参照順序を確認します。

【　目次へ戻る　/　1ページ目へ戻る　/　3ページ目へ進む　】