很多站点在运营时會把注意力放在文字、栏目和連結上，图片往往被当成“配图”處理。可当图片數量多起来，問题就會慢慢顯出来：文件体积拖慢加载，文件名全是乱碼，alt 文本要么空白要么堆關鍵詞，移動端還會因為固定宽度撑破版式。图片本身也是頁面内容的一部分，值得像检查正文一样做一次自查。
先看文件名和格式
文件名是图片最容易被忽略的信息入口。用 IMG_2043.jpg 或 微信图片_2024.png 這種名字，既不方便自己管理，也不利于後續检索。更實用的做法是用简短、可讀的英文或拼音描述，比如 server-log-check.png、column-planning.jpg。不需要為了關鍵詞硬凑，能說明图片内容即可。
格式方面，照片類内容通常用 WebP 或 JPEG，图标、线條图、截图适合 PNG 或 SVG。如果站点已经支持 WebP，可以優先輸出 WebP，再保留原格式作為回退。不要把所有图片都统一存成几百 KB 的 PNG，那會让列表頁和詳情頁都變重。
alt 文本：別空着，也別硬塞
alt 文本的第一服務對象是看不到图片的用戶，其次才是搜尋引擎。寫法上可以遵循一個简單标准：如果图片承载信息，就用一句话描述它；如果图片只是装饰，可以留空或使用空 alt。常见错誤是寫成“關鍵詞+關鍵詞+關鍵詞”，這既讀不通，也容易让頁面顯得刻意。
判断 alt 是否合格，可以問自己：把图片遮住，只看 alt，讀者能不能知道這里原本有什么信息？
對于产品图、流程图、資料截图，alt 里可以带上關键信息，比如“2025 年 3 月服務器响應時間分布图”。對于纯装饰背景，不必强行加描述，否則反而增加頁面噪音。
尺寸、压缩與懒加载
图片顯示尺寸和實际像素不一致，是移動端最常见的性能問题之一。一張 2000px 宽的图片被塞進 300px 宽的卡片里，浏览器仍要下载完整文件。建议按展示场景輸出合适尺寸，或者使用 srcset 提供多档图片，让浏览器自己選擇。
压缩时不要只盯着“看起来清楚”，也要看文件体积。可以保留原图作為素材，但上线版本應经過压缩。懒加载适合首屏以下的图片，首屏主图則不建议延迟加载，否則可能影响首屏呈現。同时要检查图片是否設定了宽高属性，避免加载過程中頁面跳動。
图片周邊也要一起看
- 图注與版權：如果图片来自外部，確認授權方式，必要时保留来源說明。
- 外鏈图片：直接引用外部图床的图片，可能因為對方限流、改路径或啟用防盗鏈而失效，重要图片建议本地化。
- 图片入口：图片本身如果是一個獨立頁面，確認它有没有被連結到、有没有返回入口，別让用戶点進去後無路可退。
- 移動端表現：在窄屏下检查图片是否横向溢出、文字是否被压到看不清。
一份可以照着做的自查清單
- 抽查最近更新的 10 個頁面，看图片文件名是否可讀。
- 检查信息型图片的 alt 是否描述了内容，装饰图是否留空。
- 對比图片實际像素與展示尺寸，差距過大的考虑重新輸出。
- 確認首屏图片没有被懒加载，首屏以下图片按需加载。
- 用手机打開几個典型頁面，看图片有没有撑破版式或加载過慢。
- 對外鏈图片做一次可用性检查，失效的及时替換或下载到本地。
图片自查不需要一次改完整站，可以從更新频率高的栏目開始。每次發布内容时顺手检查文件名、alt 和尺寸，久而久之就能减少很多“图片拖後腿”的情况。图片是内容的一部分，把它整理清楚，頁面体驗和内容表達都會更稳定。