園内マップみたいな画像に複数のリンクを付けてイメージマップを作成できるWebアプリ 『HTML Imagemap Generator』

Web上の画像に複数のリンクを付けて

イメージマップを作製できるWebアプリ。

遊園地の園内マップみたいに

あちこちをクリックできるページを作成。

imagemap6

HTML Imagemap Generator リンク先

imagemap1

まずは使用する背景となる画像を

ドラッグします。

画面サイズ、解像度は原寸で表示されるので

あらかじめ圧縮しておくと便利です。

imagemap2

画像が読み込まれました。

画面右側にはHTMLコードが出力されます。

右上から円や四角で範囲を作成します。

imagemap3

ちょっと分かりづらいんですが、夕日を

丸の範囲で指定してみました。

imagemap4

イメージマップというタグにエリアタグが

追加されて画像上にリンクが作成されました。

リンクアドレスは#になっているので

これを実際のリンクを挿入して

Webページに貼り付けると画像上に

リンクをペタペタを貼り付ける事ができます。

imagemap5

たくさん設置してみました。

遊園地の園内マップみたいにエリアを

選択すると紹介ページみたいなページを

簡単に作成できます。

Web制作者向けなWebアプリですが

覚えておくと便利です。

  • コメント: 0

おうちで夏フェスを楽しめる!! GYAO!が無料配信 『#おうちでフェス2021』前のページ

お手軽にポストカード、シンプルな背景を作成できるWebアプリ 『Figen』次のページ

関連記事

  1. Web制作ツール

    美しくすりガラスの様な背景をCSSで実装、ジェネレートできるWebサービス 『Glass UI Ge…

    美しいデザイン、すりガラスの様な背景をCSSで実装できるWebサー…

  2. Web制作ツール

    Webで使えるメニューが100個も紹介されているWebサービス 『100 Great CSS Men…

    Web上で設置できるメニューを100個も紹介しているWebサー…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

PAGE TOP