在瀏覽器中使用與桌面工具相同的解碼器重新編碼，是在不損失品質的情況下縮小影像的最快方法，因為檔案從不上傳到伺服器。直接從手機相機拍攝的照片通常介於 3 MB 到 8 MB 之間，以約 70% 的品質重新編碼後，通常會將檔案縮減到 200 KB 到 1 MB 的範圍，在一般觀看尺寸下不會產生可見的差異。整個工作流程分為三個步驟:挑選或拖放檔案、拖曳滑桿以比較原圖與壓縮版本，然後下載較小的副本。由於壓縮過程是在您的裝置上本機執行，使用瀏覽器內建的影像編解碼器，因此輸出結果不會經過上傳、排隊、註冊，也不會被加上浮水印。這種方法適用於 JPG、PNG 和 WebP 檔案，能保留使用者實際查看的每一個像素，同時悄悄地去掉您不需要的容量。它也適用於螢幕擷圖、商品照片、證件掃描，以及您需要透過電子郵件傳送、上傳或發布到網路上的任何其他靜態影像——而且由於資料不會離開您的裝置，敏感的內容也能保持隱私。
為什麼沉重的影像會堆積，以及「縮小」真正的含義
現代智慧型手機預設拍攝的照片落在 3 MB 到 8 MB 的範圍，因為它們將每個感測元件的讀數儲存在無損的封套中，再讓 JPEG 編碼器在之上施加輕度壓縮。該檔案非常適合在桌面上進行編輯，但其大小遠超過螢幕的需求。當同一張圖片出現在網頁、電子郵件或求職網站的上傳表單中時，多餘的容量會拖慢一切並浪費頻寬，卻無法讓影像看起來更銳利。
在這種情況下，「縮小」幾乎總是指有損重新壓縮:編碼器保留人眼真正注意到的圖片部分——寬廣的色塊、大面積平滑的漸層、鮮明的邊緣——並捨棄在一般螢幕尺寸下觀看時會立即消失的細節。關鍵的洞察在於，一張 4000 像素寬的照片出現在 1200 像素寬的網頁上時，瀏覽器本身就會透過縮放捨棄約 90% 的像素，因此將這些像素儲存在檔案中毫無意義。訣竅是先降低檔案大小，再讓瀏覽器進行最終的縮放。
第二個槓桿是格式本身。將相同的像素資料重新儲存為 WebP 而非 JPEG，通常能在相同的視覺品質下產生小 20% 到 30% 的檔案，因為 WebP 使用更現代的編碼演算法。在調整品質滑桿之前先選擇正確的格式，就能免費省下三分之一的位元組。您不需要一次只選用其中一個槓桿。一個設計良好的瀏覽器壓縮工具可讓您選擇輸出格式、拖曳單一品質滑桿，並即時觀察檔案大小與視覺結果的變化。這就是猜測與檢視之間的差別。
在調整滑桿之前選擇正確的輸出格式
三種格式幾乎涵蓋了所有實際情況:JPEG、PNG 和 WebP。每種格式都有其最擅長的工作，選錯格式會浪費位元組卻無法節省任何視覺品質。如需深入了解這些格式在各種邊緣情況和匯出方面的比較，JPEG vs PNG vs WebP 格式指南更詳細地剖析了其中的權衡。
| 格式 | 最適用於 | 為什麼選擇它 | 瀏覽器支援 |
|---|---|---|---|
| JPEG | 照片、首圖、商品圖 | 在品質 60–80% 下檔案極小且無可見損失 | 通用 |
| PNG | 螢幕擷圖、UI 擷取、需要透明度的影像 | 無損，精準保留銳利的文字和清晰的邊緣 | 通用 |
| WebP | 現代網站、Retina 顯示器、任何線上發布的內容 | 在相同視覺品質下比 JPEG 小 20–30% | 所有現代瀏覽器 |
對於 JPEG 而言，60% 到 80% 的品質區間是大多數照片的最佳甜蜜點:在一般觀看尺寸下與原圖的差異難以察覺，檔案大小卻能大幅縮減。對於含有小文字的 PNG 螢幕擷圖，WebP 在相同檔案大小下通常勝過 JPEG，因為 WebP 處理硬邊緣比重度壓縮的 JPEG 更乾淨。如果您需要無損品質和較小的檔案，通常必須同時調整影像尺寸和重新編碼——但就如何在不損失品質的情況下縮小影像這個問題而言，僅憑正確的格式就能在滑桿移動之前解決一半的差距。
如何在不損失品質的情況下縮小影像
- 在瀏覽器中開啟影像壓縮工具，選擇 JPG、PNG 或 WebP 檔案——或直接從桌面拖曳到頁面的任何位置。檔案一到位就會開始壓縮;無需上傳、無需註冊、無需排隊等候。
- 拖曳品質滑桿。壓縮預覽會即時更新，分割檢視會將原圖和重新壓縮的影像堆疊在同一畫面中。拉動分割線橫跨圖片，檢視壓縮對毛髮、文字邊緣和漸層天空等細節的影響。
- 如有需要，請選擇輸出格式。JPEG 是照片的安全預設值，因為世上每台裝置都能開啟;WebP 則能在現代網路上產生更小的檔案。
- 下載壓縮後的檔案。由於整個過程都在您的瀏覽器中執行，因此檔案從未離開您的裝置。
如果結果仍然感覺太大，請每次將滑桿降低幾格，並逐次檢查分割檢視。對於大多數照片而言，60% 到 80% 之間的任何值在視覺上都與原圖無法區分，因此您通常可以選擇一個同時達到大小目標和品質標準的數值。
在品質滑桿上找到甜蜜點
品質滑桿是工具的核心，善用它並非將其視為單一數字，而是將其視為兩個問題之間的權衡:檔案需要多小?圖片實際承載了多少細節?
人物、風景和商品的照片容錯度很高。眼睛首先將它們視為形狀和顏色，其次才是細部紋理。在一般顯示器上，70% 到 80% 的品質設定幾乎總是與原圖無法區分，並且能將檔案大小縮減為相機預設匯出的四分之一或五分之一。降到 60% 時，平滑的天空中開始出現輕微的條紋，文字或珠寶周圍的邊緣也會變得柔化;再往下降，觀看者唯一注意到的就只有省下的容量。
螢幕擷圖的容錯度較低。細小的介面文字、單像素的細線和清晰的圖示在 WebP 和輕度壓縮的 JPEG 下都能完好保存，但在低品質 JPEG 下會明顯劣化，因為 JPEG 是為平滑照片設計的，並非為硬邊緣的字符設計。如果螢幕擷圖在壓縮後看起來模糊，正確的做法是將輸出切換為 WebP 再試一次，而不是將滑桿調更低。如需更仔細地了解 WebP 在相同設定下實際比 JPEG 節省多少空間，WebP vs JPG 比較依影像類型詳細說明了差異。
一個簡單的經驗法則:照片從 75% 開始，含小文字的螢幕擷圖從 85% 開始，發布到網站上的任何內容都使用 WebP。每一步都使用分割檢視。如果在螢幕上以 200% 縮放都看不出差異，您的訪客在正常尺寸下也不會看出差異。
下載前如何檢視結果
一個好的壓縮工具不會要求您信任它。它會將圖片並排顯示，讓您拖曳分割線橫跨畫面，即時在兩個版本之間來回檢視。分割檢視很重要，因為 65% 和 75% 品質之間的差異不是一個數字——而是圖片上的一個位置。最常先檢視的地方是文字和商品標籤的高對比邊緣、繁雜背景中細微的髮絲，以及開闊天空的平滑漸層。這三個區域比其他任何部分更能快速揭示壓縮瑕疵，因此如果它們在分割檢視中看起來乾淨，影像的其他部分也會沒問題。
當您在圖片上拖曳分割線時，請注意任何突然在其中一側出現而在另一側消失的內容。如果某個細節只在原圖那一側引起您的注意，則該區域的壓縮過於激進;請將滑桿向上調幾格再試一次。如果兩側看起來完全相同，則您已經找到了品質底線，可以繼續進行。分割檢視也能回答純檔案大小數字無法回答的問題:省下的空間究竟是來自捨棄了您實際看到的資料，還是來自捨棄了人眼永遠不會注意到的資料。前者代表品質損失，後者代表免費的勝利。
隱私、檔案限制，以及瀏覽器型壓縮的不同之處
大多數線上壓縮工具會將您的照片上傳到遠端伺服器，在那裡進行處理，然後將副本傳回。對營運商而言，該工作流程每張影像都會產生實際成本，並會在您無法控制的基礎架構上建立檔案的暫存副本。對於大多數照片來說這沒有問題，但對於身分證件掃描、醫療影像、契約、未公開的商品照片或任何您不會公開張貼的內容，則不合適。
瀏覽器型壓縮工具完全繞過了這個問題。頁面會解碼您的影像、將其繪製到 HTML5 canvas 上、以您選擇的格式和品質重新編碼，然後將結果交給您——所有操作都在您的瀏覽器分頁內完成，使用的是您的作業系統已信任的相同影像編解碼器。不會上傳任何內容、不會有副本離開您的裝置，也不存在攻擊者可以窺探或故障可能導致停機的伺服器端佇列。
這也消除了常見的檔案大小限制。沒有上傳，也就沒有上傳上限。唯一的限制是記憶體容量，而對於一般的照片來說，這代表檔案大小可以輕鬆超過伺服器端工具所能接受的限制。您也不會得到浮水印、不需要帳號，而且可以在下載結果後立即關閉分頁。
這個工作流程不僅適用於敏感內容，也值得在日常使用中持續採用。較小的影像上傳到求職網站和市集的速度更快，能在電子郵件附件限制內通過而不被另行壓縮，並且在您發布的網站上載入更快。網頁速度是經過驗證的排名因素，而影像權重通常是拖慢頁面的首要原因。較小的影像直接改善最大內容繪製 (LCP)，並為您和您的訪客降低頻寬成本。