この質問は、技術的というよりも哲学的なものです。
Web 開発者が Web マスターと呼ばれていた頃、私は自分自身を Web 開発者として訓練し、私が選んだツールは FrontPage で、Evrsoft 1st Page 2000 に移行しました。
HTML イメージ マップを使用したのはこれが最後でした。
現在は、HTML5、AJAX、ベクター キャンバス、CSS 3D、jQuery、ローカル ストレージ、タッチスクリーン Safari などがあります。イメージ マップはあいまいになり、Google でさえ関連する結果があまり出てきません。必須の W3C Schools エントリと 2004 年からのいくつかのフォーラム投稿。
明らかに、イメージ マップを使用して Web サイトのナビゲーションや同様の些細なことを作成することは、当時は悪い考えであり、今日では間違いなく許されません。
しかし、現在、背景画像のある div の上にポリゴンのクリック可能な領域を作成するタスクがあります。
これとまったく同じユースケース向けに設計されているように見えるため、イメージマップでこれを行うことに問題はありません。また、テストを行っていませんが、美しく機能する要素のサポートを中止するブラウザーは想像できませんでした。長年。しかし、今日これを行うためのより良い方法があるに違いないと思わずにはいられません。
私の Web 作成の哲学は、IE5.5 向けに開発してから、Chrome エッジ向けに設計することです。つまり、サイトはまず最も時代遅れのブラウザーでも基本的なレベルで動作する必要があり、次に JS と CSS の追加を開始して、サイトをより美しく、より使いやすく、より速く、よりシンプルに、より親しみやすく、より優れたものにする必要があります。
そのため、Raphaël でキャンバスを作成して、あらゆる種類のおしゃれなホバー効果などを追加できることはわかっていますが、これほど単純な機能を作成するのに 89 kb (または X kb) の JS ライブラリは必要ないと思います。またはJSでさえ。
CSS3 に多角形領域を定義する機能があるかどうかはわかりませんが、CSS3 によって導入された大きな可能性を認識しながら、優雅に劣化する本質的ではない才能として定義されたものを維持することを好みます。
したがって、今日の webdev の世界では、使用可能な JavaScript または CSS 属性に依存しない、多角形のクリック領域 (できれば jQuery.hover()または少なくとも CSS で取得できる方法) を定義する最もクロスブラウザーな方法は何でしょうか?:hover少数のブラウザで？イメージマップは本当にそれを行う唯一の方法ですか? モバイルデバイスは？