地図や写真などで一部をクリッカブルにする際に、昔はイメージマップを使うのが一般的でした。今はJavaScriptやCanvas、SVGで処理するかも知れませんが、イメージマップもWeb標準として利用できる機能です。ただし昔の機能なので、座標の設定などで制約が多い機能でもあります。 そんなイメージマップをレスポンシブにしてくれるのがImage Map Resizeです。モダンなWebサイトでも安心して利用できるでしょう。

Image Map Resizeの使い方

幅が広い場合。

ちゃんとアメリカの各州へのWikipediaリンクが使えます。

幅を狭めた場合も同様です。

Image Map Resizeは元々のイメージマップにある情報をベースに、画像の幅に合わせて範囲を調整してくれます。mapタグの中身は複雑ですが、Image Map Resizeを使うことで一回作ったマップ情報をスマートフォンやタブレットでもそのまま利用できます。

Image Map ResizeはJavaScript製のオープンソース・ソフトウェア（MIT License）です。

HTML ImageMap resizing example davidjbradshaw/image-map-resizer: Responsive HTML Image Maps