图像映射的最佳实践

Question

这里是场景。我被要求维护一个已经存在的网站。他们正在寻求重新设计网站。他们向我提供了他们设计师的图片。我注意到之前的设计师将图像嵌入到 html 中，并使用图像映射通过坐标链接到相应区域的链接。

我很想做同样的事情。他们为我提供了 Photoshop 文件。

让我们说把他们提供给我的图片作为背景图片和图片映射链接是正确的做法吗？

Answer 1

在阅读了上面的your comment 之后，我可以说这个想法是一个非常可怕的做法。

缺点很多，摘录如下：

• 搜索引擎将无法抓取文本

• 有残障的人会有大问题
  

  • 屏幕阅读器
  • 高对比度模式

  
  系统无法利用真实文本形式的文本，因此它可以应用高对比度主题或将文本输入屏幕阅读器。

• 无法缩放
  由于光栅图像无法正确放大，用户无法调整字体大小或网站的整体缩放级别。 （我假设您不使用矢量图像。）

• 无法复制文本部分

• 根本不可能应用 CSS、JS 或任何其他效果，因为您无法引用图片中的任何内容！你只有坐标！没有可以设置样式的关联 DOM 元素，也没有可以使用的事件监听器。

• 修改图片也会触发<map>中所有坐标的变化。