假设你要规划一张厨房电器页面，放上一张控制面板照片。买家可以用它看清楚设置按钮在哪里。一般厨房情境照也许好看，却回答不了这个问题。
图片 SEO 是选择能帮助网页的图片，为看不到图片的人说明其含义，并让搜索引擎能够找到和理解图片。先想读者要解决什么问题，而不是先想文件名或关键词。
图片 SEO 有什么作用？
图片可以展示商品特点、解释步骤，或让比较更容易。Google 会结合图片、替代文字和网页周围的内容理解主题。好图片不能取代有用的正文；它应该配合页面标题和说明。
在电器页面，控制面板照片展示布局，旁边的文字解释各项设置。尺寸图则需要标清测量数据。重要信息不能只留在图片里，正文也要让无法使用图片的人读懂。
应该在网页放什么图片？
先问访客做决定前需要看到什么。对这张电器页面来说，可能是控制按钮、尺寸，或安装时需要预留的空间。装饰图片可以帮助设计，但不应被当作功能或效果的证据。
把有说明作用的图片放在相关段落附近。如果读者需要知道该看哪里，就加一句简短图注。不同文章反复使用同一张通用图片，会掩盖每张网页真正要说明的内容。
怎样写有用的替代文字？
替代文字（alt text）让看不到图片的人获得文字替代内容。根据图片在这张网页上的作用来写，不要为了放关键词而写。若细节确实可见且与正文有关，商品照片可以写成「黑色四区电磁炉，正面设有触控按钮」。
- 提供信息的图片：简短说明图片增加了什么信息。
- 只有图片的链接：说明链接的目的地或动作，例如「查看安装尺寸」。
- 纯装饰图片：使用空的
alt=""，让屏幕阅读器略过。 - 复杂图表：给一个简短标签，并在附近的正文解释重要数据。
图片应有 alt 属性；alt="" 是有意标记装饰图片，省略属性则可能让用途不清楚。不要重复堆砌搜索词，也不要在可以具体说明时只写文件名。如果附近文字已完整说明，而图片没有增加信息，空的 alt 也可能合适。
搜索引擎怎样找到并理解图片？
重要内容图片应使用带有有效 src 的 HTML <img>。Google 可以从这个属性发现图片，包括 <picture> 里的 <img>；Google 说明它不会索引 CSS 背景图片。背景图适合装饰，不适合承载页面必需的图解或商品细节。
正文和图注为图片提供语境。简短、能描述内容的文件名只是小线索，不能代替相关图片。如果内容图片要点击后才出现，或文件网址被阻挡，就检查实际呈现的网页，以及文件是否能正常取得。
应该使用什么格式和尺寸？
按图片用途选择格式，并检查实际输出。JPEG、WebP、AVIF 都可用于照片。PNG 是部分图形的简单无损选择，WebP 也可以无损或带透明效果。比较文件大小与可见细节，不要预设某种格式永远最好。
输出足够适合显示尺寸的像素，但别让每部手机都下载原始大图。响应式图片可通过 srcset 提供不同尺寸，并保留有效的 src。设置宽高或长宽比，让网页在图片载入前预留空间。载入优先级和版面位移可继续看Core Web Vitals 指南。
怎样检查一张网页？
- 逐张图片说出它帮助回答的读者问题。若没有，就把它当装饰，或移除。
- 按图片用途检查 alt：信息、链接动作、装饰，还是复杂数据。
- 确认文件能从
<img src>载入，而且图片靠近相关文字。 - 比较电脑与手机版：重要细节看得清吗？文件是否大得没有必要？
先修正妨碍读者理解的图片，再考虑批量更改整个图片库的文件名。
常见问题
替代文字对图片 SEO 有帮助吗？
有。Google 会结合替代文字、图片和网页语境理解主题；看不到图片的人也能取得文字替代内容。但它不能让不相关的图片或没用的网页突然变好。
怎样写好的替代文字？
简短、自然地说明图片在当前网页提供的信息或链接动作。纯装饰或与周围文字完全重复的图片，可使用 alt=""。
PNG 和 WebP 哪个更好？
没有永远较好的格式。比较这张图片的文件大小和可见质量。WebP 通常压缩效果不错，也可以无损或透明；PNG 是图形的另一种无损选择。
图片 SEO 有最佳尺寸吗？
没有通用的像素或 KB 数字。让图片符合显示尺寸，并确保重要细节清楚，尤其是在手机上。