現在做官網，我不會把圖片當成最後才補的裝飾。因為圖片一多，載入速度、首屏穩定度和手機閱讀感受就會一起受影響，這些東西不會等你做完版面才突然出現。
圖片如果沒有先規劃，後面通常會出現三種問題：首屏很慢、裁切一直錯、卡片高度跳來跳去。看起來只是素材問題，其實會一路影響 Core Web Vitals、SEO 分享和後台維護。
這篇核心結論
圖片策略要和版面一起設計。先定尺寸、比例、載入優先順序和後台上稿規則，網站才不會漂亮但慢。
我放一張圖，會同時看四件事
| 項目 | 要先決定什麼 | 不處理的後果 |
|---|---|---|
| 尺寸 | 實際顯示寬高與輸出圖檔大小 | 手機下載過大的圖，首屏變慢 |
| 比例 | 卡片圖、首圖、分享圖各自比例 | 同一張圖在不同位置被亂裁 |
| 載入順序 | 首屏優先，非首屏 lazy load | LCP 變差或滾動時才補圖造成跳動 |
| 替代文字 | 圖片是否需要描述內容或只作裝飾 | 無障礙與搜尋理解都變弱 |
版面和圖片從來不是分開的
如果設計稿只先留一個漂亮框，卻沒有決定圖片實際比例，後台一上稿就會出事。內容人員不知道該傳橫圖還是直圖，也不知道重要文字或主體要不要避開裁切區。
我會把圖片當成版面元件的一部分。卡片圖要服務掃描，文章首圖要服務理解，分享圖要服務辨識。用途不同，尺寸和裁切規則就不能全部混在一起。
交付時要寫清楚
- 每種圖片建議尺寸和比例。
- 最大檔案大小和壓縮格式。
- 哪些圖片是首屏關鍵圖，哪些可以 lazy load。
- 裁切安全區，避免文字或主體被切掉。
- 後台替換圖片後要檢查哪些頁面。
我寧可一開始就把圖規格想清楚
先決定卡片圖比例、單篇首圖比例、分享圖尺寸，後面無論是 CMS 上稿還是 SEO 分享，都比較不會亂。這比做完才回頭一張一張救圖有效太多。
所以我現在處理官網圖片，會把它當成版面結構和效能策略的一部分，而不是最後才補上的裝飾。
常見 FAQ
FAQ
- 圖片是不是壓縮越小越好？
不是。要在清晰度和檔案大小之間取平衡，特別是首屏和作品展示圖不能糊。 - WordPress 自動產生縮圖就夠了嗎？
不一定。縮圖尺寸有幫助，但仍要定義每個版位該使用哪個尺寸。 - 分享圖可以直接用文章首圖嗎？
可以，但前提是比例和裁切適合社群平台，且縮圖時仍能辨識主題。
結論
官網圖片不是裝飾，而是效能、閱讀和維護的一部分。越早把圖片規格和載入策略想清楚，後面越不需要靠壓縮、重裁和臨時修版面來補救。
