このギャラリーのコンテンツ
このギャラリーでは、WebP の 2 つの新しいモードである WebP 可逆モードと、アルファ付き WebP 可逆モード（透明度のサポート）を紹介するサンプル画像をいくつか紹介します。
並べて比較
以下の表に、PNG 画像（pngcrush と pngout で圧縮済み）、WebP 可逆圧縮画像、WebP 可逆圧縮画像（アルファ付き）を並べて比較しています。画像は、通常、グラフィック ソフトウェアで行われるように、市松模様の背景に重ねて表示されます。
Google では、WebP 非可逆画像には WebP 品質 90 を使用し、アルファ画像および WebP 可逆画像のデフォルト品質は 90 を使用しています。詳細については、イメージの再現セクションをご覧ください。
WebP をレンダリングできないブラウザには、PNG に戻された WebP 画像が表示されます。互換性のあるブラウザを使用している場合は、以下の WebP ファイルへのリンクをご覧ください。また、見やすくするため、このページの画像は縮小されています。画像をクリックすると、フルサイズの画像が表示されます。
この表には、各モードで得られる画像サイズも示されています。
PNG | WebP ロスレス | WebP-lossy（アルファ版） |
|---|---|---|
| "イエロー ローズ" 1 | ||
 PNG 最適化ファイルサイズ: 110.7 KB |
 WebP ロスレス ファイルサイズ: 79.9 KB |
 WebP-lossy（アルファ版）ファイルサイズ: 17.7 KB |
| 「ユーザーページの baby tux」2 | ||
 PNG 最適化ファイルサイズ: 38.1 KB |
 WebP ロスレス ファイルサイズ: 27.0 KB |
 WebP-lossy（アルファ版）ファイルサイズ: 13.8 KB |
| 「PNG の透明度のデモ」3 | ||
 PNG 最適化ファイルサイズ: 213.5 KB |
 WebP ロスレス ファイルサイズ: 149.0 KB |
 WebP-lossy（アルファ版）ファイルサイズ: 51.6 KB |
| 「グレゴール メンデル生誕 189 周年」 4 | ||
 PNG 最適化ファイルサイズ: 49.2 KB |
 WebP ロスレス ファイルサイズ: 33.2 KB |
 WebP-lossy（アルファ版）ファイルサイズ: 18.3 KB |
| 「オーバーレイ用の透明なコンパスカード」5 | ||
 PNG 最適化ファイルサイズ: 126.8 KB |
 WebP ロスレス ファイルサイズ: 97.1 KB |
 WebP-lossy（アルファ版）ファイルサイズ: 57.3 KB |
以下は、WebP ファイルへのリンクです（Chrome 22 以降で表示可能）。
| "Yellow Rose": | WebP 可逆圧縮ファイル（80.1 KB） | WebP-lossy（アルファ版）ファイル（18.4 KB） |
| "baby tux for my user page": | WebP 可逆ファイル（27.0 KB） | WebP-lossy（アルファ版）ファイル（14.1 KB） |
| "PNG Transperancy demonstration": | WebP 可逆ファイル（149.1 KB） | WebP-lossy（アルファ版）ファイル（52.6 KB） |
| 「グレゴール メンデル生誕 189 周年」: | WebP 可逆ファイル（33.3 KB） | WebP-lossy（アルファ版）ファイル（19.0 KB） |
| 「オーバーレイ用の透明なコンパスカード」: | WebP 可逆ファイル（97.1 KB） | WebP-lossy（アルファ版）ファイル（57.3 KB） |
画像クレジット
このページの画像は、さまざまなソースからのものです。上の画像に対するクレジットは、ここに記載の順番です。
| 1 |
「高解像度の無料ストック写真 - イエロー ローズ 3 - 花」 画像の作成者: Jon Sullivan このファイルはパブリック ドメインです。 JPEG ソース |
| 2 |
「baby tux for my user page」 画像の作成者: Fizyplankton このファイルはパブリック ドメインです。 PNG ソース |
| 3 |
「PNG 透過性のデモ」 画像の作成者: POV-Ray ソースコード 写真は クリエイティブ・コモンズ ライセンスに基づいて使用が許可されています。 表示 - 継承 3.0 非移植。 PNG ソース |
| 4 |
「グレゴール メンデル生誕 189 周年」 画像の作成者: Google Doodle チーム この画像は Google Doodle チームのおかげです。 PNG ソース |
| 5 |
「オーバーレイ用の透明なコンパスカード」 画像の作成者: Denelson83 このファイルは、 クリエイティブ・コモンズ 表示 - 継承 3.0 非移植 ライセンスに基づいて使用が許諾されています。 PNG ソース |
イメージの再現
再現性を確保し、いくつかの WebP 圧縮パラメータの使用を示すために、このギャラリーで画像を生成する際の具体的な手順を説明します。
ツール
PNG 再圧縮には、pngcrush 1.8.13 と ZopfliPNG 1.0.3 の最適な結果が使用されます。次のコマンドライン オプションが使用されます。
pngcrush:
pngcrush -brute -rem tEXt -rem tIME -rem iTXt -rem zTXt -rem gAMA -rem cHRM -rem iCCP -rem sRGB -rem alla -rem text input.png output-candidate.png
ZopfliPNG:
zopflipng --lossy_transparent input.png output-candidate.png
すべてのフィルタを含む ZopfliPNG:
zopflipng --iterations=500 --filters=01234mepb --lossy_8bit --lossy_transparent input.png output-candidate.png
（表示専用で）サイズの大きなソース画像をサイズ変更するために、https://www.imagemagick.org から入手できる convert という ImageMagick のツールの最新版を使用しました。正確なコマンドラインは次のようになります。
convert image.png -resize 240x image_resized.png
WebP ロスレスへの圧縮
PNG を WebP 可逆変換するために、cwebp ツールの「可逆圧縮」オプションを使用しました。最小限の出力を得るために使用した正確なコマンドラインは次のとおりです。
cwebp input.png -lossless -m 6 -q 100 -o webp_lossless.webp
WebP 可逆レンダリング
dwebp ツールを使用してレンダリングし、WebP 可逆画像を PNG に戻しました。使用された正確なコマンドラインは次のとおりです。
dwebp webp_lossless.webp -o output.png
WebP ロッシーへの圧縮（アルファを使用）
cwebp ツールを使用して PNG を WebP ロッシー（アルファ付き）に変換しました。WebP 品質は 90（非可逆圧縮）、アルファ品質は 100（可逆圧縮）を選択しました。使用された正確なコマンドラインは次のとおりです。
cwebp input.png -q 90 -alpha_q 100 -m 6 -o webp_alpha.webp
WebP ロッシーのレンダリング（アルファ版）
dwebp ツールを使用してレンダリングを行い、WebP ロッシー（アルファ付き）画像を PNG に変換しました。使用された正確なコマンドラインは次のとおりです。
dwebp webp_alpha.webp -o output.png