很多站点运营的检查清單里,文本、連結、狀態碼都查了一遍,唯獨图片被跳過。但图片往往是頁面体积最大的部分,它同时影响三件事:用戶打開速度、蜘蛛渲染頁面的成本、以及图片搜尋能带来多少額外流量。图片没管好,前面做的一堆结构優化容易被拖後腿。
先看体积和格式
图片自查的第一步不是改代碼,而是打開開發者工具,按传輸体积排個序。通常問题集中在几類:
- 上传前没压缩,單張主图几百 KB 甚至上 MB。
- 用原图直接顯示成小尺寸缩略图,浏览器下载的還是大图。
- 仍在大量使用 PNG 存照片類内容,格式選错了。
- 同一張图在列表頁和詳情頁各存一份,没有复用。
處理方式比較直接:照片類内容優先用 WebP 或 AVIF,配一張兼容格式兜底;图标、插画類再考虑 SVG 或 PNG。顯示尺寸有多大,就按 1.5 到 2 倍准备图源,剩下的交给 srcset 让浏览器自己挑。
加载方式會不會影响蜘蛛
原生懒加载(loading="lazy")是目前主流搜尋引擎能够识別的,一般不必為了蜘蛛而全部取消。要留意的是另外两種做法:
- 首屏主图也设成懒加载,導致首屏渲染慢半拍。
- 图片地址由 JavaScript 拼接後注入,蜘蛛执行脚本不完整时可能拿不到图。
判断标准很简單:把 JavaScript 關掉再看頁面,如果正文图片区域大面积空白,就值得检查图片是否過度依赖脚本注入。
alt 文本和文件名
alt 的作用是「這張图在表達什么」,不是關鍵詞堆砌位。寫法可以简單一些:
- 内容图:寫清對象和场景,比如「會议現场簽到台排队画面」。
- 装饰图、分隔线、背景纹理:留空 alt,而不是随便填几個词。
- 带連結的图片:alt 可以說明点击後去哪,和锚文本的作用接近。
文件名同样值得顺手改一下。IMG_2043.jpg 對任何一方都没有信息量,改成能讀懂的英文短词组,成本很低,長期看對图片搜尋有帮助。
图片目錄和抓取權限
有些站点為了防盗鏈或省流量,在 robots.txt 里屏蔽了图片目錄,或者在 CDN 上做了限制。做自查时確認两件事:图片所在的路径没有被誤挡;图片走的是獨立域名时,该域名的抓取没有被規則排除。另外,图片 URL 上挂一堆时效性參數(時間戳、随机數)會让同一張图出現大量不同地址,既不方便缓存,也让統計變得混乱。
失效图片和狀態碼
改版、換图床、迁移目錄之後,很容易留下一批 404 图片。它們不會像 404 頁面那样顯眼,但每次訪問都是一次無效請求。建议按固定周期抓取一次站点,筛出返回 404 或 403 的图片地址,能补的补,确實不要的就让它干净地返回 404,不要用一張占位图加 200 狀態碼糊過去。
顺手做一下图片 Sitemap
如果站点图片量較大,且希望图片搜尋有更多展示机會,可以在常規 Sitemap 里补充图片信息,或單獨建一份图片 Sitemap。這不是必须項,優先級低于前面几項,属于锦上添花。
一份可以照着走的自检顺序
- 按頁面体积排序,找出前二十張大图,逐個压缩或換格式。
- 確認首屏图片没有懒加载,確認關掉 JS 後正文图片仍可见。
- 抽查 alt 是否為内容服務,装饰图是否留空。
- 检查图片目錄是否被 robots.txt 或 CDN 規則誤挡。
- 跑一次全站抓取,導出图片 404 清單並逐條處理。
- 把以上步骤寫進上线的检查項,改版时按同一套流程走一遍。
图片自查不需要一次性做完,先解决体积和失效這两块,收益通常最直接。剩下的 alt、命名、Sitemap 属于長期维護項,配合内容更新节奏慢慢补齐即可。