WebP 圖片庫

建議您使用支援 WebP 的瀏覽器瀏覽這個圖庫網頁,例如 Google Chrome、Opera

如果您無法存取 Google Chrome,請將圖片下載至 可與本機硬碟搭配使用 支援 WebP

JPEG 和 WebP 以及 PNG 來源的範例圖片檔

下表顯示經過縮放的 JPEG (位於左側) 和 WebP 圖片 (右圖) 方便您並排比較由於瀏覽器原本就支援 WebP 因此,我們不再按照推出時的做法,將 WebP 圖片放在 PNG 容器內。圖片 檔案大小完全一致按下 JPEG 和 WebP 縮圖,即可開啟 在新分頁中顯示大型圖片

縮圖下方的檔案大小會與圖片的檔案大小相對應 以及是否獲得點擊WebP 圖片小於 30% 而不是 JPEG 檔案

JPEG

WEBP

「挪威納粹,由 Breiskrednosi 提供。聯合國教科文組織世界 文化遺產」1 個

JPEG 檔案大小:43.84 KB
WebP 圖片
WebP 檔案大小:29.61 KB
「Kayaker at Ekstremsportveko 2010, Voss」。 2

JPEG 檔案大小:86.25 KB
WebP 圖片
WebP 檔案大小:59.18 KB
「Parkrun」的第 10 個畫面序列 3

JPEG 檔案大小:297.05 KB
WebP 圖片
WebP 檔案大小:198.38 KB
圖片:「A Wild Cherry (Prunus avium) in flower」 4

JPEG 檔案大小:251.03 KB
WebP 圖片
WebP 檔案大小:172.82 KB
圖片:消防呼吸「Jaipur Maharaja Brass Band」比利時 Chassepierre 比利時 5

JPEG 檔案大小:120.78 KB
WebP 圖片
WebP 檔案大小:80.76 KB

圖片來源

本頁圖片來自多個不同來源。我們 選出一些令人愉悅、豐富的圖片來展示 WebP 的特質。 Lena、Baboon 等知名經典圖像,常用於運動 可惜的是,這類格式比較沒有著作權。

上圖的製作人員清單會依序列出。

1 分 「挪威納粹,由 Breiskrednosi 提供。聯合國教科文組織世界遺產」
圖片作者:Kjetil Birkeland Moe
在獲得作者許可的情況下重製。
PNG 來源
網誌文章,作者為 JPEG 和 WebP 的比較結果。滑鼠 懸停可啟動範例。
2 分 「Kayaker at Ekstremsportveko 2010, Voss」
圖片作者:Kjetil Birkeland Moe
在獲得作者許可的情況下重製。
PNG 來源
網誌文章,作者為 JPEG 和 WebP 的比較結果。滑鼠 懸停可啟動範例。
3 分 「Parkrun」的第 10 個畫面序列
圖片製作人:Lars Haglund、SVT Sveriges Television AB
經製作者權限重製
PNG 來源
4 分 圖片:"A Wild Cherry (Prunus avium) in flower
圖片作者:Benjamin Gimmel
PNG 來源
根據 創用 CC 歸因 - 相同方式共用 3.0 未移植授權。
5 分 圖片:消防呼吸「Jaipur Maharaja Brass Band」比利時 Chassepierre 比利時
作者:Luc Viatour
PNG 來源
根據 創用 CC 歸因 - 相同方式共用 3.0 未移植授權。
作者網站:www.lucnix.be

重現映像檔

為方便重現,以及示範某些 WebP 的用法 這段文字詳細說明 產生這個圖片庫中的圖片

工具

為了轉換及縮放來源圖片,我們使用最新版本的 ImageMagick 的工具名為 convert,請前往 https://www.imagemagick.org。 版本資訊如下所示:

Version: ImageMagick 6.5.7-8 2010-12-02 Q16 https://www.imagemagick.org

針對 JPEG 壓縮,我們使用 IJG 的參考編碼器 8b 版本, 請造訪 https://www.ijg.org/files/jpegsrc.v8b.tar.gz

版本資訊如下所示:

Independent JPEG Group's CJPEG, version 8b  16-May-2010
Copyright (C) 2010, Thomas G. Lane, Guido Vollbeding

產生來源 PNG 圖片

首先,使用以下指令,JPEG 來源能夠無損壓縮為 PNG 格式:

convert in.jpg out.png

接著,將大型來源圖片重新調整為較小寬度 1024 像素 使用以下指令:

convert in.png -depth 16 -gamma 0.454545 -filter lanczos -resize 1024 -gamma 2.2 -depth 8 out.png

產生最終一組 PNG 圖片

正在壓縮為 JPEG 格式

JPEG 的編碼器 (cjpeg) 可接收 PPM 格式的輸入圖片。我們會將 convert 用於以下目的: 以便產生憑證完整的轉換順序為:

convert in.png tmp.ppm
cjpeg -optimize -quality 80 -outfile out.jpg tmp.ppm

,產生最佳化 JPEG 檔案,品質係數為 80。

壓縮為 WebP 格式

我們指定比最佳化 JPEG 檔案更小的 30% 檔案大小。 因此,我們明確指定每張圖片的目標大小。 此外,我們也對個別篩選器的篩選強度設定臨時值 多虧了 cwebp 工具的 -f 選項。振幅 某些相片的空間雜訊形狀也會透過 -sns選項。使用的確切指令列如下:

cwebp -m 6 -f 50 -size 31500 1.png -o 1.webp
cwebp -m 6 -f 20 -sns 100 -size 62000 2.png -o 2.webp
cwebp -m 6 -sns 90 -size 213000 3.png -o 3.webp
cwebp -m 6 -f 40 -size 181000 4.png -o 4.webp
cwebp -m 6 -f 40 -size 89000 5.png -o 5.webp

整體而言,運用產生的 WebP 檔案讓全球節省了 32% 的成本 轉換成 JPEG 檔案

請注意,這個網頁使用的 WebP 縮圖也縮減了 26% 。