調整 GIF 尺寸意味著改變動畫 GIF 中每一個可見幀的像素寬度與高度,同時保持幀的順序、每幀的延遲,以及整體動畫播放時長不變。最簡單的理解方式是:你設定一個新的目標寬度,符合的高度會依照原始畫布比例自動算出,然後將相同的縮放比例套用到動畫中每一個可見幀上。幀延遲、循環行為與動畫順序都保持不變,因此在調整尺寸前播放三秒的片段,調整後依然會播放大約三秒,差別只在於它被放進了一個較小或較大的矩形中。這也說明了為什麼調整 GIF 尺寸的感受與調整單張 JPG 或單張 PNG 不同:你並不是在處理一張圖片,而是要求瀏覽器重繪數十幀、遵循每一幀的背景規則,然後把結果重新建構成一個全新的 GIF 檔案。如果你想要一個能在當前分頁直接處理這項工作的實作工具,GIF Resizer 頁面正是為了這個任務而打造。

調整 GIF 尺寸實際上改變了什麼
當你調整一個動畫 GIF 的尺寸時,有三件事會同時改變,其他幾件事則保持不變。會改變的只有像素寬度與像素高度這兩個數字。幀內所有繪製內容都會依原始畫布的相同長寬比重新縮放,以符合新的矩形,因此不會沿單一軸向被拉伸或壓扁。每幀的延遲(也就是圖片顯示的百分之一秒數)會從解碼後的幀讀取,再寫回新檔案,動畫因此能以相同速度播放。
可見幀的順序同樣會保留,因為匯出時是依序走訪已解碼的幀。循環次數會重設為無限循環,因為多數檢視器預期動畫 GIF 會永遠播放,匯出時不會保留來源檔中可能儲存的有限循環次數。原始的調色盤表、註解區塊以及其他 GIF 中繼資料擴充區段不會被複製,因為匯出是重新編碼一個全新的 GIF,而不是逐位元組改寫原始資料流。如果這些附帶屬性對你的工作流程很重要,你需要在調整尺寸後,使用專門的 GIF 編輯器再把它們加回去。
為什麼動畫 GIF 比照片更難調整尺寸
一張靜態 JPG 或 PNG 只儲存一張圖片。一個動畫 GIF 則儲存了標頭、邏輯畫布尺寸,以及一串圖片幀,而每一張圖片幀不一定是一張完整的圖片。許多 GIF 會儲存第一張完整幀,然後接著使用較小的局部修補幀,只更新邏輯畫布的某個部分,並搭配一個釋放指令(disposal instruction),告訴下一幀是要保留前一個像素狀態、清除已變動的矩形,還是在繪製新修補幀之前先還原到先前的畫布狀態。
如果工具各自獨立縮放每一塊原始修補幀,這些修補幀在新畫布尺寸下就會對不齊,局部更新的背景可能會消失,你就會看到原本設計播放時根本不會出現的殘影、破洞或透明矩形。正確的順序是:讀取所有幀、依照釋放規則合成出每個時間點完整的可見畫布,等到完整畫面正確後,再把這個完整畫面以要求的尺寸繪製到新畫布上。這就是 GIF Resizer 內部的運作方式:它使用瀏覽器的 CanvasRenderingContext2D drawImage API,以新尺寸重繪每一張合成後的幀,再把新的動畫組裝起來,透過 URL.createObjectURL 暴露為本機 Blob。
如何在本機調整動畫 GIF 尺寸
這個頁面刻意只提供一個幾何控制項。寬度就足以在不獨立拉伸某個軸向的前提下設定新尺寸,來源畫布的比例會自動用來找出對應的整數像素高度。請在瀏覽器中開啟 GIF Resizer,然後依照下列步驟操作:
- 選擇一個最大 20 MB 的動畫 GIF,並確認檔案載入後頁面所顯示的偵測來源畫布大小。
- 以整數像素輸入目標寬度。對應的高度會依來源畫布比例為你計算,並四捨五入為整數像素。
- 選擇 Resize GIF。動畫會被解碼,每一個可見幀會依照其釋放規則進行合成,每一張完整幀會以新尺寸繪製,會為每一個輸出幀建立全新的調色盤,新的 GIF 會被打包為本機 Blob。
- 使用頁面顯示的下載連結,在瀏覽器分頁或你的目標應用程式中開啟結果,觀察第一輪播放的時長、邊緣品質與文字清晰度。
頁面會顯示實際的輸出尺寸、可見幀數,以及新 GIF 的最終位元組數,因此你可以確認結果是否符合預期。如果來源檔含有不支援的幀資料、損毀的簽名,或超過瀏覽器能處理的解碼工作量,頁面會顯示錯誤,且不會留下過期的下載連結。如需逐步說明如何在調整尺寸過程中保持動畫正常播放,請參閱 如何調整 GIF 檔案尺寸而不破壞動畫。
GIF Resizer 保留與重建的內容
因為匯出是一個全新的 GIF 編碼,而不是對原始資料流的逐位元組調整尺寸,某些屬性會被保留,其他屬性則會從頭重建。下表摘要說明這個頁面所依循的對應關係。
| 屬性 | 處理方式 |
|---|---|
| 可見幀順序 | 保留。幀會以與來源相同的順序播放。 |
| 每幀延遲 | 保留。每幀使用來源解碼後的延遲。 |
| 透明像素 | 保留。GIF 支援單一位元透明度,此模型會在每個輸出幀中保留。 |
| 寬度與高度 | 改變。新寬度是你輸入的值;高度依來源比例計算。 |
| 調色盤表 | 重建。每個輸出幀會得到一個最多 256 色的全新調色盤。 |
| 循環次數 | 重設為無限循環。來源中任何有限的循環次數都會被捨棄。 |
| 註解與應用程式擴充區段 | 不會複製。匯出時不保留 GIF 中繼資料區塊。 |
| 檔案位置 | 本機。解碼、縮放、調色盤編碼與下載 Blob 都保留在當前瀏覽器分頁中。 |
調整 GIF 尺寸後何時會變小,何時不會
調整尺寸會減少每一幀的像素數,因此每一幀內部的原始影像資料通常會變小。但這並不保證檔案一定會變小。最終位元組數取決於動畫內容、新調色盤對內容的契合程度,以及 GIF 壓縮器如何打包修補幀。當動畫含有大量細小色彩漸層時,調整尺寸後實際上可能會變大,因為全新調色盤必須配合每一幀的新外觀。具有乾淨背景的純色畫面則幾乎一定會縮小。
由於結果取決於內容而非調整尺寸本身,正確的工作流程是先調整尺寸,再讀取顯示的位元組數,最後才決定是否要再套用獨立的最佳化步驟。這個頁面會告訴你實際的輸出大小,而不是承諾某個百分比的縮減,讓你不必憑猜測就能做出決定。
挑選合適的目標寬度
寬度輸入是你唯一設定的數字,因此問題通常會落在這個 GIF 預計在哪裡播放。以下這個簡短對照列出一些常見用途。所顯示的數字為典型的起始寬度;確切的輸出尺寸始終取決於你的來源畫布比例。
| 目標用途 | 典型寬度 | 為什麼選擇這個寬度 |
|---|---|---|
| 文件縮圖 | 160 到 240 px | 小到足以放在內文旁而不會主宰整個頁面。 |
| 聊天頭像與內嵌反應圖 | 64 到 128 px | 訊息客戶端與小型內嵌反應圖的常見頭像尺寸。 |
| Discord emoji 欄位 | 32 到 128 px | Discord 讀取 GIF 的畫布大小,而非其位元組數。 |
| 電子郵件簽名 | 80 到 150 px | 小畫布能快速渲染,並維持在多數郵件客戶端的資料上限內。 |
| 簡報與訓練文件 | 480 到 800 px | 符合投影時典型簡報投影片的寬度。 |
挑選 GIF 播放位置所需的寬度,然後讓頁面計算對應的高度。如果來源畫布是 800 × 600,而你輸入 400,計算出的高度為 400 × (600 ÷ 800) = 300,因此輸出為 400 × 300。高度會四捨五入為整數像素,這是 GIF 格式實際能儲存的最小單位。
這個頁面也強制設定明確的上限,以避免瀏覽器耗盡記憶體。檔案最多 20 MB,邏輯畫布任一邊最多 4,096 像素,每幀像素數最多三百萬像素,動畫最多可包含 50 張圖片幀。任何超出上限的檔案會在配置大型輸出畫布之前就被擋掉,因此這個頁面絕不會產生部分下載或讓分頁凍結。不需要帳號,不會上傳任何東西,分頁關閉後也不會保留任何內容。
延伸閱讀:GIF 太大無法傳送?把幀擷取為 PNG。