针对Google的图片SEO

图片的SEO值不值得重视

提到SEO，我们可能会把大部分精力放在文字内容上，从而忽略了图片的SEO。谷歌其实也很重视图片的SEO的，网站的图片也会被编入索引，通过谷歌图片、谷歌discovery等等形式展现。

如果你使用过 Rank Math 这样的SEO插件，你会发现在它生成的站点地图中，可以将图片内容纳入到站点地图中，这样当你给搜索引擎提交站点地图时也会将相关的图片一同提交。

这些都说明了针对图片的SEO还是整个SEO中重要的一部分。

图片SEO有哪些内容

使用标准的 HTML 标签

• 图片要使用 <img/> 标签，例如，<img src="black.jpg" alt="黑色图片" /> ，而不是使用<div> 标签，比如这样， <div style="background-image:url(white.jpg)">白色</div> 。使用CSS 背景的方式插入图片，是不利于图片的 SEO 的。

图片的主题信息

图片的主题信息包括图片的文件名称，图片标题和替代文本。谷歌会从图片所在的网页内容中提取图片的主题信息，所以图片放置的位置也最好在相关文字的附近。我们做好图片的主题信息，也是为了让谷歌更好的理解图片的内容。

• 文件名称
  原来我的图片都是使用图片的MD5值作为文件名称，这样上传后的地址链接就会像这样。
  <img src="https://../../11db94c49c8da5dc0290569597c95637.webp" alt="WordPress 使用 All in one Migration 迁移站点后出现中文乱码">
  优化后，我网站的图片使用文章的主关键词作为文件名称，这样上传后的地址链接就会像这样。
  <img src="https://../../meta-description-formula-960x733.webp" alt="On-page SEO 很简单，做好这些就可以了">
  就这样一个简短的关键词描述，就可以让谷歌理解这张图片的具体信息。
• 图片标题
  谷歌索引图片会根据周围的文字来判断图片的主题信息，所以在图片的下方标注出图片的标题或者做一些图片描述，这样就更加有利于谷歌理解图片的含义。

• 替代文本
  <img> 标签中的 alt 属性，简单理解这个属性是给爬虫和机器看的，我们在网页中是通过图片的标题和描述来了解图片的含义，而爬虫或者无障碍的读屏程序是根据 alt 信息来了解图片的含义。

Google 会从 alt 属性（替代文本）和类似人类的计算机视觉算法以及图片周围的文字这几个方面来理解图片的主题含义。

针对图片的SEO，可以参考下面的标签形式：
<img src="https://im3.growingoak.top/../meta-description-formula-960x733.webp" alt="meta-description-formula" width="680" height="519">

1. 图片的链接中包含图片的相关关键词。
2. alt 属性中包含图片的相关关键词。
3. 使用宽高属性来定位图片的布局，减少网页加载中的 CLS。
4. 在图片的下方标注出图片的相关简介。

优化图片质量和自适应图片

• 清晰的图片一定会更加受到读者的喜欢，没人会喜欢模糊不清的图片，但是过大体积的图片势必会造成网页加载速度的变慢，所以图片在使用前，要适度压缩，或者转换成webp格式，webp格式可以在保持图片细节的情况下有着更小的体积。
• 借助<img>标签中的 srcset 属性可以实现同一图片在不同屏幕尺寸设备下显示相应版本的图片，这样会给读者更好的阅读体验。