Image 图像地图与HTML5

Image 图像地图与HTML5,image,html,polygon,imagemap,Image,Html,Polygon,Imagemap,这个问题更具哲理性,而非技术性 当网络开发者被称为网站管理员时,我已经把自己训练成了一名网络开发者,我选择的工具是FrontPage,现在是Evrsoft 1st Page 2000 那是我最后一次使用HTML图像映射 现在是HTML5、AJAX、矢量画布、CSS 3D、jQuery、本地存储、触摸屏Safari,随便你说。图像地图已经变得模糊不清,甚至谷歌都没有给出太多的相关结果;从2004年起,W3C学校的必修课程和一些论坛帖子 显然,使用图像地图创建网站导航或类似的琐事在当时是个坏主意,在

这个问题更具哲理性,而非技术性

当网络开发者被称为网站管理员时,我已经把自己训练成了一名网络开发者,我选择的工具是FrontPage,现在是Evrsoft 1st Page 2000

那是我最后一次使用HTML图像映射

现在是HTML5、AJAX、矢量画布、CSS 3D、jQuery、本地存储、触摸屏Safari,随便你说。图像地图已经变得模糊不清,甚至谷歌都没有给出太多的相关结果;从2004年起,W3C学校的必修课程和一些论坛帖子

显然,使用图像地图创建网站导航或类似的琐事在当时是个坏主意,在今天肯定是不可原谅的

但是现在我有一个任务,就是用背景图像在div顶部创建一个多边形可点击区域

在image map中这样做没有任何问题,因为它似乎是专为这样的用例设计的,虽然我没有做过任何测试,但我无法想象任何浏览器会放弃对一个多年来运行良好的元素的支持。但我忍不住想,今天一定有更好的办法

我的网页创作理念是为IE5.5开发,然后为Chrome edge设计。这意味着网站首先需要在最陈旧的浏览器上进行基本的工作,然后开始添加JS和CSS,使其更美观、更可用、更快、更简单、更友好、更好

因此,虽然我知道我可以在Raphaël中绘制画布,并添加各种时髦的悬停效果和其他东西,但我认为使功能如此简单不需要89KB(或xKB)的JS库。甚至是JS

我不知道CSS3是否具有定义多边形区域的功能,但尽管我认识到CSS3引入的巨大可能性,但我更喜欢将任何定义为非必要的、会优雅地退化的天赋


那么,在今天的webdev世界中,定义多边形单击区域(最好是通过jQuery
.hover()
,或者至少是CSS
:hover
)的方式,而不依赖于少数浏览器中可用的JavaScript或CSS属性)的最跨浏览器的方式是什么?图像映射真的是唯一的方法吗?移动设备呢?

为什么使用图像地图导航是不可原谅的?它是一种工具,就像其他工具一样;它有时间和地点。使用带有javascript增强功能的imagemaps是向后兼容的,性能下降很好,并且具有100%的浏览器支持。他们不需要像flash这样的插件,他们从网络浏览器诞生之日起就得到了支持。有些东西陈旧并不意味着它无用;恰恰相反,这意味着它得到了很好的支持


我编写了一个jquery插件,名为向imagemaps添加效果,这样您就可以创建交互式图像,而无需使用flash。在没有Javascript支持的情况下,通过在这些情况下替换为列表,可以很容易地实现具有相同功能的工具。就我个人而言,我认为尝试在没有javascript的情况下为web编写代码就像尝试在没有轮胎的情况下驾驶汽车一样。99%的网络没有它就无法工作。这不是1995年。但是如果你真的担心的话,imagemaps的优点是基本的导航功能仍然有效。仅仅使用CSS是无法做到这一点的——如果您有不规则形状的区域,甚至CSS3也无法做到

。。。从IE5.5开始是相当疯狂的。真的,你只是在伤害自己。我有一个相当高的访问量网站(每月大约有0.5百万访问者),在过去的3年里,我没有一次访问过低于IE6的网站。在过去的一年里,IE6已经占据了我用户群的2%左右。这并不是说我的目标用户使用IE5.5,也不是说我的网站在上面看起来很漂亮。我甚至没有IE5.5的副本来检查我的网站是什么样子的。然而,我在构建网站时使用了这种心态,这样我就可以保证我的网站在最原始的浏览器上运行,而不管年龄大小(Lynx、Kindle、WAP/Nokia Navigator时代的浏览器、屏幕阅读器等)。它有助于将内容和结构保持为一个整体,将时髦和才华保持为另一个整体。没有哲学的解释——但设计无javascript的最小公分母将您的体系结构限制为一个难以置信的原始模型。没有ajax。通过HTTP POST提交的所有数据?没有客户端逻辑验证/逻辑/交互性?哎哟除非你想让你所有的用户都有90年代的网络体验,否则你基本上是在讨论设计一个网站的两个完全不同的实现。您不能“逐步降级”ajax客户机/服务器模型;你将制作两个版本的网站。只是太多的额外工作没有回报。谁在使用lynx?正如我所说,IE5.5不是我的目标,我也没有测试它,但这是我构建网站主干的目的,直到我开始考虑对它进行预绑定并添加JS天赋。通过AJAX提交很漂亮,但JS真的能成为表单提交这样的核心功能的需求吗?和中一样,您的浏览器和设备必须与JS兼容并启用,否则我网站上的每个表单都无法正常工作?当然,JS验证并不意味着服务器端验证(另一种IE5.5风格的方法)可以忽略。我当然不是说启用JS的用户和禁用JS的用户应该有完全相同的用户体验。甚至接近它。我只是说,对我来说,不让你的表格以传统的方式提交似乎是一种非常愚蠢的态度。无论如何,在顶部添加AJAX提交以改善用户体验(我确实这么做)。但是,在我看来,没有明显的理由说明为什么我应该通过HTTP专门使表单不可提交,以支持AJAX
仍然是“旧”的,所以“旧”甚至不能在“过时”的上下文中使用。在您的网站上注意:添加微调器(或任何页面正在加载的指示)将提高