ビルダー11で画像に文字を入れてリンク挿入方法

　ホームページビルダー11標準モードでホームページを作成しています。
色々と調べたのですが、あきらめきれずご質問させていただくことにしました。
例えば、赤・黄色・白の3本のチューリップが写っている一枚の写真があるとします。
赤のチューリップのところに“あか”と文字を入れ、あかという文字にリンク貼をし、
黄色のチューリップのところに“きいろ”と文字を入れ、黄色という文字にリンク貼をし、
白も同様にする。
と、いうことをしたいです。
レイアウト枠を使って作成したのですがプレビューを見ると、かなりのずれが生じました。
今度はプレビューを見ながら調節しました。
しかし、いざアップすると、
またもやずれていました。しかも、スマホでも見てみたら、
パソコンとはまた異なったずれ方をしていました。
なにか、よい解決策があれば、教えてください。
よろしくお願いいたします。

No.1 回答者： torayoshi 回答日時： 2014/10/31 16:21

画像とテキストが別々だと、閲覧環境によってどうしてもズレが生じてしまいますね。

こういった場合は、画像そのものにリンクを埋め込む「イマージマップ」を使うと良いでしょう。
これは画像とリンクが一体なので、PCで見る限りズレは生じません。
ホームページビルダーにもイメージマップ機能はあると思うので、
説明書等で確認してください。
（イメージマップについては、ネットで検索すると詳しく分かります。）

↓参考にイマメージマップ（基本形）のサンプルを作ってみました。
http://www13.plala.or.jp/torayoshi/imagemap/map. …

スマホの場合は、画像を縮小表示するとき座標（リンク）もズレてしまうため、
正常に動作しなくなってしまいます。
↓スマホ対策の一例。
http://faq.shutto.com/?p=851

この回答へのお礼

ご丁寧にありがとうこざいました。
イメージマップですね！
早速、さがして試してみようと思います。
とても、勉強になります。
ありがとうこざいました☆

お礼日時：2014/11/04 23:48