ISMAPとUSEMAPの例

マッピング・ツール

　HTML文書で、クリッカブル・マップを使う場合二つの方法があり、マッピング・ツール（image map editor）を使って座標を書くのが便利です。

• MapEdit （Mac, Windows)
• WebMap: web-map-101.hqx（Mac）
• other imagemapping tools（ツールのリストです）

ISMAPとUSEMAP

1. サーバー側イメージ・マップ
   Webサーバーでのサポートが必要ですが、たいがいサポートされています。ここで使うxxx.mapの書式は、*テキスト形式*でサーバーのマニュアルをみなければなりません。asahi-netの場合は、Imagemap -- Manualに説明があります。
   ISMAPの例
2. クライアント側イメージ・マップ
   ブラウザがMAP, AREA要素をサポートしていなければなりませんが、最新のものはたいがいこれをサポートしています。
   USEMAPの例
3. クライアント側イメージ・マップは、早いなどの利点がありますが、全てのブラウザがサポートしていませんので、サーバー側とクライアント側を併用することもできます。
   並記しておけば、最新のブラウザはクライアント側イメージ・マップを使い、webサーバーに依存しなくて早く表示します。一方、クライアント側イメージ・マップをサポートしていないブラウザはUSEMAP属性を無視してサーバー側イメージ・マップを使います。いずれの場合でも、テキスト・ブラウザのために　AREA, IMGでのalt="text"を記載しておくべきです。Imagemaps -Text- friendly?やLynx Friendly Imagemaを見てください。
   ISMAPとUSEMAPの並記の例

DTD 3.2をみます。

* MAPは、テキスト・レベル要素なのです。
<!--================= Text Markup =====================================-->

<!ENTITY % font "TT | I | B  | U | STRIKE | BIG | SMALL | SUB | SUP">
<!ENTITY % phrase "EM | STRONG | DFN | CODE | SAMP | KBD | VAR | CITE">
<!ENTITY % special "A | IMG | APPLET | FONT | BASEFONT | BR | SCRIPT | MAP">
<!ENTITY % form "INPUT | SELECT | TEXTAREA">
テキスト・レベル要素とは、上で規定されたものです。

つまり、以下のように表現されています。
<!ENTITY % text "#PCDATA | %font | %phrase | %special | %form">
MAPは、%formで%textになります。ということは、ブロック・レベル要素内で使わ
れ、Pで囲わなければならない場合もでてきます。

* alt属性を書かなければなりません。
<!--================== Client-side image maps ===========================-->

<!-- These can be placed in the same document or grouped in a
     separate document although this isn't yet widely supported -->

<!ENTITY % SHAPE "(rect|circle|poly)">
<!ENTITY % COORDS "CDATA" -- comma separated list of numbers -->

<!ELEMENT MAP - - (AREA)*>
<!ATTLIST MAP
    name    CDATA   #IMPLIED
    >

<!ELEMENT AREA - O EMPTY>
<!ATTLIST AREA
    shape   %SHAPE  rect
    coords  %COORDS #IMPLIED  -- defines coordinates for shape --
    href    %URL    #IMPLIED  -- this region acts as hypertext link --
    nohref (nohref) #IMPLIED  -- this region has no action --
    alt     CDATA   #REQUIRED -- needed for non-graphical user agents --
    >
=========================================================================

<P>
<MAP>
	<AREA>
	</AREA>
</MAP>
</P>
が基本です。

AREAでは、「alt     CDATA   #REQUIRED」とalt="text"が必須です。

［ホームページ］