打开一个栏目页,正文只有几百字,但加上头图、配图、产品大图和一个视频,页面体积轻松就上到几兆。图片和视频通常是页面上最重的部分,也是最容易被忽略的部分:文件直接上传、原图不压缩、文件名是相机导出的编号、alt 空着、首屏大图还挂着懒加载。这些问题不会让站点立刻出故障,但会一层层拖慢加载、影响可读性,也让蜘蛛在有限的抓取时间里多做无用功。
为什么把媒体资源单独拎出来查
页面模板、栏目结构、正文内容都有对应的自查项,媒体资源却常常散落在每个人的习惯里。编辑习惯用某个工具压缩,运营习惯从素材库直接拖图,开发习惯给所有图片统一加懒加载。三套习惯各自合理,叠在一起就可能出现:同一张图在列表页被裁成三种尺寸、同一段视频在不同栏目重复上传、图片地址里混着中文和空格。抽出半小时集中检查一遍,比事后一张张替换省事得多。
体积与格式:先让文件变小
- 控制尺寸:按实际显示宽度出图,不要用 2000 像素的原图去填 600 像素的容器,再靠 CSS 缩放。
- 选对格式:照片类内容优先考虑 WebP、AVIF 这类压缩率更好的格式,图标和纯色块用 SVG;需要兼容旧环境时保留原格式作为后备。
- 批量压缩:在发布流程里加一步压缩,而不是靠个人自觉。压缩后肉眼对比一次,确认锐度还能接受。
- 视频能外链就外链:自托管视频对带宽和服务器压力都不小,非必要不放在自己服务器上。
文件名与路径:地址要能读、能维护
媒体地址同样属于 URL 的一部分,改起来成本不低。上传前把文件名改成能说明内容的英文短词,用连字符分隔,去掉空格、括号和中文。图片按栏目或用途分目录存放,比如 /uploads/product/ 这样的结构,比上千张图全堆在一个目录里更好维护。文件名一旦发布就尽量别改,改了就要记得处理旧地址的跳转。
alt 与周边文字:让图片有上下文
alt 的作用是描述图片内容,不是塞关键词。写清楚这张图在表达什么,装饰性图片留空即可。图片旁边的正文、图注、标题会给它提供上下文,比在 alt 里堆词有效得多。检查时可以抽几个栏目页,把图片遮起来看正文是否还读得通。
懒加载:别把首屏大图也拖到最后
懒加载对长列表页很友好,但首屏可见的那张主图如果也懒加载,用户和蜘蛛看到的可能是一块空白。检查方式是关掉缓存打开页面,看首屏图片是否立刻请求。另外,懒加载依赖 JavaScript 时,要确认图片地址最终会出现在 HTML 里,而不是只存在于脚本变量中。
图片与视频的抓取入口
如果站点有大量图片,可以在站点地图里补充图片地址,方便蜘蛛发现。视频页建议给一个独立的详情页,配上标题、简介和封面图,而不是把视频埋在某个列表里。检查时确认这些地址返回正常状态码,没有被 robots.txt 意外挡掉。
一份可以照着走的自查清单
- 抽查十个栏目页,记录页面总体积和最大的三张图。
- 核对图片是否按显示尺寸输出,格式是否已压缩。
- 检查文件名与目录,是否还有空格、中文和随机编号。
- 逐张确认 alt 是否描述了内容,装饰图是否留空。
- 关闭缓存重新加载,确认首屏图片不经过懒加载。
- 确认图片地址在 HTML 源码中可见,而非脚本动态拼接。
- 检查图片站点地图和视频详情页,地址返回是否正常。
媒体资源自查不需要一次做完美,先把最大、最常被访问的那批页面理顺,再按栏目逐步铺开,效果会比一次性全站返工更稳。