被拉長的照片是網路上最可以避免的錯誤，而它之所以會發生，原因只有一個：寬度和高度被分開修改。鎖定比例——也就是長寬比——再進行縮放，就能永久解決這個問題。本指南會說明實際重要的尺寸、放大時會發生什麼，以及一套使用 Image Resizer 的快速本機工作流程。
長寬比：唯一原則
長寬比就是寬度除以高度。一張 3456×2234 的照片比例大約是 1.55:1——所以如果你需要寬度為 800 像素，高度就必須變成 517。任何其他高度都會把圖片拉長或壓扁。具備長寬比鎖定功能的縮放工具會自動幫你計算：輸入寬度，高度就會自動跟著調整。
常見的目標尺寸
| 用途 | 尺寸 | 備註 |
|---|---|---|
| Open Graph / 連結預覽 | 1200×630 | 也是部落格首圖的最佳尺寸 |
| 方形貼文 | 1080×1080 | Instagram 和大多數動態消息格式 |
| 大頭貼 / 個人資料相片 | 400×400 | 網站會裁切成圓形——請保持主體置中 |
| 適合電子郵件的相片 | 寬度 ≤1024 | 可讓附件維持在大小限制以內 |
| 滿版網頁首圖 | 寬度 1600–1920 | 在大多數螢幕上，更寬只是浪費 |
縮小與放大的差異
縮小圖片基本上沒有代價：將高解析度的原始檔縮到更小，畫面依然清晰，特別是使用高品質平滑處理時。放大則不同——那些從未擷取的像素無法無中生有，所以一旦你大幅超過原始尺寸，就會預期看到模糊。如果你必須放大，請保持溫和（最多約 1.5×），並避免使用含有細小文字的影像。
維持品質的工作流程
先縮放，再壓縮。使用 Image Resizer 將影像縮放到最終顯示尺寸（開啟長寬比鎖定，圖片類圖形用 PNG，相片用 JPEG/WebP），再透過 Image Compressor 以 70–80% 的品質進行壓縮。這兩個步驟結合起來，經常能把一張 5 MB 的相機照片變成 150–300 KB 的網頁圖片，而且看不出任何損失。
為什麼精確尺寸勝過「網站會處理」
上傳一張寬度 4000 像素的照片，再交給網站縮小，代表每位訪客都下載了永遠不會看到的像素，而平台自帶的縮放工具可能採用快速但低品質的演算法。自己動手處理能讓結果保持清晰、可預期且檔案較小——而在你自己的網站上，這還能直接改善 Largest Contentful Paint（最大內容繪製）。
延伸閱讀：How to Compress Images for the Web Without Losing Quality（如何在不失品質的情況下壓縮網頁圖片）。
延伸閱讀：Create an Animated GIF in Photoshop or Your Browser（在 Photoshop 或瀏覽器中製作動態 GIF）。
延伸閱讀：What Colors Are Used in an Image: Pick Exact HEX Codes（影像中使用了哪些顏色：挑選精確的 HEX 色碼）。
延伸閱讀：Resize an Image to Exact Pixel Dimensions in Your Browser（在瀏覽器中將影像縮放到精確的像素尺寸）。