很多站点把图片、视频、图表当作版式里的装饰，上线时只關心能不能顯示，很少回头检查它們在抓取和搜尋层面是什么狀態。實际上，一張配图能不能被识別、有没有文字說明、加载方式是否合理，都會影响頁面被理解的程度。這篇從日常维護的角度，把图片和媒体资源该看的地方捋一遍。
一、先確認图片是内容而不是背景
用 CSS 的 background-image 铺出来的大图，在頁面代碼里只是样式声明，没有獨立的资源地址，也没有說明文字。對用戶来说它看得见，對抓取工具来说它基本不存在。如果头图、产品图、流程图承担着传達信息的任務，最好用 img 标簽放進正文，而不是当背景贴上去。
图标、分隔线這類纯装饰元素可以繼續用背景或字体图标，但要在代碼上明确标注為装饰，避免和正文图片混在一起判断。
二、說明文字要寫，而且要寫得有用
alt 属性的作用是在图片無法顯示时提供替代信息，同时也是图片语义的主要来源。常见的两個极端：要么整站图片的 alt 都空着，要么把關鍵詞硬塞進去凑長度。
- 正文配图：用一句短语说清图里是什么，比如“後台栏目管理界面截图”。
- 功能按钮图片：寫清点击後的動作，比如“提交表單”。
- 纯装饰图：留空或标记為装饰，不要寫無意义的词。
- 图片旁邊的图注文字同样會被讀到，值得認真寫一句。
如果一篇文章的图片很多，可以在图片上下方各补一句文字說明，让图文之間有衔接，而不是一串图片连着出現。
三、文件名和路径也顺手改一改
相机導出的 IMG_2043.jpg、屏幕截图 2024-05-11.png 這類名字，對谁都没有帮助。上传前改成简短、能看懂的英文或拼音，多個词之間用连字符连接，例如 site-navigation-structure.png。路径上按业務或栏目归档，別把上千張图全堆在一個目錄里。
图片文件名不需要堆關鍵詞，清楚、能對應内容就够了。同一張图反复用在多個頁面时，注意不要在不同目錄里出現多個版本，避免後續替換时改漏。
四、加载方式：懒加载和首屏要分開對待
懒加载可以减轻首屏压力，但用過头會带来两個問题：首屏可见的图如果也被推迟加载，用戶會看到一片空白；滚動才触發的图片如果實現方式依赖脚本且没有兜底，抓取时可能只拿到占位符。
- 首屏范围内的图片直接加载，不要挂懒加载。
- 正文中後段的图片可以懒加载，但要在代碼里保留真實地址。
- 图片設定明确的宽高，避免加载完成後頁面跳動。
- 上传前压缩体积，格式上優先考虑 WebP 等現代格式，同时保留兼容回退。
五、托管與引用：外鏈图片要能長期稳定
有些站点把图片放在第三方图床，早期方便，後来图床限流或停止服務，頁面上就出現一排红叉。重要的图片尽量放在自己可控的域名下，或者至少確認對方的稳定性與訪問策略。如果图片走 CDN，注意缓存策略是否過久，替換图片後要能及时刷新。
另外，图片域名和主站域名不一致时，確認该域名的訪問没有被規則挡住，也確認没有被設定成不允许索引。
六、图片站点地图與定期巡检
如果站点的图片量較大、又希望它們被收錄，可以單獨维護一份图片站点地图，把重要頁面的主要图片列進去。维護成本不低，所以優先覆盖产品图、教程配图這類有實际價值的图片，不要把装饰图全塞進去。
图片相關的检查不需要一次做完，跟着内容更新节奏走更容易坚持：每發一篇带图文章，顺手確認文件名、alt、尺寸和加载方式是否合理。
最後，定期做一次抽查：随机挑几個頁面，關掉图片加载看文字是否還能讀懂，用開發者工具看图片請求有没有大量 404，检查有没有引用早已失效的外鏈图片。把這些問题记下来，分配到一個固定的维護时段里處理，比临时补救要從容得多。