很多站点在排查收录和速度问题时,第一反应是看服务器和模板,却很少把图片单独拎出来看。图片往往占页面总字节的一半以上,同时也是最容易被忽略的可访问性与结构化问题。花半小时做一次图片自查,成本不高,收益通常比较直接。
图片为什么值得单独自查
图片同时影响三件事:页面加载速度、访客的阅读体验,以及搜索引擎对页面内容的理解。一张上传时没有压缩的原图,可能让移动端访客多等一两秒;一张缺少替代文本的配图,对图片搜索和无障碍访问都等于空白。这些问题在单篇文章里看不出来,但全站累积之后,就会拖慢整体表现。
自查方向一:体积与格式
- 尺寸与展示尺寸是否匹配:后台传了 3000px 宽的图,前台只显示 600px 宽,多出来的像素只是在浪费带宽。
- 是否做过压缩:上传前用工具压缩,或让程序在上传时自动生成多个尺寸。
- 格式是否合适:照片类内容优先 WebP、AVIF,图标和纯色块优先 SVG 或合适的矢量格式。
- 首屏外图片是否延迟加载:懒加载能省下大量流量,但首屏主图不要懒加载,避免影响打开体验。
自查方向二:文件名与替代文本
文件名和 alt 属性是图片向外传递信息的主要渠道,规则其实很简单。
- 文件名用语义化英文或拼音加连字符,例如 site-crawl-log.webp,不要用 IMG_2024.png 或一长串编号。
- alt 描述图片内容本身,一句话说清即可;不要为了堆关键词把标题重复三遍。
- 纯装饰性图片、分隔线、背景图,alt 留空即可,不要硬塞文字。
- 正文里的图尽量配一句图注,既方便访客理解,也给内容增加上下文。
自查方向三:图片与抓取
图片资源同样需要能被正常访问,以下几处经常出问题:
- 图片目录被 robots.txt 挡住:挡掉图片目录后,图片可能仍显示在页面上,但不再参与图片搜索。
- 图片走单独的 CDN 或图床:确认这些域名没有被误屏蔽,也没有设置会拒绝抓取的防盗链规则。
- 图片站点地图:图片量大的站点,可以在 XML 站点地图里加上图片节点,帮助发现新图。
- 过度依赖 JavaScript 加载:重要配图尽量用常规 img 标签输出,脚本延迟加载的占位图可能抓不到实际地址。
判断标准很简单:把页面拿到弱网环境打开一次,再关掉图片看一遍。内容还能不能看懂、加载是否还能接受,这两个答案基本就说明问题了。
一份可以照着执行的清单
- 抽出访问量最高的 20 个页面,用开发者工具看图片总体积和各张图大小。
- 找出超过 300KB 的图片,逐一确认是否真的需要这个体积。
- 检查首屏图片是否设置了明确的宽高,避免加载时布局跳动。
- 抽查 30 张图片的 alt,看是否有描述、是否有堆砌。
- 确认图片目录、图床域名在 robots.txt 中未被误伤。
- 如果站点图片多,考虑在站点地图中加入图片节点。
- 把以上规则写进编辑规范,让新上传的图片直接合规。
图片自查不需要一次做完全站,先把首页、列表页和几篇主力文章过一遍,再把规则固定到上传流程里。持续一段时间后,页面体积和编辑质量都会比以前稳定,这类基础工作带来的改善,往往比临时改标题更持久。