圖片係網站嘅「顏值擔當」，但如果處理得唔好，就會變成拖慢網站速度嘅「累贅」，仲會錯過提升SEO嘅機會。圖片優化嘅核心係「喺唔影響視覺效果嘅前提下減細體積」同「等搜索引擎理解圖片內容」，而壓縮大小同埋加alt標籤係最基礎又最有效嘅兩種方法。
一、點解要優化圖片？
先搞清楚優化嘅重要性，先會更加重視呢一步：
- 提升加載速度：未經優化嘅大圖會令頁面加載時間變長，訪客可能等唔切加載完就走（研究顯示，頁面加載超過 3 秒，53% 嘅訪客會放棄）。
- 慳伺服器空間：壓縮後嘅圖片體積更細，可以減少伺服器儲存佔用同流量消耗（尤其對按流量收費嘅伺服器好重要）。
- 有助 SEO 排名：搜索引擎（例如百度、Google）冇辦法直接「睇明」圖片，只能夠透過文字資訊（例如 alt 標籤）去理解內容，優化圖片可以令圖片喺搜尋結果入面得到更多曝光。
- 適應流動裝置：手機用戶流量有限，細體積圖片可以減少加載消耗，提升流動端體驗。
二、圖片壓縮：減小體積，唔損畫質
圖片壓縮嘅原理係去除圖片中冗餘嘅像素信息（例如肉眼難以分辨嘅色彩差異），喺保持視覺效果嘅同時減小檔案大小。新手推薦用插件自動壓縮，唔使手動操作。
方法 1：用插件自動壓縮（推薦畀新手）
推薦插件：Smush 或 ShortPixel（免費版夠用）
以 Smush 以佢為例，步驟如下：
- 安裝插件：後台【插件】→【安裝插件】→ 搜尋 “Smush”→ 點擊【安裝】→【啟動】。
- 基本設定：
- 啟動後進入插件設定頁，勾選 「自動壓縮新上傳嘅圖片」（新上傳嘅圖片會自動壓縮，唔需要手動操作）。
- 點擊「批量壓縮」，選擇「壓縮所有圖片」（對已上傳到媒體庫嘅舊圖片進行壓縮）。
- 等待壓縮完成：插件會顯示壓縮進度同節省嘅空間（例如「已壓縮 50 張圖片，節省 20MB 空間」）。
優點：全自動處理，支援批量壓縮，免費版可以滿足中小網站需求（Smush 免費版單張圖片最大 5MB，ShortPixel 免費版每月可以壓縮 100 張）。
方法 2：上傳前手動壓縮（適合追求極致優化）
如果張相嘅體積特別大（例如相機影嘅原始相，閒閒地 10MB 以上），建議先喺電腦度手動壓縮，再上傳去網站：
- 網上工具（唔使安裝軟件）：
- 細細PNG（tinypng.com）：支援 PNG 同 JPG，壓縮率高，畫質損失少，一次可以上傳 20 張。
- 圖片壓縮工具，支援 WebP 格式（體積比 JPG 細 30% 到 50%）。
- 操作步驟：
- 打開工具→上傳圖片→等壓縮完成→下載壓縮後嘅圖片→上傳到 WordPress 媒體庫。
適合場景：首頁 Banner 圖、產品詳情頁主圖等重要圖片，手動壓縮可以更精準控制畫質。
壓縮注意事項：
- 普通圖片（例如文章配圖）壓縮到 200KB 以內 就得，首頁大圖要控制喺 1MB 以內。
- 優先用 WebP 格式（WordPress 5.8+ 已經原生支援），相同畫質下體積比 JPG 細約 50%。
- 避免過度壓縮：壓縮率超過 80% 可能會令圖片變矇，尤其係文字較多嘅圖片（例如截圖、資訊圖）。
三、添加 alt 標籤：等搜尋引擎「睇得明」圖片
“「alt 標籤」（全稱「alt 屬性」）係圖片嘅「文字說明」，當圖片因為網絡問題載入失敗時，會顯示呢段文字；更重要嘅係，搜尋引擎會透過佢理解圖片內容，影響圖片喺搜尋結果中嘅排名。
點解一定要加 alt 標籤？
- 例 1：一張「紅色運動鞋」嘅圖片，如果冇 alt 標籤，搜尋引擎可能只係知道呢張係圖片；加咗 alt 標籤「紅色運動鞋 輕便透氣」之後，搜尋引擎就會將佢同「紅色運動鞋」相關嘅搜尋字眼關聯。
- 例 2：圖片載入失敗嗰陣，訪客會睇到 alt 標籤嘅文字，知道呢度本來應該係一張咩圖片（而唔係空白或者「圖片無法顯示」嘅圖示）。
點樣加 alt 標籤？
方法 1：上傳圖片時直接添加（推薦）
- 上傳圖片（無論係透過媒體庫定係編輯器上傳），喺彈出嘅圖片設定視窗入面，搵到「替代文本」（即係 alt 標籤）輸入框。
- 填寫描述：
- 簡潔準確（10-15 個字為佳），包含圖片核心內容（例如「公司辦公室前台」「2023 款手提電腦外觀」）。
- 避免堆砌關鍵詞（例如「WordPress 建站 網站 設計 公司」呢啲無效描述）。
- 如果張圖係裝飾性嘅（好似分隔線、背景花紋咁），可以留空或者填「裝飾性圖片」（唔好誤導搜尋引擎）。
- 撳「插入到文章」，alt 標籤就會自動生效。
方法 2：為已經上傳嘅圖片加上 / 修改 alt 標籤
- 進入【媒體】→【庫】，搵到需要修改嘅圖片，點擊圖片進入編輯頁。
- 喺右側「替代文本」框入面填寫或者修改內容，點擊【更新】就得。
alt 標籤 vs 標題（Title） vs 描述（Caption）：唔好搞亂咗
好多新手會將呢三個概念撈亂，簡單區分：
- alt 標籤（替代文字）：畀搜尋引擎同載入失敗時睇嘅，影響 SEO，一定要填。
- 標題（Title）：滑鼠懸停喺圖片上面時顯示嘅文字（可選，適合補充細節，例如「點擊查看高清圖」）。
- 描述文字（Caption）：顯示喺圖片下方嘅文字（類似圖片說明，例如「圖 1：公司年會現場」，根據需要填寫）。
四、新手常見問題
- 所有圖片都必須加 alt 標籤嗎？幾乎係。除咗純裝飾性圖片（例如純色背景、邊框），其他包含實際內容嘅圖片（產品圖、人物圖、場景圖等）都需要添加，呢個係 SEO 嘅基本要求。
- 壓縮後張圖變矇咗點算？降低壓縮強度（插件入面可以調校壓縮率），或者用手動壓縮工具（例如 TinyPNG）重新壓縮，保留更高畫質。
- WebP 格式嘅圖片喺舊瀏覽器度顯示唔到？現代瀏覽器（Chrome、Edge、Firefox、Safari 14+）都支援 WebP，舊瀏覽器（好似 IE）已經好少人用，唔使太過擔心。如果需要兼容，可以安裝插件「WebP Express」，自動為舊瀏覽器提供 JPG 替代版本。
- 圖片優化完，網站速度冇變快？可能係其他因素影響（例如伺服器速度慢、插件太多），可以先用 GTmetrix 工具檢測，睇下「圖片大小」係咪仲係主要問題。
圖片優化係「低成本高回報」嘅操作：花 10 分鐘設定插件同加 alt 標籤，就可以顯著提升網站速度同 SEO 表現。養成「上傳必優化」嘅習慣，你嘅網站會更受訪客同搜尋引擎歡迎。