７つのポイント：４．イメージマップについて

１つの画像を、いくつかの領域に分けて、それぞれの領域にリンクを貼ったものを「イメージマップ」といいます。イメージマップには、以下の２つの形式があります。

クライアントサイド・イメージマップ
サーバーサイド・イメージマップ

「クライアントサイド・イメージマップ」は、文字通りクライアント（＝ブラウザ）側で処理できるイメージマップ。要するにHTMLの中に領域の指定やリンク先ファイル名などの情報が記述されたものです。
それに対し、「サーバーサイド・イメージマップ」は、各領域に対応するリンク先情報等をサーバー側に置いています。

イメージマップを使用する場合は、出来るだけ「クライアントサイド・イメージマップ」を使用するようにして下さい。
「サーバーサイド・イメージマップ」を使用すると、HTMLからリンク先の情報を取得することが出来ないため、音声によるナビゲーションが著しく制限されることになります。
どうしても「サーバーサイド・イメージマップ」にしなければならない場合は、通常のハイパーリンクを併用するなどの代替手段を検討するようにして下さい。

「クライアントサイド・イメージマップ」を使用する際の考え方は、基本的にリンク画像の場合と同じです。
領域（＝リンク先）ごとに「alt属性」を指定することが出来ますので、それぞれのリンク先の内容を記述するようにして下さい。

【例】

◆ 新製品のご案内 ◆
メニュー

※ この例では、各領域のalt属性に次のような記述をしています。

（リンク領域＝３箇所）

”製品の概要”
”新しい機能”
”価格と入手先”

<IMG src="map.gif" width="100" height="100" border="0" usemap="#menu" alt="メニュー">

<MAP name="menu">

<AREA shape="rect" coords="10,10,90,30" href="xxx.html" alt="製品の概要">

<AREA shape="rect" coords="10,40,90,60" href="yyy.html" alt="新しい機能">

<AREA shape="rect" coords="10,70,90,90" href="zzz.html" alt="価格と入手先">

</MAP>