圖片2026-08-11

網站圖片尺寸要多大？手機與桌機都好看的實用原則

網站圖片太大會拖慢載入，太小又可能在高解析螢幕變糊。與其追求固定答案，更重要的是依實際顯示寬度準備合理尺寸。

先看重點

正式資料先保留原檔；處理前先定義規則，處理後再核對結果，比單純追求速度更重要。

先看圖片在頁面最大顯示寬度

如果內容區最大只有 1200px，通常不需要每張圖都放到 4000px。

英雄圖、內容圖、縮圖和 Logo 的用途不同，應分開設定。

部分裝置像素密度較高，因此可準備約實際 CSS 顯示尺寸 1.5 到 2 倍的來源圖，再搭配瀏覽器縮放。

但不代表越大越好，仍要兼顧檔案大小。

卡片縮圖若統一 16:9、4:3 或 1:1，比每張圖片指定不同高度更容易維持整齊版面。

需要裁切時，先保留重要主體，不要只靠自動置中。

完成尺寸調整後，再選擇 JPG、PNG 或 WebP 並壓縮，通常效果最好。

網站最佳化是尺寸、格式與品質三者一起考量。

WUCJ 圖片尺寸調整工具

看完方法後，直接開啟對應 WUCJ 工具實作。

可回到分類頁繼續閱讀同類型教學，或回 WUCJ Tools 使用其他工具。