簡短回答:為了相容性把 AVIF 轉成 JPG,為了透明度轉成 PNG
如果你下載了一份 .avif 檔案卻打不開,解決辦法通常很簡單:
- 照片、郵件附件、頭像、列印訂單、電商刊登、CMS 上傳、政府表單,以及任何主要只想要一份普通圖片檔的場合,使用 JPG。
- Logo、螢幕截圖、圖示、貼圖、商品去背、UI 稿以及任何帶透明背景的內容,使用 PNG。
- 影像留在現代網站上,而該網站已為舊流程準備了 JPG、PNG 或 WebP 備援,就繼續用 AVIF。
最後一點很重要。AVIF 不是一種壞掉的格式。它是一種為 Web 而生、非常有效率的影像格式,支援有損與無損壓縮、透明度、動畫、廣色域與 HDR。問題往往出現在檔案離開瀏覽器之後。網頁能乾淨地顯示 AVIF,同一份檔案卻可能被列印終端、舊版設計軟體、求職表單,或是 AVIF 尚未普及之前搭建的 CMS 欄位拒絕。
所以實際要問的不是「AVIF 好不好?」,而是「這份檔案接下來到底要去哪裡?」。
為什麼 AVIF 檔案現在更常見了
AVIF 是 AV1 Image File Format 的縮寫。它把靜態影像用 AV1 壓縮裝進一個影像容器裡。用大白話說:它能讓網頁圖片明顯變小,同時看起來不會明顯變差。
因此,圖片 CDN、建站工具和注重效能的網站,越來越常向支援的瀏覽器分發 AVIF。更小的影像可以減輕頁面重量、改善感知速度,並讓重要元素更早呈現。MDN 與 web.dev 都建議:在相容性重要的場景裡,配合備援影像使用 AVIF、WebP 這類現代格式。
對瀏覽者來說這很棒;不那麼棒的是當你在網站上右鍵儲存商品圖、下載參考圖、在聊天裡收到一張 AVIF,或從現代流程匯出素材後,需要把它用在一個平淡無奇的場合。
常見的「為什麼打不開?」情境包括:
- 學校、簽證、求職或政府的上傳表單只列出 JPG、JPEG、PNG、PDF。
- 列印服務接受 JPG 照片,卻拒絕原始的 AVIF。
- 同事在受管控的公司筆電上無法預覽這份檔案。
- 較舊的影像編輯器能匯入 PNG 和 JPG,卻讀不懂 AVIF。
- 郵件用戶端把 AVIF 當成附件寄出去,而不是內嵌預覽。
- 電商平台的圖片上傳工具先檢查副檔名,再看真正的檔案內容。
iPhone 的 HEIC 檔案也會遇到類似的流程問題:格式本身也許技術過硬,但接收系統仍然挑剔。
AVIF → JPG 還是 AVIF → PNG,依目的地來選
不要憑習慣選 JPG 或 PNG。根據下一個應用或對方需要什麼來選。
| 你接下來要做什麼 | 最佳輸出 | 原因 |
|---|---|---|
| 用郵件寄一張普通照片 | JPG | 夠小、常見、方便預覽 |
| 上傳頭像或證件類照片 | JPG | 多數表單對照片期望 JPEG/JPG |
| 下列印訂單 | JPG | 沖印店與列印平台通常對 JPG 處理得很好 |
| 儲存透明背景的 Logo | PNG | JPG 會移除透明 |
| 匯出貼圖、去背或疊加層 | PNG | 能保留 alpha 通道 |
| 分享含文字與 UI 線條的螢幕截圖 | PNG | 邊緣比 JPG 更乾淨 |
| 準備網頁圖片 | 通常保留 AVIF,並配備援 | 現代瀏覽器上壓縮更有效率 |
| 封存最初下載的檔案 | AVIF 也一併保留 | 轉換只是產生副本,並不會得到更好的母檔 |
一句話總結:
- JPG 是照片類的相容性格式。
- PNG 是圖形類的相容性格式。
- AVIF 大多數情況下是現代網站的交付格式。
AVIF vs WebP 更詳細地討論了 Web 分發的取捨,但就轉換這一件事來說,多數時候上面的表格就夠了。
在 PhotoTools 中把 AVIF 轉成 JPG
PhotoTools 在你的瀏覽器中本地轉換 AVIF。也就是說,影像在你的裝置上被解碼並重新編碼,而不是被上傳到伺服器。對於私人照片、螢幕截圖、文件、客戶素材與內部設計檔案,這就是選擇瀏覽器本地轉換工具而不是隨便一個上傳工具的主要理由。
產生一份 JPG 副本:
- 開啟 AVIF → JPG 轉換工具。
- 把一個或多個
.avif檔案拖到頁面上。 - 保持輸出格式為 JPG。
- 品質預設保持在 90 % 左右。
- 點擊 轉換。
- 逐個下載檔案,或把整批打包成 ZIP 下載。
對多數照片來說,90 % 是低調的中間值:夠高,讓結果仍然像原圖;也夠低,讓檔案不會毫無理由地變大。
當目的地對檔案大小有嚴格限制、你又只是分享一張隨手拍的照片時,可以用 80–85 % 這樣更低的值;當檔案要交給客戶、進入列印流程,或對方可能會裁切或仔細看時,可以用 95 % 這樣更高的值。不要把 100 % 當成「魔法品質」——它可能讓檔案明顯變大,卻不會讓下載來的 AVIF 明顯更「原生」。
需要透明時把 AVIF 轉成 PNG
當檔案包含透明像素或銳利的圖形細節時,選擇 PNG。包括:
- 透明背景上的 Logo。
- 商品去背。
- 貼圖與疊加層。
- 含小號文字的螢幕截圖。
- UI 稿。
- 圖示、徽章、示意圖。
- 會疊在另一份設計之上的影像。
產生 PNG 副本,請開啟 AVIF → PNG 轉換工具,拖入 AVIF 檔案,轉換後下載 PNG。
PNG 不使用與 JPG 相同的品質滑桿邏輯。對解碼後的像素而言,它是一種無損匯出格式,因此擅長保留邊緣與透明。代價是體積。一張很小的 AVIF 照片可能變成非常大的 PNG——PNG 並不像 AVIF 或 JPG 那樣是為壓縮照片細節而設計的。
如果匯出的 PNG 看起來非常大,在壓縮它之前先問自己一個問題:這張圖真的需要透明嗎?如果不需要,一份 JPG 副本通常是更合適的相容性檔案;如果需要,就保留 PNG,只有當接收端有大小限制時才縮小尺寸。
透明背景會發生什麼
許多 AVIF 轉換失手的地方就在這裡。
AVIF 能保存透明。PNG 能保存透明。JPG 不能。
把一張帶透明的 AVIF 轉成 JPG 時,透明像素必須變成普通像素。取決於匯出工具與檢視器,結果可能出現在白色、黑色或其他純色背景上。就算在白色頁面上的預覽看起來還行,一旦有人把它放到彩色設計上,檔案也不會再是透明的。
用這個簡短的檢查:
- 如果影像是一張沒有透明去背的照片,JPG 沒問題。
- 如果影像要疊在另一個背景上,就用 PNG。
- 如果轉換後去背邊緣發白、發鋸齒或像被方框框住,請用 PNG 匯出,並在淺色與深色背景上都預覽一下。
這對商品圖、浮水印、創作者貼圖與 Logo 檔案尤其重要。在白色郵件裡沒問題的 Logo,放在深色投影片上可能就會顯得破損。
色彩、HDR 與廣色域會發生什麼
AVIF 能承載比基本 JPG 流程更進階的影像資料,在有能力的流程中甚至包括高動態範圍與廣色域。官方 AVIF 文件也描述了對透明度、動畫與分層影像等使用情境的支援。
在瀏覽器 canvas 上轉換時,瀏覽器會解碼來源影像、繪製可見像素、匯出一份新檔案。這對相容性來說很有用,但並不等同於保留原始 AVIF 容器的全部內容。HDR 或廣色域素材在一般檢視時可能會被色調對映或標準化,具體取決於瀏覽器、螢幕與匯出路徑。
對於日常的網頁下載與普通照片,這通常不是實際問題。很多時候,轉換後的 JPG 或 PNG 其實就是正確的實用輸出,因為接收端的應用本身也在期待一張普通的 SDR 影像。
以下情況請更謹慎:
- AVIF 來自專業的 HDR 工作流程。
- 你在準備電影、3D、產品配色或螢幕校正的素材。
- 你需要把這份檔案當作長期母檔。
- 接收方會比對精確的色彩數值,而不僅僅是看圖。
在這些情況下,請保留原始 AVIF,僅把 JPG 或 PNG 作為相容性副本匯出。
轉換後的檔案為什麼可能更大
大家預設轉換會讓檔案變小。對 AVIF 而言,常常反過來。
AVIF 已經高度壓縮。一張 300 KB 的 AVIF 照片,高品質 JPG 可能變成 700 KB,PNG 甚至可能到好幾 MB。這並不代表轉換工具出了問題,而是你把一種現代壓縮格式換成了相容性格式。
預期參考:
- AVIF → JPG: 通常比 AVIF 大,但對照片來說仍然合理。
- AVIF → PNG: 對照片通常大得多,但對透明圖形是對的。
- 保持為 AVIF: 用於現代 Web 分發時通常最好。
如果最終 JPG 對上傳表單來說太大,先降低 JPG 品質;如果仍然太大,再在轉換後縮小尺寸。檔案大小限制通常同時和壓縮率與像素數量有關。
2026 網站影像格式指南討論了什麼時候 AVIF 應當繼續留在 Web 流程裡,而不是被轉換掉。
批次轉換 AVIF 而不弄成一團亂
批次轉換很有用,但如果資料夾裡照片與圖形混在一起,就很容易做出錯誤的批次決定。
在轉換 50 個檔案之前,先掃一眼縮圖,把它們分成兩組:
- 照片、人像、商品圖、背景圖 → 轉成 JPG。
- Logo、螢幕截圖、圖示、貼圖、疊加層、透明去背 → 轉成 PNG。
然後做個小測試:
- 把一張照片以 90 % 轉成 JPG。
- 把一份透明或圖形檔案轉成 PNG。
- 開啟這兩份輸出。
- 檢查檔案大小、透明度與邊緣品質。
- 樣本看著沒問題,再去轉換其餘的。
PhotoTools 支援一次拖入多個 AVIF 並把結果打包成 ZIP 下載,所以慢的不是轉換本身,慢的是在建出一整個還得重做的資料夾之前,先選對目標格式。
隱私與詮釋資料
轉換工具在瀏覽器中執行。你的 AVIF 檔案在本地被解碼、繪製到 offscreen canvas 上,然後透過瀏覽器的影像匯出 API 輸出成新的 JPG 或 PNG blob。隱私上的實際好處很簡單:轉換過程中不需要把原始檔案上傳到伺服器。
這條重新編碼的路徑也意味著輸出是一份由像素重新拼成的新影像檔案。原始容器中內嵌的詮釋資料,例如相機資訊或其他非像素資訊,通常不會像那些會保留詮釋資料的桌面編輯器那樣被完整帶過來。
在你想要一份乾淨的相容性副本時,這一點很方便;但它並不能取代封存式的工作流程。如果原始詮釋資料很重要,請保留 AVIF。
PhotoTools 也有一份獨立的詮釋資料指南,可以在分享之前檢查照片裡都包含什麼。
AVIF 轉換問題排解
AVIF 在轉換工具裡載入不出來。
試試新版本的 Chrome、Edge、Safari 或 Firefox。若仍然失敗,檔案可能是損毀、不完整、副檔名有誤,或以瀏覽器無法解碼的方式編碼的。
JPG 出現了白色或純色背景。
如果原圖帶透明,這是預期結果。改為匯出 PNG。
轉換後的 JPG 太大。
把 JPG 品質降到 85 % 左右,然後在人們實際看到的尺寸下檢查影像。若仍然太大,就縮小影像尺寸。
PNG 巨大無比。
PNG 大概不是整張照片的正確輸出。沒有透明就用 JPG;只有當透明或銳利的圖形邊緣重要時才用 PNG。
顏色看起來不一樣。
把 AVIF 作為來源保留,換一個瀏覽器再試,並在目的地應用中測試檔案。若影像來自 HDR 或廣色域流程,相容性用的 JPG 或 PNG 可能無法保留相同的外觀。
上傳表單仍然拒絕轉換後的檔案。
檢查副檔名、檔案大小、像素尺寸與色彩模式要求。有些表單會拒絕有效的影像檔案,只因為超出大小上限或尺寸不在允許範圍內。
轉換完還要留著 AVIF 嗎?
通常要留。
把 JPG 和 PNG 當作交付副本:它們為某個特定目的地解決相容性問題,但並不會讓原始 AVIF 變得更好,JPG 的匯出也不是母檔。
以下情況請保留 AVIF:
- 檔案來自你自己的匯出流程。
- 之後可能還要做另一版。
- 影像是現代網站的一部分。
- 你在意 Web 分發的最小體積。
- 來源檔案可能包含你不想失去的透明、HDR、廣色域或詮釋資料。
只有當它本就只是一份圖方便的下載檔案、你也只需要轉換後的副本時,才刪掉 AVIF。
參考的技術資料
本指南依照下列一手資料與面向開發者的資料重新檢視:
- Alliance for Open Media 的 AVIF 概述 —— 透明、HDR、廣色域、動畫與瀏覽器支援等能力。
- AV1 Image File Format v1.2.0 規範 —— 容器與功能的正式模型。
- MDN 影像檔案類型與格式指南 —— 面向瀏覽器視角的格式行為與備援建議。
- web.dev 影像效能指南 —— 在搭配相容備援的前提下使用 AVIF 等現代格式。
- MDN OffscreenCanvas convertToBlob() 文件 —— 瀏覽器端影像匯出行為。
用大白話概括:優化網站時保留 AVIF;普通照片要在保守流程裡運作時轉成 JPG;透明或銳利的圖形細節重要時轉成 PNG。