图像映射和HTML5

Question

这个问题比技术问题更具哲学性.

当Web开发人员被称为网站管理员并且我选择的工具是FrontPage,然后转移到Evrsoft 1st Page 2000时,我已经将自己培训成为Web开发人员.

这是我最后一次使用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属性在少数浏览器？图像映射真的是唯一的方法吗？什么是移动设备？

Answer 1

为什么使用图像地图导航不可原谅？它是一个像其他任何工具一样的工具; 它有时间和地点.使用带有javascript增强功能的图像地图是向后兼容的,优雅地降级,并且具有100%的浏览器支持.他们不需要像flash这样的插件.自从Web浏览器出现以来,它们几乎得到了支持.只是因为旧的东西并不意味着它没用; 恰恰相反,这意味着它得到了很好的支持.

我写了一个名为ImageMapster的jquery插件来为图像地图添加效果,这样你就可以在不使用flash的情况下创建交互式图像.通过在这些情况下替换列表,在没有Javascript支持的情况下实现具有相同功能的工具将很容易.就个人而言,我认为尝试在没有javascript的情况下为网络写作就像试图驾驶没有轮胎的汽车一样.如果没有它,99%的网络都无法运行.这不是1995年.但如果你真的担心,图像地图的好处是基本的导航功能仍然有效.只有CSS才能实现这一点 - 如果你有不规则形状的区域,甚至不能用CSS3.