PNG 轉 JPG,在瀏覽器裡讓照片更輕

寄信、發文或想省空間時,用一張較輕的 JPG 換掉笨重的 PNG。

或將圖片拖放至此

關於此工具

帶來一張圖片,瀏覽器就在你自己的機器上料理,什麼都不傳送。帶來多張時,它們會前往我們的伺服器,由它完成工作並回傳一個約 2 小時內刪除的連結。Araluma 在你自己的裝置上把 PNG 變成 JPG,所以這張圖從不被送到任何地方。 把檔案丟進來,瀏覽器內建的影像引擎就會把它重建成 JPEG,一般照片通常只要不到一秒。 由於 JPEG 無法存放透視像素,任何透明區域在寫檔前都會被塗上白色填充。 對照片而言,你可以預期 JPG 大約比它來源的 PNG 輕了三分之一到一半,而那個細節落差你的眼睛不會察覺。 在一次量測裡,一張 17 KB 的照片 PNG 在約 10 毫秒內變成 12 KB 的 JPG,而一張 116 KB 的照片接近 1.5 秒。 EXIF、IPTC 和 XMP 這類內嵌標籤會在過程中被丟掉。 當主體是照片、而且重量要緊時,就選它。 當透明度必須留存時,就保留 PNG(或挑 WebP)。

如何把 PNG 轉成 JPG

如何把 PNG 轉成 JPG

把一張 PNG 拉進放置區,或點一下去瀏覽挑一張。檔案一抵達工作就開始,一般螢幕大小的照片幾乎瞬間就完成。接著一個下載按鈕會用來源名稱加上新副檔名把 JPG 寫出來。要再做一張嗎?丟下一個檔,它就重新跑,後面沒有等待隊伍。同一條路徑同時服務手機和桌機。如果你交給它一張動態 PNG,只會留下開頭那一格,因為它產生的 JPG 是單張靜態影像而非序列。

透明區域會怎麼樣

透明區域會怎麼樣

JPG 裡沒有 alpha 通道,所以透明像素沒辦法就這樣帶過去。每一個都得先被給定一個真實顏色,而 Araluma 把它們塗成白色。這就是商標或去背商品照變成 JPG 後,後面那塊熟悉白色矩形的來源。沒出什麼錯,這只是格式所允許的。想要不同的背景嗎?轉換前先在編輯器裡鋪上那個顏色。想讓透明度留下嗎?跳過 JPG,改轉成 WebP,它保有完整的 alpha 通道,而且通常還比原本的 PNG 更小,完全不必填平。

PNG 還是 JPG,哪種格式適合你的圖

PNG 還是 JPG,哪種格式適合你的圖

手裡握著標誌、小圖示、填滿清晰字句的擷圖、線描,或任何日後還會再請出來的通透素材時,就投 PNG 一票。它分毫不差地把每顆像素記下,稜線因此俐落如初,反覆動工也不會層層堆上嶄新的壓縮雜訊。可一旦主角換成相片、橫幅長條,或那種一抵達社群動態便又遭重壓的上傳圖,那就改投 JPG。把相片存成 PNG,份量遠遠超出分享所需,而 JPEG 偏偏就是衝著這類素材而生的。若你巴望小巧與通透兼得,WebP 兩樣都遞給你,而且眼下哪一款瀏覽器都讀得懂它。

畫質設定與檔案大小的取捨

畫質設定與檔案大小的取捨

JPG 捨去一部分末節去換取更輕的檔案,這正是有損這詞的含意。攤在一張相片上,這份捨棄在尋常的網頁畫質下幾乎察覺不出。存檔時瞄準的標的貼近四十三分貝的 PSNR,也就是攝影素材上,JPG 與無損母片在眼中看起來別無二致的那一點。可換成靠硬稜、蠅頭字、平塗色域,或一階階斷開的漸層拼起的畫面,故事就完全兩樣了,因為無論哪一格設定,JPG 都會繞著那些陡然的轉折灑出振鈴。那些畫面該歸 PNG 管,硬把它們轉過去等於開倒車。這裡也沒有滑桿好撥弄,每一趟跑的都是同一組為相片校準過、貼著無損的固定設定。

轉換在哪裡進行

轉換在哪裡進行

一切取決於你帶來多少個檔案。只有一張圖片時,整個過程都在分頁內透過瀏覽器自帶的影像引擎執行,什麼都不上傳。打開 DevTools,在單次轉換時盯住網路面板,你會數到零個攜帶照片的出站要求。一次帶來多張時,它們會前往我們的伺服器,由它完成工作並回傳一個下載連結。該連結以及背後的檔案會在約 2 小時內刪除。所以一張照片留在你的裝置上,而批次處理在我們的伺服器上料理,隨後被清空。請依圖片的私密程度選擇路徑。

什麼時候該保留 PNG

什麼時候該保留 PNG

有那麼幾種光景,會讓這趟轉換淪為一記失誤。倘若 PNG 仰仗著一塊你非守不可的通透底,JPG 一來便把它抹個精光,那就乾脆賴在 PNG 上,或挪去 WebP。倘若畫面主體是蠅頭字、鋒利線條、一枚標誌,或一幀擷下的操作介面,JPG 在每一級畫質都會撒上顯眼的振鈴,只因它那套切塊運算碰上乾淨稜線就左支右絀。再倘若你料想著要一改再改、存了又存,每回新寫一次 JPG 都會往上再鋪一層耗損,所以索性把 PNG 奉為母版,唯有趕在交付前的最末一步才匯出 JPG。

運作方式

  1. 交出一張 PNG

    把檔案丟進框裡,或點擊從資料夾中選取。只轉換一張,它留在你的機器上。新增多張,它們會前往我們的伺服器一起轉換。

  2. 放輕鬆

    沒別的事要你做。一張普通照片幾乎在你一放手就變成 JPG,看不到轉換鍵也看不到進度條。

  3. 瞄一眼大小

    結果會回報它出來有多大。PNG 裡原本透明的地方會冒出白色,這是一個沒辦法留住透明度的格式無法避免的特性。

  4. 留住你的 JPG

    輕點一下下載它就出來,同名,換成新副檔名。還有更多嗎。批次會作為一個壓縮檔回傳,連結會在約 2 小時內從我們的伺服器刪除。

常見問題

把 PNG 轉成 JPG 會降低畫質嗎?

的確會掉一點,畢竟有損是 JPG 與生俱來的脾性。不過 Araluma 把壓縮力道穩穩按在貼著無損的那條線、又特別替相片調過,因此換完的相片在常見的觀看尺寸下,看起來跟原本那張 PNG 沒兩樣。瞄準的水準大約是四十三分貝的 PSNR,到了這一格,在攝影素材上人眼已分不出它跟無損母片誰是誰。倒是那些靠犀利稜線、纖細字母或單調色塊撐起來的畫面,在哪一檔設定下都可能沾上若隱若現的雜訊,這類東西不如就讓它待在 PNG。

我把 PNG 轉成 JPG 時,透明區域會怎樣?

通透這回事 JPG 壓根裝不下,於是每一顆原本看得穿的像素在換檔時都被刷成了白。一枚擺在通透底上的標誌或商品,最後就這樣端坐在一方白底之中,原因正在於此。這屬於常態,並非毛病。想閃過它,要嘛動手在編輯器先替底鋪上想要的顏色,要嘛改投 WebP 的懷抱,後者保得住通透,而且往往打從一開頭就比那張 PNG 更輕巧。

JPG 會小多少?

換成相片來談,在這種貼著無損的水準下,JPG 一般會比 PNG 瘦掉三成到一半。究竟瘦多少得看畫面本身,越熱鬧、越多枝微末節的相片回收的空間越大。換作平塗的圖樣、小圖示與線描,能省下的就少得多,搞不好還因為 JPG 的雜訊顯得更毛躁。要是你那張 PNG 一出生就是螢幕擷取或一枚標誌,這趟轉換大概省不到哪去,反倒搭上肉眼可見的畫質折扣。

在這裡把 PNG 轉成 JPG 安全嗎?

這取決於你帶來多少個檔案。轉換一張時照片永遠不離開瀏覽器,全部工作在你的裝置上執行且不上傳,你可以在 DevTools 中透過單次轉換時追蹤網路面板來確認。一次帶來多張時,它們會前往我們的伺服器接受料理,隨後下載連結及背後的檔案會在約 2 小時內刪除。如果圖片私密,請逐張轉換,讓它們留在你的機器上。

我可以一次把多個 PNG 檔轉成 JPG 嗎?

可以。放入一疊檔案,Araluma 會一起轉換並回傳一個壓縮檔。批次處理在我們的伺服器上而非分頁中料理,下載連結會在約 2 小時內刪除。而單獨一個檔案則直接在瀏覽器中轉換,什麼都不傳送。無論哪種,每次轉換都很快。

我什麼時候該留著 PNG 而不轉成 JPG?

當你少不了那份通透、當畫面馱著一旦遇上 JPG 就會糊掉的清晰字句或線描,又或是你打算一改再改、存了又存的時候,就把 PNG 牢牢攥在手裡。JPG 每被重新存一次,都會偷偷把更多耗損疊上去。讓 PNG 充當你的工作母版,唯獨到了最終交付那一刻才捻出一張 JPG。至於某個網頁素材既盼著小巧又得保住完整通透時,比起兩者,WebP 才是更精明的輸出選項。

詳細資訊

團隊關於工藝、格式以及一個好的圓形裁剪背後小決定的筆記。

為什麼照片型 PNG 這麼大
PNG 承諾記下每一個像素而不損失任何一個,而這個承諾在一張照片上代價昂貴。面對數百萬個輕輕位移的色調,幾乎沒有什麼讓壓縮器能去預測或收攏,於是檔案膨脹起來。一張普普通通的 1600x1200 照片存成 PNG 可能坐在 3 到 5 MB,然而同一張影像存成品質 85 的 JPEG 卻塞進 200 到 400 KB。這個差別歸結到 JPEG 倚靠的餘弦轉換,它把影像切成 8x8 區塊,甩掉眼睛幾乎不會留意到的高頻細節,再把剩下的緊緊打包。連續色調的素材,也就是幾乎所有攝影,都大幅縮水。PNG 的完美忠實度在平坦圖形和半成品上掙得它的價值,但對一張你打算分享的照片來說,它就是錯誤的包裝。
透明度與 alpha 通道
一個 8 位元的 alpha 通道讓 PNG 能逐像素記下任何不透明程度,從完全透明到完全實心。JPG 沒有提供這樣的欄位,所以透明度無處安身。當影像引擎把 PNG 重建成 JPEG 時,它先把這張圖鋪在一個選定的背景上,而那個背景預設為白色,這正是為什麼透明區域之後讀起來是白的。結論很直白,一張透明的 JPG 無法存在,因為這個格式沒有這個概念。當去背必須留存時,WebP 或那張未動過的 PNG 是你僅有的路。Araluma 選定白色當填充,因為它融入這些 JPG 最常落腳的文件、投影片和店面列表裡。
實測的儲存效能
以下這些全來自 Linux 桌機上的 Chrome 148,倚靠瀏覽器自己的 JPEG 儲存。在 0.12 MP,一張 400x300 的縮圖約在 10 到 15 毫秒內包好。升到 0.78 MP,一張 1024x768 的影格,它落在接近 13 到 20 毫秒。一張 3840x2160 的 8 MP 照片需要約 1.4 秒,而即使是一張 8000x6000 的 48 MP 巨獸也只要求約 1.5 秒。用這種方式寫一張 JPG,輕鬆勝過寫同一張圖的 PNG,更徹底跑贏 AVIF,後者得載入一個獨立模組,在那張 48 MP 影像上就算在桌機都可能磨上 25 秒。合起來看,這是整個轉換家族裡最快的路線之一,而且抓取它不花額外成本,因為 JPEG 寫入器早就住在每個瀏覽器裡。
EXIF 與中繼資料的處理
先說色彩描述檔這條岔路。Chrome 連同 Safari 會把 sRGB 那份 ICC 描述檔安放在輸出裡,Firefox 偏偏把它跟旁的東西一道刮得精光。於是無論落在哪款瀏覽器,成品都站得穩 sRGB 這塊地。可你那張 PNG 若掛著 Display-P3 抑或 Adobe RGB 這號廣色域的牌子,這面牌子在 Firefox 手上就過不了關。再回頭看那一大票隨身標記。當這幀畫面被一磚一瓦重新砌起,每款瀏覽器都會把成品裡的 EXIF、IPTC 跟 XMP 抹得乾乾淨淨,衛星座標、相機是哪具身子、按快門那一瞬、著作權的隻字片語,外加母片 PNG 一路扛來的各色自訂欄位,全都隨之蒸發。萬一你的活兒非把那整疊資料死死攥牢不行,那便等收工後另請一件趁手的專門傢伙去拾掇。然而擱在尋常網頁與彼此分享的場合,這些牌子的失蹤倒成了一椿美事,一來替檔案刮去三兩分斤兩,二來把潛伏相片裡頭的方位線索一把掀了出來。
什麼時候會看到 JPG 瑕疵
JPEG 是以 8x8 的方塊為單位來盤算的。要是在同一方塊裡頭擱進兩個相去甚遠的顏色、中間還來個硬生生的跳變,JPEG 的壓縮便只能掏出寥寥幾個頻率項去描摹它,於是留下振鈴,亦即一圈貼著稜線、忽明忽暗的朦朧暈影。相片把這樁事遮掩得極好,皆因它們的邊界從不曾如刀刃般決絕,四下的細碎起伏又恰好把這份近似給蓋了過去。可一落到擷圖、標誌、框線分明的方盒、字母,或彼此緊挨的大片平塗色,它便在任何畫質下原形畢露,正因那恰是這套算式最招架不住的訊號。守則早已不言自明,讓擷圖、標誌與字句密布的圖遠遠避開 JPG。要嘛留它們在 PNG 裡,要嘛挪去 WebP,換得一個把振鈴繞得一乾二淨的清瘦檔案。
隱私與工作落在何處
工作落在何處取決於數量。對單張圖片,什麼都不離開瀏覽器,而且幾秒內就能即時查看。打開 Chrome DevTools,切到網路面板,依 XHR 和 Fetch 篩選,然後轉換一個檔案。編碼執行時什麼都不出現。對兩個或更多,Araluma 會把它們傳送到我們的伺服器,由伺服器轉換、彙整結果並回傳下載連結。該連結和轉換後的檔案會在約 2 小時內刪除。單張路徑把一切留在裝置上、在網路之外,而批次則以一次了結許多檔案作為交換。對某件私密之物的截圖或標有你位置的照片,逐張轉換可讓它留在你的機器上,這是真切的差別,不是口號。