Gmail 图片地图 - 只有最后一个区域有效答案

【问题标题】：Gmail image map - only the last area worksGmail 图片地图 - 只有最后一个区域有效
【发布时间】：2011-11-23 13:49:17
【问题描述】：

我正在使用带有图像映射的大图像创建 HTML 电子邮件，其中指定了两个矩形区域：

<img src="newsletter_files/background.jpg" width="600" height="584" border="0" alt="39steps crimbo cards" usemap="#email">

<map name="email">
<area shape="rect" name="emailaddress" coords="212,305,350,290" href="mailto:email@domain.com" alt="Email email@domain.com" />
<area shape="rect" name="website" coords="585,485,465,550" href="http://www.domain.co.uk" target="_blank" alt="Domain link" />
</map>

问题是，只有第二个有效。第一个被忽略。我在 Google 上搜索了解决方案，但没有找到任何解决方案。

我可以将图像剪掉，但这会在测试等方面产生其自身的问题 - 电子邮件非常简单，因此对于我的目的而言，图像映射是最好的方法。

有人遇到过类似的问题吗？

【问题讨论】：

标签： html gmail imagemap

【解决方案1】：

我不关心电子邮件中的图像映射（主要是因为我从未使用过它们）

我的建议是在 Photoshop 中打开图像并使用切片工具。保存时可以保存图像和html。输出的 html 非常适合电子邮件。

关于 html 电子邮件的其他几件事：

总是使用表格
切勿使用p 标签
始终将display:block 放在您的图片上（这样可以防止某些电子邮件客户端上的图片之间出现不必要的间隙

【讨论】：

谢谢。 Photoshop 简化了所有流程。

【解决方案2】：

这与您的图像映射无关。第一个链接被忽略，因为它是一个 mailto: 调用。如果链接包含 mailto，Gmail 会从链接中删除 href：

【讨论】：

【解决方案3】：

我刚刚从 Constant Contact 中读到了一些有趣的东西。它是这样说的：

在自定义 HTML 电子邮件中，如果存在图像映射标签，并且超链接指向 mailto: 链接，如果标签已关闭，如下例所示...

    <area shape="rect" coords="88,23,166,38" href="mailto:info@constantcontact.com"/>

...超链接将处于非活动状态。只需删除关闭的正斜杠即可使链接再次处于活动状态。

• 在指向 URL 的普通超链接中保留右斜杠将在自定义 HTML 电子邮件中起作用。

• 在 mailto: 自定义 XHTML 电子邮件中的链接后留下一个结束正斜杠将起作用。但是——

• 在 mailto 后留下一个正斜杠：自定义 HTML 电子邮件中的链接将不起作用。

【讨论】：

有趣但不工作。似乎查看源代码表明gmail确实像@Eric提到的那样剥离了href（斜线与否）。