做站点运营时,URL、死链、重定向这些检查大多有人定期跑,但图片和视频这类媒体资源,往往被归到“前端优化”里,很少从蜘蛛的角度看一眼。实际上图片是页面上数量最多的元素之一,也是页面体积的主要来源。蜘蛛抓到一个页面后,除了 HTML,它还会顺着图片地址去看一遍。如果这些地址访问不了、名字全是数字、周围没有任何说明,那页面在它眼里就少了一大块信息。
先确认图片地址能不能被正常访问
这一步最容易被忽略,因为浏览器里图片显示正常,不代表蜘蛛能拿到。常见的几种情况:
- robots.txt 里为了“保护”图片,顺手把图片目录 Disallow 了,连带页面上的图片全抓不到;
- 图片放在对象存储或 CDN 上,开了防盗链,只允许自家域名 Referer,蜘蛛请求时没有 Referer,直接返回 403;
- 用了带签名的临时地址,URL 里带一长串过期时间参数。这种地址每天甚至每次刷新都不一样,等于给同一张图造了无数个新地址;
- 图片被删了但页面还引用着,返回 404 或 403,长期堆在日志里。
抽一批页面,把里面的图片地址复制出来直接访问一遍,看看状态码,是最直接的办法。
懒加载别把图片藏到蜘蛛看不到的地方
为了首屏速度,很多站点会给图片加懒加载。做法本身没问题,问题出在实现方式:有的把真实地址写在 data-src、data-original 上,等 JS 执行时再替换给 src,HTML 里 src 留一个空白占位图。蜘蛛拿到的初始 HTML 里,那张图就等于不存在。
可以这样处理:
- 首屏和靠前的图片直接用正常 src,不做延迟;
- 靠后的图片用浏览器原生 loading="lazy",它不改变 HTML 里的 src,只是延迟加载;
- 如果用 JS 方案,至少在 noscript 里保留一份带 src 的图片;
- 用 CSS 背景图展示重要内容的,考虑改成 img,或者补上可抓取的说明文字。
文件名、alt 和图片周围的文字
蜘蛛看不懂图片内容,只能靠文件名、alt 和上下文判断。文件名建议用能说明内容的英文或拼音,避免 20240618-001.jpg 这种纯编号,也避免直接堆一长串关键词。alt 写成人能读懂的短句,描述这张图在讲什么,不必把栏目词、地区词全塞进去。
图片下方的图注、同一段落里的正文、所在栏目的标题,都是它理解图片的线索。如果一张图是产品对比表、尺寸图这类信息量大的内容,旁边最好有一段文字说明,而不是只有一张图。
图片不是装饰,它也是页面内容的一部分。蜘蛛看不到的那部分,等于白做。
体积、格式与尺寸声明
这一块主要影响渲染和用户体验,但间接也关系到抓取。图片太大,页面加载慢,蜘蛛等待的时间变长;没有声明 width 和 height,图片加载时页面布局跳动,也会影响体验。常见做法是压缩后输出 WebP 或 AVIF,用 srcset 给不同屏幕提供不同尺寸,同时保留一张兜底格式。上千 KB 的原始大图直接挂在列表页,是很不划算的。
图片站点地图和图库页
如果你的站有图库、相册、作品集这类以图片为主的页面,可以考虑单独做一个图片站点地图,把图片地址和所在页面列清楚。图库的列表页也要像普通列表一样能一页页翻下去、有稳定的 URL,而不是全部靠 JS 加载。图片本身不适合作为 URL 发现的唯一入口,但它是补充。
一个可以定期跑的自查清单
- 从各栏目抽 20 到 30 个页面,把图片地址批量取出来,直接访问看状态码;
- 在浏览器里关掉 JS,看 HTML 源码里还剩多少可用的图片 src;
- 检查 robots.txt 有没有误封图片目录,CDN 有没有拦掉无 Referer 的请求;
- 抽查图片文件名和 alt,是否写了人话;
- 找出体积最大的那几张图,看能不能压缩或换格式;
- 如果有图库页,确认列表能翻页,并考虑加一份图片站点地图。
这些检查不需要一次做完,按季度或半年跑一轮就够。比起反复调整参数,先把“蜘蛛能不能看到这张图”这件事确认下来,往往更实际。