对许多站点而言,Google 图片搜索贡献了 20–30% 的总自然流量 —— 在电商、菜谱、HOWTO 内容上 甚至更高。多数团队会无止境地优化文字,却把图片当装饰对待。结果就是把唾手可得的排名红利留在 桌面上。下面是我们对每一个被审计站点都会跑一遍的完整清单。
1. 用描述性、含关键词的文件名
Google 把文件名当成相关性信号读。IMG_4521.jpg 对爬虫一无所言。red-leather-running-shoe-side-view.jpg 把主题完整说出来。上传前先改名。用 破折号而非下划线 —— Google 明确说过破折号会被当成单词分隔符,下划线不会。
2. 写有意义的 alt 文本 —— 但不要堆关键词
alt 文本服务两类受众:屏幕阅读器和搜索引擎。同一条规则两边都通:准确描述图片。alt="红色皮质跑鞋,白底,侧面视角" 是好的。alt="跑鞋 红色皮 跑鞋 买跑鞋 在线买跑鞋" 是堆关键词,Google 能识别出来。
装饰性图片(图标、分割线)应使用 alt="" —— 留空,但不能省略。空 alt 告诉 屏幕阅读器跳过这张图。
3. 让显示尺寸与文件尺寸匹配
把 4032×3024 的照片塞进 600×450 的位置,95% 的字节都浪费了。浏览器仍会下载完整图,渲染时 缩小,视觉效果一样。上传前先 resize,或用 srcset 提供多份变体。
Lighthouse 的 "Properly size images" 审计会抓到这条。Google 的移动友好排名信号也会看。
4. 用现代格式 + 兜底
WebP 比 JPEG/PNG 节省 25–35% 字节。AVIF 在此基础上再节省 20%。两者在 2026 年覆盖率都达 95%+。用 <picture> 提供现代格式 + 安全兜底:
<picture>
<source type="image/avif" srcset="hero.avif">
<source type="image/webp" srcset="hero.webp">
<img src="hero.jpg" alt="...">
</picture>
5. 首屏以下用懒加载
在 <img> 上加 loading="lazy",浏览器会等图片接近视口时再 下载。每张图加一行,把带宽腾给 LCP 元素。首屏内的图片不要加 lazy —— 会拖慢 LCP。
6. 显式设置 width 和 height
如果 <img> 没有尺寸,浏览器在图片加载完成之前不会预留空间。每张图到达 时正文都会跳一下 —— 对 Cumulative Layout Shift(Core Web Vitals 的 C)很糟。始终设置 width/height(或在 CSS 里设 aspect-ratio)。
7. 大胆压缩
照片:JPEG 质量 80、WebP 质量 80、AVIF 质量 60。与原图肉眼无差,相对相机原图能砍掉 50–70% 字节。UI 截图与图形:WebP 无损。我们的 图片压缩工具这类批量工具会在浏览器内一次处理一批,且不上传。
8. 用结构化数据 ImageObject 模式
在产品页、文章和菜谱里加上带 ImageObject 的 <script type="application/ld+json">,能帮助 Google 在富媒体结果中展示 你的图片。必填字段:
contentUrl—— 图片 URLcreator—— 作者license—— 许可 URL(对图片素材站尤其有价值)caption—— 简短说明
9. 让图片可被爬取
图片对 Google 隐身的两条路径:
- 仅用 JS 加载。如果图片是页面加载后由 JS 注入,并且没有
<noscript>兜底,Googlebot 可能会漏掉。请把<img>做服务端渲染或预渲染。 - 对内容用 CSS 背景图。Google 把它们当装饰处理。对有意义的图片用
<img>,不要用background-image。
10. 提交图片 sitemap
把图片条目加进 XML sitemap。格式:
<url>
<loc>https://example.com/page</loc>
<image:image>
<image:loc>https://example.com/image.jpg</image:loc>
</image:image>
</url>
对图片动态加载的站点(图片画廊、产品目录)尤其有价值。
11. 按图片搜索意图优化,而非页面意图
一个 "跑鞋" 页面在网页搜索可能排第 4,但如果配图更清晰,在图片搜索就可能排第 1。图片搜索 用户的意图不一样 —— 他们常在购物或调研。图片必须能独立成立:
- 在干净的背景上清晰展示产品
- 不要在图上压字(Google 读的是图片本身,不是叠加文字)
- 仅在能增加清晰度时才加上下文(穿在脚上的鞋,而不是只放在白底上)
12. 别丢掉你真的需要的 EXIF 元数据
有些压缩器会在优化时剥光所有 EXIF。对摄影作品集来说,这会丢掉相机/镜头元数据,让页面在 相机相关查询("Sony A7R5 样张")上失分。请把压缩器设置成保留 EXIF,或用允许选择的工具。
非摄影站点剥掉 EXIF 没问题 —— 文件更小,且会去掉你大概率不愿意公开的位置信息。
60 秒审计
打开你站点上的任意一页。在 DevTools Network 面板里筛选到 "Img"。对每一张图片:
- 文件名能描述主题?✓
- 非主视觉图片小于 200 KB?✓
- 格式是 WebP 或 AVIF?✓
- 尺寸与显示大小匹配(2 倍以内)?✓
- 有描述性的 alt 文本?✓
- 有显式的 width/height 属性?✓
- 首屏以下加了 loading="lazy"?✓
我们审计的多数站点,在第一页就会有四五项不通过。修起来变更很小,回报却会复利累积 —— 每一张图片的修复会惠及所有加载到它的页面浏览,而图片搜索会用流量奖励这次清理。