Rich Data

我们都听过这样一句话：“一张图片胜过千言万语”。图片标签对搜索引擎优化来说也意味着同样的事情。现代 HTML 有多种方式可以以优化的方式将图片嵌入到您的网页中。然而，许多网站管理员并没有利用这些机会。结果，他们失去了搜索排名、可见度，最终失去了转化率。

让我们来看看图片标签对于您的网站优化到底有多重要。

响应式网站和图片标签
拥有一个响应式网站变得比以往任何时候都重要。你永远不知道你的用户会如何查看你的网页屏幕，外汇数据 而且越来越多的用户通过移动设备浏览网站。这些设备并不总是连接到高速 Wi-Fi，而且屏幕空间也较小。你使用的图像必须引人注目且经过优化。

img 标签已经不够用了。这个标签是 picture 标签的哥哥，它根植于 HTML 的核心。然而，移动时代给我们带来了必须考虑的优化方法。响应式图片必须能够切换分辨率并在切换过程中快速加载。老式的 img 标签只给浏览器一个图像可供使用。

艺术指导
img 标签不允许在较小的屏幕上显示较大图片中可能看到的细节。如果使用该标签，网站管理员必须在裁剪图片和使用 CSS 方面发挥无限的创造力，以保持网站视觉效果的美观。图片标签会自动处理这个问题，允许网站管理员在不同尺寸点使用同一张图片。图片标签甚至比使用 img 标签的 sizes 或 srcset 属性更容易。

执行
如果您的图片有一个单一的焦点，随着图片变小，焦点会变得越来越难看清，那么您的图片标签对于您的艺术指导至关重要。图片标签可让您突出显示照片中最重要的方面。此外，您仍然可以使用 img 标签作为备份，以便您的网站与尚不支持图片标签的浏览器保持兼容。

何时不使用图片标签
虽然图片标签是 img 标签的更新版本，但这并不意味着您总是需要使用它。img srcset 和 size 标签实际上可能更适合您的网站，因为并非所有浏览器都已跟上图片标签。使用过多的图片标签实际上可能会限制浏览器使用的选项。

此外，您的源元素 srcset 标签可能只需要一个 URL。由于图片标签的多功能性，您可能会倾向于为网站上的每个源标签使用数十个 URL。在某些情况下，这不仅不会起到很大作用，而且实际上可能会降低包含大量图片和其他数据的网站的性能。