图片 SEO，是为了让网站中的图片既能被搜索引擎正确理解，又能快速加载而进行的全部优化工作。从文件名到 alt 文本，从 WebP 和 AVIF 等现代格式到懒加载，每一个细节都会影响来自谷歌图片的流量以及页面的整体速度。本指南将按顺序介绍图片 SEO，并在每一步说明应当做什么，并附上示例。
为什么图片 SEO 很重要？
图片有两方面的影响。第一是可见性：谷歌图片以及普通搜索中的图片框，是一个能带来访客的独立渠道；尤其在产品、食谱、场所和装饰等话题上，用户往往先看图片。第二是速度：在大多数页面中，图片占据了总数据量的最大部分，而页面上最大的元素往往也是图片。也就是说，一张未经优化的主图就可能拖慢 Core Web Vitals 中的 LCP 指标，从而降低整个页面的表现。
第三个影响是无障碍性：alt 文本可以向使用屏幕阅读器的访客描述图片。好的 alt 文本既服务用户，也服务搜索引擎。
文件名
谷歌也会利用文件名来理解图片的内容。像数码相机生成的 IMG_20260412_0043.jpg 这样的文件名不包含任何信息。规则很简单：
- 使用简短且有意义的词语来描述图片：
deri-kanepe-gri-uc-kisilik.webp。 - 用连字符（-）分隔词语；下划线（_）可能会被视为连在一起的词。
- 倾向使用小写字母和 ASCII 字符；避免使用非 ASCII 字符和空格。
- 不要堆砌关键词：
kanepe-kanepe-ucuz-kanepe.webp没有任何帮助。
| 不好 | 好 |
|---|---|
IMG_0043.jpg | gri-deri-kanepe.webp |
Yeni Resim (2).png | istanbul-kadikoy-ofis-girisi.webp |
kanepe_ucuz_kanepe_satilik.jpg | kose-koltuk-takimi.webp |
如何撰写 alt 文本？
alt 文本（alt 属性）用文字描述图片的内容。当图片无法加载时它会显示在原位置，屏幕阅读器会朗读它，谷歌也会用它来理解图片的语境。
- 如实描述图片。“在厨房台面上制作咖啡的咖啡师”是一个好的 alt 文本；无需以“图片”“照片”之类的词开头。
- 保持简短。一般不超过 125 个字符即可。
- 自然地包含关键词。如果图片确实与该主题相关，关键词会自然出现；硬塞进去的关键词列表可能被视为垃圾内容。
- 装饰性图片的 alt 留空（
alt=""），这样屏幕阅读器就不会无谓地朗读它。不要完全删除 alt 属性。 - 把图片中的文字写出来。如果图片中包含标语或价格，请将其写入 alt 文本或页面正文中。
示例：在产品页面上，与其写 alt="沙发 沙发 套装 便宜"，不如写 alt="灰色布艺三人沙发，木质脚架"。后者既对用户更有帮助，也为搜索引擎提供了更清晰的信息。
除了 alt 文本，图片周围的文字、标题以及图片说明（caption）也能帮助谷歌理解语境。把图片放在相关段落的旁边，远比放在页面最底部一个不相关的位置要好得多。
格式选择：JPEG、PNG、WebP、AVIF
| 格式 | 优势 | 何时使用？ |
|---|---|---|
| JPEG | 普及广泛，对照片压缩效果好 | 旧系统的备用格式 |
| PNG | 无损，支持透明 | Logo、截图、简单图形 |
| WebP | 比 JPEG/PNG 文件明显更小，支持透明 | 适用于大多数图片的安全默认选择 |
| AVIF | 通常比 WebP 文件更小 | 以照片为主的页面；浏览器支持广泛，但仍应添加备用格式 |
| SVG | 矢量格式，可无限缩放，体积极小 | Logo、图标、简单绘图 |
要提供多种格式，可以使用 <picture> 元素：浏览器会选择它支持的第一种格式；如果都不支持，则回退到其中的 <img> 标签。这样，支持 AVIF 的浏览器获得 AVIF，不支持的则获得 WebP 或 JPEG。
尺寸与压缩
最常见的错误是：在一个 400 像素宽的方框中展示一张 4000 像素宽的照片。浏览器仍然会下载整个文件。请执行以下操作：
- 按实际显示尺寸调整大小。对于博客内容，通常 800–1200 像素宽就足够了；对于高分辨率屏幕，可通过
srcset另外提供两倍尺寸的版本。 - 压缩。对于照片，质量设置在 75–85 之间，通常能在肉眼几乎察觉不到差异的前提下显著减小文件大小。
- 清除元数据。EXIF 数据（位置、设备信息）既增加负担，也存在隐私风险。
- 设定目标。一般来说，内容图片应尽量控制在几百 KB 以内；即使是大型主图，也应设定上限。
务必在 HTML 中指定 width 和 height。浏览器在图片下载前就知道要为它预留多少空间，页面加载时内容就不会向下跳动。
响应式图片：srcset 与 sizes
把同一张图片发送到 360 像素宽的手机和 1920 像素宽的显示器上，是一种浪费。srcset 可以定义不同宽度的多个版本，sizes 则告诉浏览器图片占据屏幕的多大比例；浏览器会自行选择最合适的文件。例如，生成 480、800 和 1200 像素宽的三个版本，对于大多数博客和产品页面已经足够。在移动设备上，节省的流量非常明显，并且会直接体现在 LCP 时间上。
图片应放在哪里？
谷歌还会从图片周围的文字中判断图片的主题。因此，请把图片放在讨论其主题的段落旁边，并在下方添加一段简短的图片说明（caption）。图片所在章节的标题也会增强图片与主题的关联。与其直接使用有版权的库存图片，不如尽量使用你自己拍摄的原创照片；原创图片既能让用户产生信任，也能使你的网站区别于重复使用的库存图片。
懒加载与 CLS
懒加载是指在用户滚动到屏幕下方之前，不加载位于屏幕以下的图片。现代浏览器只需一个属性即可实现：
<img src="kanepe.webp" alt="灰色布艺三人沙发" width="800" height="600" loading="lazy">
- 首屏图片（above the fold）不要使用懒加载。如果页面上最大的图片加载得太晚，LCP 会变差。对于这张图片，可以使用
fetchpriority="high"。 - 图库、产品列表和长文章底部的图片，最适合使用懒加载。
- 始终与
width/height一起使用；否则加载后的图片会导致布局偏移。 - 为了让谷歌能找到图片，请使用真正的
<img src>；仅通过 CSS 背景显示的图片，可能不会被图片搜索收录。
有关速度指标的更多信息，请参阅我们的Core Web Vitals 指南。
图片网站地图与结构化数据
谷歌大多数情况下会在常规抓取中找到图片。不过，对于由 JavaScript 加载的图库或结构复杂的页面，将图片添加到网站地图中会有所帮助。在标准网站地图中，每个 <url> 下使用 <image:image> 和 <image:loc> 元素：
- 在网站地图的开头加入图片命名空间。
- 为每个页面列出该页面中出现的图片地址。
- 通过 Search Console 提交网站地图，并检查错误。
- 确保 robots.txt 没有阻止图片。
对于产品、食谱或文章等内容，在结构化数据（schema）中加入图片地址，有助于谷歌在富媒体结果中使用该图片。关于 Search Console 的使用，请参阅我们的入门指南。
常见的图片错误
- 把文字嵌入图片：仅把重要信息（价格、地址、活动）写在图片中，搜索引擎和屏幕阅读器就无法读取。
- 所有地方使用相同的 alt 文本：与其给产品图库中的五张图片写同一段 alt，不如分别描述每一张（正面、侧面、细节）。
- 过大的“主视觉”图片：全屏幻灯片图片有时占用几 MB，而不是几百 KB；先缩小尺寸，再审视设计。
- 用 robots.txt 屏蔽图片：屏蔽图片文件夹的规则，会导致你的图片完全无法出现在谷歌图片中。
- 失效的图片链接：被移动或删除的图片会返回 404；请通过定期抓取来修复。
检查清单与衡量
- 文件名是否有意义、使用 ASCII 字符并以连字符分隔？
- alt 文本是否简洁、自然地描述了图片？
- 图片是否使用 WebP/AVIF 或其他合适的格式？
- 是否没有加载超出显示尺寸的大文件？
- 首屏以外的图片是否设置了
loading="lazy"？ - 是否定义了
width和height？ - 图片网站地图和 robots.txt 是否正确？
在衡量方面，PageSpeed Insights 会直接显示“高效编码图片”和“正确调整图片大小”的建议。在 Search Console 的效果报告中，将搜索类型选择为“图片”，即可单独跟踪来自图片搜索的展示和点击。图片优化提升速度的同时，也有助于降低跳出率。
结论
图片 SEO 不是一次性的动作，而是每张图片上不断重复的一组小习惯：有意义的文件名、如实的 alt 文本、正确的格式和尺寸、针对屏幕以下内容的懒加载，以及必要时的图片网站地图。最大的收获通常来自最大的图片；先用 PageSpeed Insights 找出加载最慢的几张图片，然后从它们开始。结果将是来自谷歌图片的额外流量，以及加载更快的网站。排名仍然由谷歌的算法决定；你的工作是让图片易于理解、保持轻量。