企業網站常在改版初期速度正常，幾個月後卻越來越慢。原因之一，是每次新增活動頁、案例頁或商品照片時，都直接上傳原始檔。高解析照片雖然清楚，卻不代表適合直接交給網頁載入。
圖片優化不是一味把檔案壓到最小，而是讓不同裝置在合理時間內取得足夠清楚的畫面，同時讓編輯人員能持續執行。與其上線前集中處理一次，更適合把規則放進日常發布流程。
先分辨圖片的用途與必要性
開始壓縮前，先問每張圖是否真的有助於理解內容。首頁橫幅、服務流程示意、產品細節與案例成果，通常具備資訊價值；純裝飾性背景圖若體積很大，則應重新評估是否必要。
接著為圖片分級。常見類型包括：
- 主視覺與橫幅：需要兼顧寬版呈現與手機裁切。
- 內容圖片：協助說明文章、案例或服務細節。
- 商品與作品圖片：需要讓使用者辨識材質、規格或成果。
- 圖示與介面元素：適合以向量或可縮放資源處理。
不同用途不該套用同一個固定尺寸。尤其將手機拍攝的原始大圖直接縮放顯示，只是讓瀏覽器做了更多不必要的下載與處理。
尺寸應依版面需求決定
先向設計或開發人員確認網站中各類圖片最大的實際顯示寬度，再以此建立上傳建議。例如內容欄位不會超過某個寬度，就不需要準備遠超出需求的圖片。
橫幅圖要特別留意裁切。桌機適合的寬幅構圖，到了手機可能只剩中央一小段。拍攝或挑選圖片時，將人物臉部、產品重點與文字避開區域留在安全範圍，並實際查看不同螢幕下的結果。
若系統支援回應式圖片，應提供多種尺寸版本，由瀏覽器依螢幕與網路狀況選擇合適檔案。這比所有裝置下載同一張大圖更有效率，也更符合實際使用情境。
選擇格式時，先看內容特性
照片類圖片可優先評估現代網頁圖片格式，通常能在維持可接受畫質下減少檔案大小；但仍要確認使用的內容管理系統、圖片處理流程與目標瀏覽環境是否支援。若團隊無法穩定產生新格式，先做好尺寸控制與壓縮品質設定，同樣能帶來明顯改善。
透明背景的標誌、簡單圖示與線條插圖，則應依素材特性選擇適合格式。不要把原本可縮放的圖示存成大型點陣圖，也不要因追求小檔案而讓文字截圖模糊難讀。
每次壓縮後都要以實際網頁尺寸檢查，而非只在電腦檔案預覽中判斷。特別是含有細字、紋理、產品邊緣或漸層的圖片，最容易在過度壓縮後出現失真。
檔名與替代文字是內容管理的一部分
有意義的檔名能讓團隊日後找到素材，也能降低上傳錯圖的機會。可採用「服務名稱-情境-編號」這類規則，避免保留相機預設檔名或「final-final-2」等無法辨識的名稱。
替代文字則用於在圖片無法呈現、使用輔助工具，或需要理解圖片內容時提供說明。它不是堆放關鍵字的位置，而是簡短說出圖片傳達的必要資訊。若圖片只是裝飾，且附近文字已完整說明，應依網站技術做正確標示，避免重複干擾閱讀。
建立上傳前檢查，避免問題反覆出現
最實用的做法，是替內容人員準備一份簡短檢查表：確認圖片用途、調整尺寸、輸出合適格式、檢查畫質、命名檔案、填寫替代文字，最後在手機與桌機頁面確認顯示結果。
也要釐清誰能處理原始素材、誰負責上傳、誰檢查版面。當責任沒有交代清楚，圖片往往會在趕發布時直接略過處理。規則愈簡單、工具愈容易取得，團隊愈能持續遵守。
今天可以先做的事
- 找出目前流量高的三個頁面，檢查是否有明顯過大的圖片檔案。
- 為首頁橫幅、內容圖與商品圖各訂一項尺寸建議。
- 建立可辨識的圖片檔名規則，從下一次上傳開始執行。
- 在發布流程加入手機檢視與替代文字檢查。
