DreamweaverCCで画像内リンク...イメージマップ（クリッカブルマップ）を設定する時のコツ
Updated
2022.10.15
Published
2015.09.24
公式ヘルプ（当時）が一部わかりにくかったので、調べた方法をご紹介します。
プロパティインスペクターを表示する
プロパティインスペクターがなかなか見つけられず困りました。
ドキュメントの画像を選択し、右下にある三角形をクリックすると、全てのプロパティを表示できます。
ライブモードにしてホットスポットツールを使える状態にする
デザインモードになっているとホットスポットツールが表示されません。
画面左上にあるセレクタから、「ライブ」モードを選択します。
こうしてようやく、プロパティパネルにホットスポットツールが表示されました。
これでイメージマップを設定ができます。
参考サイト
メモ
「イメージマップ」と「クリッカブルマップ」という名称
最初「クリッカブルマップ」だと思ってて、Adobeのサイトが「イメージマップ」と記載していて違和感がありました。調べたら、以下のようなご意見があるようです。
念のためHTMLの仕様書 2.0～4.01 まで原文や和訳を調べてみましたが、予想通り クリッカブルマップと言う表現は一言も無く、全てイメージマップとなっていました。 クリッカブルマップを一部がクリック出来る画像と言う意味で使うのは良しとしても、 HTMLでの正式名称の如く記してあるサイトは誤りです。
レスポンシブデザイン時の注意点
イメージマップはpx座標なので、画像の大きさが画面サイズによって変わるようなケースではホットスポットの位置がずれてしまいます。
利用を避けるか、jQueryなどを活用して座標がずれないように工夫する必要があります。