本文導讀
為什麼上傳網站的圖片(照片)一定要處理?
在自己架的網站中,圖片往往是流量與載入速度最大的元兇。尤其對於部落客或是我們這樣的攝影師來說,如果你沒有大量使用外掛圖庫,你的圖片就會把網站的流量吃光光。
一張手機或相機拍攝的原始照片,大小 3~5MB起跳,未經處理直接上傳,不只拖慢網站速度,也會影響 SEO、使用者體驗、Google去計算你這個網頁的瀏覽體驗(搜尋排序),甚至導致行動裝置瀏覽卡頓。
最慘最糟糕的是:讀者根本等你的網站等太久,直接關掉了。(在資訊爆炸的時代,大家對於載入速度的耐心越來越小)
隨著瀏覽器全面支援 WebP 圖片格式,網站圖片已經有更高效的解法:
在幾乎不影響畫質的前提下,大幅降低檔案大小。
本篇文章將說明:
- 為什麼 WebP 是目前網站圖片的最佳選擇
- Lightroom 在圖片處理流程中的正確角色
- 如何設定 Lightroom 進行「適合網站的批次輸出」
- 以及 Lightroom 搭配 WebP 工具的流程
什麼是.WebP格式?
WebP 是一種專為網頁設計的現代圖片格式,與傳統 JPG、PNG 相比,具有以下優勢:
- 檔案體積可比 JPG 小 30~50%
- 同時支援「有損 / 無損」壓縮
- 支援透明背景(可取代 PNG)
- 主流瀏覽器(Chrome、Safari、Edge、Firefox)皆已完整支援
在實際測試中:
- JPG 約 800KB → WebP 約 250~400KB
- 視覺品質無法察覺差異的可能性很高
這對於下面這些都有非常明顯的效益:
- 官網首頁大圖Banner
- 產品圖
- 文章配圖
- 電商圖片
Lightroom 在網站圖片流程中的正確打開方法
Lightroom 非常適合用來:
- 修圖與色彩調整(降低雜訊,明暗度調整)
- 批次裁切與構圖(例如全部轉成1:1)
- 統一風格輸出
但需要注意的是:
Lightroom 目前仍無法原生輸出 WebP 格式(但Photoshop可以)
所以正確的工作流程應該是:
- Lightroom 負責「修圖 + 正確尺寸輸出」
- WebP 轉換工具負責「最終壓縮與格式轉換」
Lightroom 針對網頁的輸出設定教學(批次網站最佳化)
在選取檔案之後,右鍵選Export(轉存) 設這樣:
File Settings
- Image Format:JPEG
- Quality:80
- Color Space:sRGB(不要選AdobeRGB)
Image Sizing
- Resize to Fit:長邊
- 1200 px(一般網站插圖)
或 1920 px(網站滿版大圖Banner) - Resolution:72 或 96(隨便,不影響)
Output Sharpening 銳利化
- Sharpen For:螢幕
- Amount:標準
匯出後 JPG 大概 500~900KB(正常)屬於正常
.JPG批次轉.WebP 離線軟體(免費)
XnConvert
XnConvert是一個支援多平臺(Windows, MacOS, Linux等)的批次圖片轉檔工具。
下載之後:
- 把圖片大量拉進去到軟體
- Output Format:WebP
- Quality:80
- 實務成果通常可再縮小 40~60% 檔案大小
檔名可以自由選擇邏輯,輸出位置預設原資料夾。
搞定。
常見錯誤與注意事項
匯出 AdobeRGB(導致網站顏色錯誤)
不縮小尺寸只壓縮格式(你相機拍攝6000*4000大概2400萬畫素,實際上電腦用不到這麼大的尺寸)
JPEG Quality 設為 100
直接上傳手機原圖
保留 EXIF(增加不必要檔案大小)
避免以上錯誤,就能大幅提升網站效能。
結論
WebP + Lightroom,是目前最穩定的網站圖片解法
在 2026 年的網站環境中:
- WebP 已是主流格式
- Lightroom 仍是最強修圖與批次處理工具
- 正確流程能兼顧畫質、速度與 SEO
只要記住一句話:
Lightroom 修圖,WebP 上線
就能讓網站圖片既好看、又跑得快。




