图片通常是頁面上平均体积最大的资源,也是最容易被放過的一块。很多站点把正文改得很干净,却在列表頁挂了十几張原图直出的缩略图,蜘蛛来一趟,带宽和時間都花在了這里。图片自查不需要多深的技術背景,按下面几項顺序過一遍就够。
先看体积,再看格式
- 内容图單張控制在 100–200KB 比較稳妥,首屏大图可以放宽,但一般也不建议超過 300–500KB。
- 缩略图不要用原图靠 CSS 缩小。浏览器下载的仍然是原文件,蜘蛛拿到的也是原文件。
- 能用 WebP 或 AVIF 就用,同画质下通常比 JPEG 小不少;需要兼容老环境时用 picture 元素保留一份回退格式。
- 重点翻一翻歷史文章里的图,老内容往往是体积失控的重灾区。
尺寸與响應式
用 srcset 和 sizes 让不同屏幕取到不同文件,是成本較低的一步。移動端蜘蛛拿到移動版頁面时,如果图片還是桌面大图,這次抓取就有点浪費。另外,後台生成的缩略图規格不要太多,尺寸重复的副本既占存储,也會让图片目錄變得难以管理。
alt 與文件名
alt 寫清楚這張图表達的信息就够了。一張展示区域销量走势的图表,alt 寫成“第三季度华東区销量走势”比堆一串關鍵詞有用得多,也更符合它的實际作用。
- 装饰性图片、分隔线、纯背景图用空 alt 或 aria-hidden,不要硬塞描述。
- 文件名用短横线分隔的英文或拼音,比 IMG_2031.jpg 好,但不必為了關鍵詞把文件名寫成一句话。
- 同一張图在多個頁面复用时,alt 可以按上下文微調,不必全站一模一样。
重要信息別只存在于图里
價格表、活動規則、參數對比做成图片,蜘蛛讀不到里面的文字,用戶也没法複製。這類内容尽量用 HTML 表格或文字排版,图片只做辅助說明。如果确實只能用图,至少在图下方补一段文字,把關键信息用文字再说一遍,同时也能照顾到屏幕阅讀器。
图片的抓取路径
图片常放在 CDN 或獨立目錄,需要確認 robots.txt 没有把整段图片路径挡住。如果站点本来就不打算做图片搜尋流量,屏蔽是可以的選擇,但那是主動取舍,不是預設被挡。图片站点地图能帮蜘蛛發現那些只在脚本里出現的图,優先級不算高,先把正文图處理好再考虑它。還有一点常被忽略:換 CDN、換存储目錄时做好重定向,否則老图片地址會陆續變成 404,頁面上留下一個個空洞。
一份可以照着走的自查清單
- 随机抽十個頁面,看開發者工具里体积最大的几個文件是不是图片。
- 列表頁缩略图用的是缩略图文件,還是原图缩放。
- 内容图有没有 alt,装饰图有没有留空。
- 關键信息是否只存在于图片里。
- 图片目錄有没有被 robots.txt 或 CDN 規則挡住。
- 換域名或換存储後,老图片地址是否還能正常訪問。
图片不是“顺手處理一下”的事。它占的体积最大,又最容易被蜘蛛誤讀,花半小时過一遍,往往能同时省下带宽和抓取時間。
图片處理得干净,頁面轻了,蜘蛛在同样的抓取预算里能走更多頁面,用戶打開的等待也短了。這件事没有一次性做完的说法,把它放進日常的發布检查里更現實。