圖像映射的最佳實踐

Question

這是場景。 我被要求維護一個已經存在的站點。 他們正在尋求重新設計該網站。 他們為我提供了設計師的圖像。 我注意到，以前的設計師將圖像嵌入到html中，並使用圖像映射通過坐標將鏈接鏈接到相應區域。

我很想做同樣的事情。 他們已經為我提供了photoshop文件。

允許說出他們提供給我的圖像，使其成為背景圖像和圖像映射鏈接是否正確？

Answer 1

在閱讀了您上面的評論之后，我可以說這個想法是一種非常可怕的做法。

缺點很多，摘錄如下：

• 搜索引擎將無法抓取文本

• 殘障人士會遇到大問題
  

  • 屏幕閱讀器
  • 高對比度模式

  
  該系統無法利用具有純文本格式的文本的優勢，因此它可以應用高對比度主題或將文本輸入屏幕閱讀器。

• 無法縮放
  由於光柵圖像無法正確放大，因此用戶無法調整字體大小或網站的整體縮放級別。 （我假設您不使用矢量圖像。）

• 無法復制文字部分

• 根本不可能應用CSS，JS或任何其他效果，因為您無法引用圖片中的任何內容！ 您只有座標！ 沒有可以設置樣式的關聯DOM元素，也沒有可以使用其事件監聽器的DOM元素。

• 修改圖像還會觸發<map>中所有坐標的更改。