ロスレス アルファ ギャラリー

このギャラリーの内容

このギャラリーでは、2 つの新しい WebP モードを紹介するサンプル画像をいくつか紹介します。 アルファ付き WebP-lossless および WebP-lossy（透明性サポート）。

並べて比較

下の表は PNG 画像（pngcrush と pngout で圧縮）を示しています。 WebP の可逆画像と WebP 非可逆画像（アルファ版による Side-by-Side） あります画像は、通常と同様に、チェック柄の背景に重ねて表示されます。 画像処理ソフトウェアで行われます

なお、Google では、アルファ版と WebP 形式の WebP 非可逆圧縮形式の WebP 画質 90 を 画像の品質をデフォルト品質に変換できます。詳しくは、 詳細については、画像の再現セクションをご覧ください。

PNG に変換されていない WebP 画像が表示されます。これは、 WebP をレンダリングできます対応ブラウザをお持ちの場合は、 WebP ファイルへのリンクは下記をご覧ください。また、このページの画像は 縮小されています。画像をクリックするとフルサイズで表示されます 説明します。

この表には、各モードで取得される画像サイズも記載されています。

PNG	WebP ロスレス	WebP-lossy（アルファ版あり）
"イエローローズ"1
<ph type="x-smartling-placeholder"></ph> PNG で最適化されたファイルサイズ: 110.7 KB	<ph type="x-smartling-placeholder"></ph> WebP 可逆ファイルサイズ: 79.9 KB	<ph type="x-smartling-placeholder"></ph> WebP-lossy（アルファ版）ファイルサイズ: 17.7 KB
「ユーザー用のベビータキスのページ」 2
<ph type="x-smartling-placeholder"></ph> PNG で最適化されたファイルサイズ: 38.1 KB	<ph type="x-smartling-placeholder"></ph> WebP 可逆ファイルサイズ: 27.0 KB	<ph type="x-smartling-placeholder"></ph> WebP-lossy（アルファ付き）ファイルサイズ: 13.8 KB
"PNG の透明度のデモ" 3
<ph type="x-smartling-placeholder"></ph> PNG で最適化されたファイルサイズ: 213.5 KB	<ph type="x-smartling-placeholder"></ph> WebP 可逆ファイルサイズ: 149.0 KB	<ph type="x-smartling-placeholder"></ph> WebP-lossy（アルファ付き）ファイルサイズ: 51.6 KB
"グレゴール メンデル生誕 189 周年" 4
<ph type="x-smartling-placeholder"></ph> PNG で最適化されたファイルサイズ: 49.2 KB	<ph type="x-smartling-placeholder"></ph> WebP 可逆ファイルサイズ: 33.2 KB	<ph type="x-smartling-placeholder"></ph> WebP-lossy（アルファ付き）ファイルサイズ: 18.3 KB
「オーバーレイ用の透明なコンパス カード」 5
<ph type="x-smartling-placeholder"></ph> PNG で最適化されたファイルサイズ: 126.8 KB	<ph type="x-smartling-placeholder"></ph> WebP 可逆ファイルサイズ: 97.1 KB	<ph type="x-smartling-placeholder"></ph> WebP-lossy（アルファ付き）ファイルサイズ: 57.3 KB

以下は WebP ファイルへのリンクです（Chrome 22 以降で表示可能）。

画像クレジット

このページの画像は、さまざまな情報源から提供されています。クレジット: 上の画像は、この順番でここにリストされています。

画像の再現

再現性のため、および一部の 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

大きなソース画像（表示専用）の一部を再スケーリングするために、 ImageMagick のツール（convert）の最新バージョン（次の URL から入手できます） https://www.imagemagick.org.正確なコマンドラインは次のとおりです。

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-lossy への圧縮（アルファ版あり）

PNG を WebP-lossy（アルファ付き）に変換するために cwebp ツールを使用しました。選択内容: WebP 品質 90（非可逆圧縮）、アルファ品質 100（可逆圧縮） です。使用した具体的なコマンドラインは次のとおりです。

cwebp input.png -q 90 -alpha_q 100 -m 6 -o webp_alpha.webp

WebP-lossy のレンダリング（アルファ版あり）

そこで dwebp ツールを使用して、WebP-lossy（アルファ付き）画像を PNG に戻しました。 説明します。使用した具体的なコマンドラインは次のとおりです。

dwebp webp_alpha.webp -o output.png