图片 SEO：Alt 文本、格式与加载速度

Alt 文本要写给人看，不是写给爬虫看

Alt 文本是一个无障碍属性，搜索引擎只是顺带读取它。使用屏幕阅读器的人会听到它来代替图片，所以判断标准很简单：这句话有没有说清楚对方看不到的是什么。“棕褐色皮革切尔西靴，侧面视图，可见松紧带部分”这样写合格。“靴子 皮靴 买靴子 网购靴子 女靴”这样写不合格，在两类读者听来都像垃圾信息。

把它写成一句普通的话就行。说清楚图片里是什么，以及它为什么出现在这个页面上。如果图片纯粹是装饰性的，比如背景纹理或分隔线，给它一个空的 alt 属性，而不是写一段描述。空 alt 是一条真实的指令，告诉屏幕阅读器跳过它。完全不写这个属性是另一回事，而且更糟，因为有些阅读器这时会改为读出文件名。

文件名以及图片周围的文字

文件名是一个很弱的信号，但把它取对不花什么成本。上传前把 IMG_4471.jpg 改名为 chelsea-boot-tan-side.jpg，只需要四秒钟。不要堆砌关键词。一个塞了九个连字符关键词的文件名，看上去正是它本来的样子。

紧挨着图片的文字，比文件名起的作用更大。说明文字、图片旁边的段落、最近的标题：索引正是靠这些来判断图片内容是什么，以及这个页面是否是某个查询的合理答案。一张丢进一大段无关文字中的图片，几乎没有什么可以依靠的线索。

产品图片有自己的一套规则

对一家店铺来说，图片往往是决定成交与否的关键，而那些能帮到买家的做法，同样也能帮到商品页面。给每个款式配上各自的实拍图，而不是只在描述里改一下颜色文字：看到颜色不对的买家会直接离开，而这种流失是看得见的。让同一系列的取景和背景保持一致，这样一整排结果看起来像目录，而不是跳蚤市场。只要尺寸不够直观，就加上能体现比例的参照物。

在标记方面，带图片字段的产品结构化数据，正是让您的实拍图能出现在商品信息旁、呈现在更丰富的搜索结果中的前提条件。这只是一个前提条件，不是保证，而且只有当它指向的图片网址真的能被爬虫访问到时才有用。

让图片正常加载

• 给每个 img 标签都加上 width 和 height 属性。这样浏览器会在文件到达之前预留好合适的空间，页面也就不会在加载过程中不断跳动。
• 对折叠线以下的图片使用延迟加载，顶部的主图则永远不要用。对访客最先看到的内容做延迟加载，恰好会拖慢用来衡量您加载分数的那个元素，这是一个出人意料常见的自我失分。
• 加上 srcset，让手机下载适合手机尺寸的文件。给所有设备都提供同一张桌面端图片，会浪费那些最可能处于慢速网络下的访客的流量。
• 上传前先调整尺寸，而不是只靠 CSS 限制显示大小。一张被 CSS 设成 900 像素宽的图片，实际下载的仍是原图全部 4032 像素。压缩指南说明了真正能省下流量的地方在哪里。

悄悄拖您后腿的几件事

图库图片是最大的问题。如果同一张图库照片出现在另外四百个网站上，就没有理由让您的网站被当作展示结果，您的 alt 文本对此也无能为力。您自己拍摄的照片，哪怕不够完美，也是您网站上唯一真正属于您的图片。

接下来是技术性的阻碍。只有点击或滚动触发的脚本才能加载出来的图片，爬虫可能永远看不到。robots.txt 里禁止访问的图片目录，无论标记做得多好都无法被收录。托管在您没有验证过的子域名或 CDN 上的图片，可能会以一种与您的页面脱节的方式被索引。这些情况都不算罕见，在花一个月时间打磨 alt 文本之前，都值得先检查一遍。

优化时要留意的一件事

任何基于浏览器的转换器，包括本站在内，都会解码您的图片，再根据像素写出一个新文件。这个过程不会复制任何元数据，所以输出文件没有 EXIF 信息块：没有相机数据，没有拍摄日期，没有 GPS，也没有内嵌的版权或 IPTC 署名字段。发布前去掉位置信息，往往正是您想要的效果。但在您要授权使用的照片上丢失自己的署名字段，就不是您想要的了，所以处理副本，保留原图。

这些工作能带来什么

把图片做对，能让页面更快、更易访问，也更有可能在它本就有资格出现的查询结果中被展示出来。它不会让一个内容单薄的页面，为一个它本没有资格的词排上名，而且从图片搜索进来的流量，通常和从文字结果进来的流量表现不同，所以下结论之前请把两者分开衡量。这项工作值得去做，只是要带着符合实际的预期去做。

准备好动手时，这里的图片压缩器和图片尺寸调整工具能一次处理一整批文件，而且都完全在您的浏览器里运行，所以还没发布的产品实拍图，在优化过程中不会离开您的设备。