【发布时间】：2012-06-25 15:56:48
【问题描述】：
这个问题比技术更哲学。
当网络开发人员被称为网站管理员时，我已经将自己培训为一名网络开发人员，而我选择的工具是 FrontPage，然后转到 Evrsoft 1st Page 2000。
那是我最后一次使用 HTML 图像映射。
现在是 HTML5、AJAX、矢量画布、CSS 3D、jQuery、本地存储、触摸屏 Safari，应有尽有。图像地图已经变得晦涩难懂，甚至谷歌也没有提供太多相关结果；自 2004 年以来，W3C 学校的强制性条目和一些论坛帖子。
显然，使用图像地图创建网站导航或类似的琐事在当时是一个坏主意，而今天它肯定是不可原谅的。
但现在我的任务是在带有背景图像的 div 顶部创建一个多边形可点击区域。
我在图像映射中这样做没有问题，因为它似乎是为完全类似的用例而设计的，虽然我没有进行任何测试，但我无法想象任何浏览器会放弃对元素的支持多年来工作得很好。但我忍不住想，今天一定有更好的方法来做到这一点。
我的网页创作理念是为 IE5.5 开发，然后为 Chrome 边缘设计。这意味着该网站首先需要在即使是最过时的浏览器上也能在基本层面上运行，然后开始添加 JS 和 CSS 以使其更美观、更实用、更快、更简单、更友好和更好。
因此，虽然我知道我可以在 Raphaël 中制作画布并添加各种时髦的悬停效果和东西，但我认为制作如此简单的功能不需要 89 kb（或 X kb）的 JS 库。甚至是 JS。
我不知道 CSS3 是否具有定义多边形区域的能力，但在认识到 CSS3 引入的巨大可能性的同时，我更喜欢将在那里定义的任何东西保留为非必要的风格，可以优雅地退化。
所以在今天的 webdev 世界中，定义多边形点击区域的最跨浏览器方式是什么（最好是通过 jQuery .hover() 或至少是 CSS :hover 可抓取的方式），即'不依赖于少数浏览器中可用的 JavaScript 或 CSS 属性？图像映射真的是唯一的方法吗？移动设备呢？
【问题讨论】：
-
... 从 IE5.5 开始非常疯狂。真的，你只是在伤害自己。我有一个相当高的访问量网站（每月大约 50 万访问者），在过去 3 年中，我没有一次访问低于 IE6。在过去的一年里，IE6 约占我用户群的 2%。
-
我并不是针对使用 IE5.5 的用户，我也不想让我的网站在上面看起来很漂亮。我什至没有 IE5.5 的副本来检查我的网站在上面的样子。但是，我在构建时使用这种思维方式，这样我就可以保证我的网站即使在最原始的浏览器上也能正常运行，无论年龄大小（Lynx、Kindle、WAP/Nokia Navigator 时代的浏览器、屏幕阅读器等）。它有助于将内容和结构保持一致，将时髦和天赋保持一致。
-
哲学是没有解释的——但是为没有 javascript 的最小公分母进行设计会将您的架构限制在一个令人难以置信的原始模型中。没有阿贾克斯。所有通过 HTTP 帖子提交的数据？没有客户端逻辑验证/逻辑/交互性？哎哟。除非您希望所有用户都拥有 1990 年代的 Web 体验，否则您基本上是在谈论设计两个完全不同的网站实现。您不能“逐步降级”ajax 客户端/服务器模型；您将制作该网站的两个版本。这只是太多的额外工作而没有回报。谁用猞猁？
-
正如我所说，IE5.5 不是我的目标，我不会对其进行测试，但这是我构建网站主干的目的，直到我开始考虑对其进行美化并添加JS 对它的天赋。通过 AJAX 提交很漂亮，但是 JS 真的可以作为表单提交的核心功能的要求吗？例如，您的浏览器和设备必须兼容并启用 JS，否则我网站上的每个表单都无法正常工作？当然，JS 验证并不意味着可以忽略服务器端验证（另一种 IE5.5 风格的方法）。
-
我当然不是说启用 JS 的用户和禁用 JS 的用户应该有完全相同的用户体验。甚至接近它。我只是说，对我来说，不让您的表单以正常的老式方式提交似乎是一种非常愚蠢的态度。无论如何，在顶部添加 AJAX 提交以使用户体验更好（我愿意）。但在我看来，没有明显的理由为什么我应该专门通过 HTTP 将表单设置为不可提交以支持 AJAX。
标签： image html polygon imagemap