このページは Cloud Translation API によって翻訳されました。

WebP Container の仕様

はじめに

WebP は、（i）VP8 キーフレームエンコードを使用して画像データを非可逆的に圧縮するか、（ii）WebP 可逆エンコードを使用する画像形式です。これらの古い形式（例: JPEG、 GIF、PNG などですネットワークを介した高速な画像転送（ウェブサイトなど）に最適化されています。WebP 形式には同等の機能（カラープロファイル、メタデータ、アニメーションなど）を、他の形式と併用できます。このドキュメントでは、WebP ファイルの構造について説明します。

WebP コンテナ（WebP の RIFF コンテナ）を使用すると、WebP の基本的なユースケース（VP8 キーフレームとしてエンコードされた単一の画像を含むファイル）を超える機能のサポートが可能になります。WebP コンテナは、次の追加サポートを提供します。

ロスレス圧縮: WebP ロスレス形式を使用して、画像をロスレス圧縮できます。
メタデータ: 画像のメタデータが交換可能な画像ファイルに保存されていることがある形式（Exif）または拡張メタデータプラットフォーム（XMP）のいずれか。
透明度: 画像には透明度（アルファチャンネル）がある場合があります。
カラープロファイル: 画像には、International Color Consortium で説明されている ICC プロファイルが埋め込まれている場合があります。
アニメーション: 1 つの画像は、間に一時停止する複数のフレームを持つ場合があります。アニメーションにします。

命名

WebP コンテナを参照する場合は、次の型を使用することをおすすめします。

コンテナ形式名	WebP
ファイル名の拡張子	.webp
MIME-type	image/webp
ユニフォームタイプ ID	org.webmproject.webp

用語と基本

このドキュメントのキーワード「MUST」、「MUST NOT」、「REQUIRED」、「SHALL」、「SHALL NOT」、「SHOULD」、「SHOULD NOT」、「RECOMMENDED」、「NOT RECOMMENDED」、「MAY」、「OPTIONAL」は、ここで示すように、大文字でのみ表示される場合、BCP 14 RFC 2119 RFC 8174 に記載されているように解釈されます。

WebP ファイルには、静止画像（エンコードされたピクセルマトリックス）かアニメーションを使用できます。必要に応じて、透明情報、カラープロファイル、メタデータも含めることができます。ピクセルの行列を画像のキャンバスと呼びます。

チャンク図のビット番号は、最上位ビットが 0 から始まります。（MSB 0）です（RFC 1166 を参照）。

このドキュメント全体で使用されるその他の用語は次のとおりです。

読み取り / 書き込み: WebP ファイルを読み取るコードは「リーダー」と呼ばれ、書き込むコードは「ライター」と呼ばれます。
uint16: 16 ビットのリトルエンディアン符号なし整数。
uint24: 24 ビット、リトルエンディアン、符号なし整数。
uint32: 32 ビットのリトルエンディアンの符号なし整数。
FourCC: 4 文字のコード（FourCC）は、4 つの文字列を連結して作成される uint32 リトルエンディアン順の ASCII 文字。「aaaa」という意味です。（0x61616161）および「AAAA」（0x41414141）は異なる FourCCs として扱われます。
1 ベース: -1 でオフセットされた値を格納する符号なし整数フィールド。たとえば、このようなフィールドでは、値 25 が 24 として格納されます。
ChunkHeader('ABCD'): 個々のチャンクの FourCC と チャンクサイズ ヘッダーの記述に使用されます。ここで、ABCD はチャンクの FourCC です。この要素のサイズは 8 バイトです。

RIFF ファイル形式

WebP ファイル形式は、RIFF（リソース交換ファイル形式）ドキュメント形式に基づいています。

RIFF ファイルの基本要素はチャンクです。次の要素で構成されます。

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                         Chunk FourCC                          |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                          Chunk Size                           |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                         Chunk Payload                         :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

チャンク FourCC: 32 ビット: チャンクの識別に使用される 4 文字の ASCII コード。
チャンクサイズ: 32 ビット（uint32）: チャンクのサイズ（バイト単位）。このフィールド、チャンク ID、パディングは含まれません。
チャンクペイロード: チャンクサイズ（バイト）: データペイロード。[Chunk Size] が奇数の場合、1 バイトのパディングバイト（必須） RIFF に準拠するために 0 であること -- が追加されます。

注: RIFF には、大文字のみのチャンク FourCC はすべての RIFF ファイル形式に適用される標準チャンクであり、ファイル形式に固有の FourCC はすべて小文字であるという規則があります。WebP はこの規則に従っていません。

WebP ファイルヘッダー

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|      'R'      |      'I'      |      'F'      |      'F'      |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                           File Size                           |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|      'W'      |      'E'      |      'B'      |      'P'      |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

'RIFF': 32 ビット: ASCII 文字「R」、「I」、「F」、「F」。
ファイルサイズ: 32 ビット（uint32）: オフセット 8 から始まるファイルのサイズ（バイト単位）。次の最大値は、このフィールドは 2^32 から 10 バイトを引いた値であるため、ファイル全体のサイズは最大 4 GiB から 2 バイトを引いた値になります。
'WEBP': 32 ビット: ASCII 文字「W」、「E」、「B」、「P」。

WebP ファイルは、FourCC が「WEBP」の RIFF ヘッダーで始まる必要があります。ファイルサイズ以降のチャンクの合計サイズに 4 バイトを「WEBP」4 CC です。ファイルのデータの File Size で指定されます。リーダーは、末尾のデータは無視して、このようなファイルを解析する場合があります。チャンクのサイズは偶数であるため、RIFF ヘッダーによって指定されるサイズは調整できます。個々のチャンクの内容については、以降のセクションで説明します。

シンプルなファイル形式（不整合）

このレイアウトは、画像に非可逆エンコードが必要で、エンコードが不要な場合に使用するべきです。透明性など、拡張フォーマットで提供される高度な機能が必要になる。このレイアウトのファイルはサイズが小さく、古いソフトウェアでサポートされています。

シンプルな WebP（非圧縮）ファイル形式:

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                                                               |
|                    WebP file header (12 bytes)                |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                        'VP8 ' Chunk                           :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

「VP8」チャンク:

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('VP8 ')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                           VP8 data                            :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

VP8 データ: チャンクサイズ（バイト）: VP8 ビットストリームデータ。

「VP8」の 4 番目の文字はFourCC は ASCII スペース（0x20）です。

VP8 ビットストリーム形式の仕様については、VP8 Data Format and デコードガイドをご覧ください。なお、VP8 フレームヘッダーには VP8 フレームが含まれています。指定します。この値は、キャンバスの幅と高さとみなされます。

VP8 仕様では、画像を Y'CbCr 形式にデコードする方法について説明しています。RGB に変換するには、Recommendation BT.601 を使用する必要があります。アプリケーションは別の変換方法を使用できますが、視覚的な結果はデコーダによって異なる場合があります。

シンプルファイル形式（ロスレス）

注: 古いリーダーでは、ロスレス形式のファイルがサポートされていない場合があります。

このレイアウトは、画像が可逆エンコード（（オプションの透明性チャネル）であり、高度な機能を提供する必要はない示されています

シンプルな WebP（ロスレス）ファイル形式:

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                                                               |
|                    WebP file header (12 bytes)                |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                         'VP8L' Chunk                          :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

「VP8L」チャンク:

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('VP8L')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                           VP8L data                           :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

VP8L データ: チャンクサイズ（バイト）: VP8L ビットストリームデータ。

VP8L ビットストリームの現在の仕様については、WebP ロスレスビットストリーム形式をご覧ください。注: VP8L ヘッダーはこのオブジェクトには VP8L イメージの幅と高さが格納されています。これはキャンバスの幅と高さであると想定されます。

拡張ファイル形式

注: 古いリーダーでは、拡張形式を使用したファイルがサポートされていない場合があります。

拡張形式のファイルは次の要素で構成されます。

「VP8X」ファイルで使用されている機能に関する情報を含むチャンク。
オプションの「ICCP」カラープロファイルを持つチャンク。
オプションの「ANIM」アニメーション制御データを含むチャンク。
画像データ。
Exif メタデータを含むオプションの「EXIF」チャンク。
オプションの「XMP」XMP メタデータを含むチャンク。
不明なチャンクのリスト（省略可）。

静止画像の場合、画像データは単一のフレームで構成され、次で構成されます。

オプションのアルファサブチャンク。
ビットストリームサブチャンク。

アニメーション画像の場合、画像データは複数のフレームで構成されます。フレームについて詳しくは、アニメーションのセクションをご覧ください。

再構成と色補正に必要なすべてのチャンク、「VP8X」 'ICCP'、'ANIM'、'ANMF'、'ALPH'、'VP8'「VP8L」は、次の順序で指定しなければなりません。使用できます。再構成と色補正に必要なチャンクが順序どおりにない場合、リーダーは失敗する必要があります。

メタデータと不明なチャンクが順序が入れ替わって表示されることがあります。

理論的根拠: 再構築に必要なチャンクは、それにより、すべての画像を受け取る前に、読者が画像のデコードを開始できるようになります。できます。アプリケーションでは、実装に合わせてメタデータとカスタムチャンクの順序を変えるとメリットがあります。

拡張 WebP ファイルヘッダー:

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                                                               |
|                   WebP file header (12 bytes)                 |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('VP8X')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|Rsv|I|L|E|X|A|R|                   Reserved                    |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|          Canvas Width Minus One               |             ...
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
...  Canvas Height Minus One    |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

予約済み（Rsv）: 2 ビット: は 0 にする必要があります。リーダーはこのフィールドを無視しなければなりません。
ICC プロファイル（I）: 1 ビット: ファイルに「ICCP」チャンクが含まれている場合に設定します。
アルファ（L）: 1 ビット: 画像のフレームのいずれかに透明度情報を含めるかどうかを設定します（「アルファ版」）。
Exif メタデータ（E）: 1 ビット: ファイルに Exif メタデータが含まれているかどうかを設定します。
XMP メタデータ（X）: 1 ビット: ファイルに XMP メタデータが含まれているかどうかを設定します。
アニメーション（A）: 1 ビット: アニメーション画像であるかどうかを設定します。アニメーションを制御するには、「ANIM」と「ANMF」チャンクのデータを使用する必要があります。
予約済み（R）: 1 ビット: 0 でなければなりません。リーダーはこのフィールドを無視しなければなりません。
予約済み: 24 ビット: 0 でなければなりません。読者はこのフィールドを無視する必要があります。
キャンバス幅 - 1: 24 ビット: 1 を基準とするキャンバスの幅（ピクセル単位）。実際のキャンバス幅は 1 + Canvas Width Minus One です。
キャンバスの高さ - 1: 24 ビット: キャンバスの高さ（ピクセル単位、1 から始まる数値）。実際のキャンバスの高さは 1 + Canvas Height Minus One です。

キャンバスの幅とキャンバスの高さの積は、2^32 - 1 以下にする必要があります。

今後の仕様でフィールドが追加される可能性があります。不明なフィールドは無視しなければなりません。

アニメーション

アニメーションは「ANIM」によって制御されていますおよび「ANMF」チャンク。

'アニメーション'チャンク:

アニメーション画像の場合、このチャンクには作成します。

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('ANIM')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                       Background Color                        |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|          Loop Count           |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

背景色: 32 ビット（uint32）: キャンバスのデフォルトの背景色（青、緑、赤、アルファのバイトの順序）。この色は、フレーム周辺のキャンバス上の未使用のスペースや、最初のフレームの透明なピクセルを塗りつぶすために使用できます。背景色は、Disposal メソッドが 1 の場合も使用されます。

注:

背景の色が不透明なアルファ値であっても、含んでも構いません。「VP8X」の alpha フラグチャンクが設定されていない。
ビューアアプリケーションは、背景色の値をヒントとして扱う必要がありますが、使用する必要はありません。
キャンバスは各ループの開始時にクリアされます。背景色は行っても構いません見ていきましょう。

ループ数: 16 ビット（uint16）: アニメーションをループする回数。0 の場合は、次のことを意味します。あります。

このチャンクは、「VP8X」チャンクのアニメーション フラグが設定されている場合に表示する必要があります。Animation フラグが設定されておらず、このチャンクが存在する場合は、存在しなければなりません。無視されます。

「ANMF」チャンク:

アニメーション画像の場合、このチャンクには単一のフレームに関する情報が含まれます。 アニメーションフラグが設定されていない場合、このチャンクは存在すべきではありません。

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('ANMF')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                        Frame X                |             ...
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
...          Frame Y            |   Frame Width Minus One     ...
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
...             |           Frame Height Minus One              |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                 Frame Duration                |  Reserved |B|D|
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                         Frame Data                            :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

フレーム X: 24 ビット（uint24）

フレームの左上隅の X 座標は Frame X * 2 です。

フレーム Y: 24 ビット（uint24）

フレームの左上隅の Y 座標は Frame Y * 2 です。

フレーム幅 - 1: 24 ビット（uint24）

フレームの 1 を基準とした幅。フレームの幅は 1 + Frame Width Minus One です。

フレーム高さ - 1: 24 ビット（uint24）

フレームの高さ（1 ベース）。フレームの高さは 1 + Frame Height Minus One です。

フレーム継続時間: 24 ビット（uint24）

次のフレームを表示するまでの待機時間（1 ミリ秒単位）。 Frame Duration の 0（多くの場合、10 以下）の解釈は、実装によって定義されます。多くのツールとブラウザでは、GIF と同様の最小時間の長さが割り当てられます。

予約済み: 6 ビット

は 0 にする必要があります。読者はこのフィールドを無視する必要があります。

ブレンド方法（B）: 1 ビット

現在のフレームの透明ピクセルをブレンドする方法を指定しますを、対応するピクセルに置き換えます。

0: アルファブレンドを使用します。前のフレームを破棄した後、アルファブレンドを使用して現在のフレームをキャンバスにレンダリングします（後述）。現在のフレームにアルファチャンネルがない場合は、アルファ値が 255 であると想定し、長方形を効果的に置き換えます。
1: ブレンドしない。前のフレームを破棄したら、現在のフレームで覆われている長方形を上書きして、現在のフレームをキャンバスにレンダリングします。

廃棄方法（D）: 1 ビット

現在のフレームが処理された後にどのように処理されるかを示します。次のフレームをレンダリングする前に表示されます。

0: 廃棄しないでください。キャンバスはそのままにします。
1: 背景色に破棄します。キャンバス上の長方形を塗りつぶします 現在のフレームで覆われている部分を、「アニメーション」チャンク。

注:

フレームの廃棄は、フレームの長方形、つまり フレーム X、フレーム Y、フレームの幅、フレームで定義される長方形高さ。キャンバス全体が表示される場合もあれば、覆われない場合もあります。
アルファブレンド:

R、G、B、A の各チャンネルが 8 ビットであり、RGB チャンネルがアルファで乗算されていない場合、「dst」を「src」にブレンドする式は次のとおりです。
```
blend.A = src.A + dst.A * (1 - src.A / 255)
if blend.A = 0 then
  blend.RGB = 0
else
  blend.RGB =
      (src.RGB * src.A +
       dst.RGB * dst.A * (1 - src.A / 255)) / blend.A
```
アルファブレンドは、以下を考慮して線形色空間で行う必要があります。画像のカラープロファイル。カラープロファイルが存在しない場合は、標準 RGB（sRGB）が想定されます。（なお、sRGB はガンマが 2.2 程度であるため、リニア化する必要があります）。

フレームデータ: チャンクサイズ バイト - 16

構成:

フレームのオプションのアルファサブチャンク。
フレームのビットストリームサブチャンク。
不明なチャンクのリスト（省略可）。

注: 「ANMF」ペイロードのフレームデータは、RIFF ファイル形式で説明されているように、個々のパディングされたチャンクで構成されています。

アルファ版

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('ALPH')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|Rsv| P | F | C |     Alpha Bitstream...                        |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

予約済み（Rsv）: 2 ビット

は 0 にする必要があります。読者はこのフィールドを無視する必要があります。

前処理（P）: 2 ビット

これらの情報ビットは、事前処理が実行されたことを通知するために使用されます。行われます。デコーダは、この情報を使用して、表示前に値をディザリングしたり、グラデーションをスムーズにしたりできます。

0: 前処理なし。
1: レベルダウン。

デコーダは、この情報を特定の方法で使用する必要はありません。

フィルタリング方法（F）: 2 ビット

使用されるフィルタリングメソッドは次のとおりです。

0: なし。
1: 水平フィルタ。
2: 垂直フィルタ。
3: グラデーションフィルタ。

各ピクセルに対して、以下の計算を使用してフィルタリングが実行されます。現在の X の位置を囲むアルファ値が次のようにラベル付けされているとします。

 C | B |
---+---+
 A | X |

位置 X のアルファ値を計算します。まず、フィルタ方法に応じて予測が行われます。

メソッド 0: 予測子 = 0
メソッド 1: 予測子 = A
メソッド 2: 予測器 = B
メソッド 3: 予測子 = clip(A + B - C)

ここで、clip(v) は以下と等しくなります。

0（v < 0 の場合）
v > の場合、255255
v それ以外の場合

最終的な値は、解凍された値 X を予測子に追加し、モジュロ 256 演算を使用して [256..511] の範囲を [0..255] にラップすることで導出されます。

alpha = (predictor + X) % 256

左端と最上端のピクセル位置については、特殊なケースがあります。対象たとえば、位置 (0, 0) の左上の値では、予測子値として 0 を使用します。それ以外の場合は以下のとおりです。

水平フィルタリングメソッドまたはグラデーションフィルタリングメソッドの場合、座標（0, y）の左端のピクセルは、すぐ上の座標（0, y-1）を使用して予測されます。
垂直フィルタリングまたはグラデーションフィルタリングの方法では、位置（x, 0）の最上位ピクセルは、左側の位置（x-1, 0）を使用して予測されます。

圧縮方法（C）: 2 ビット

使用される圧縮方法:

0: 圧縮なし。
1: WebP ロスレス形式で圧縮されています。

アルファビットストリーム: チャンクサイズバイト - 1

エンコードされたアルファビットストリーム。

このオプションのチャンクには、このフレームのエンコードされたアルファデータが含まれています。フレーム「VP8L」を含むチャンクにこのチャンクが含まれるべきではありません。

理由: 透明性情報はすでに「VP8L」チャンクの一部になっています。

アルファチャンネルデータは、圧縮方法が「0」の場合は非圧縮の元データとして、圧縮方法が「1」の場合はロスレス形式を使用して圧縮された状態で保存されます。

元データ: 長さ = 幅 × 高さのバイトシーケンスで構成されます。スキャン順にすべての 8 ビットの透過性値を含む。
ロスレス形式の圧縮: バイトシーケンスは、幅 x 高さの暗黙的なディメンションの圧縮画像ストリームです（「WebP ロスレスビットストリーム形式」を参照）。つまり、この画像ストリームには、画像のサイズを記述するヘッダーは含まれていません。

根拠: ディメンションは他のソースからすでにわかっているため、再度保存すると冗長になり、エラーが発生しやすくなります。

画像ストリームがアルファ、赤、緑、青（ARGB）の色値にデコードされたら、ロスレス形式仕様で説明されているプロセスに沿って、ARGB 四重体の緑チャンネルから透明度情報を抽出する必要があります。

根拠: 緑色のチャンネルは、他のチャンネルとは異なり、仕様で追加の変換ステップが許可されているため、圧縮を改善できます。

ビットストリーム（VP8/VP8L）

このチャンクには、1 つのフレームの圧縮ビットストリームデータが含まれています。

ビットストリームチャンクは、（i）「VP8」のいずれかです。チャンク（「VP8」を使用）（（重要な 4 文字スペース）を FourCC として使用する、または（ii）「VP8L」チャンク「VP8L」を使用FourCC として指定します。

「VP8」の形式は、「VP8L」チャンクについては、このモジュールのシンプルなファイル形式（Lossy） Simple File Format (Lossless) です。

カラープロファイル

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('ICCP')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                       Color Profile                           :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

カラープロファイル: チャンクサイズ（バイト）: ICC プロファイル。

このチャンクは画像データの前に表示する必要があります。

このようなチャンクは 1 つだけにする必要があります。そのようなチャンクが多い場合最初のもの以外をすべて無視しても構いません。詳しくは、ICC 仕様をご覧ください。

このチャンクが存在しない場合、sRGB を想定すべきです。

メタデータ

メタデータは「EXIF」に格納できるまたは「XMP」チャンク。

各タイプ（EXIF と XMP）のチャンクを 1 つだけ含めるべきです。もしそのようなチャンクが多い場合、読者は最初のもの以外をすべて無視しても構いません。

チャンクは次のように定義されます。

「EXIF」チャンク:

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('EXIF')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                        Exif Metadata                          :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

Exif メタデータ: チャンクサイズ（バイト）: Exif 形式の画像メタデータ。

「XMP」チャンク:

 0                   1                   2                   3
 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
|                      ChunkHeader('XMP ')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                        XMP Metadata                           :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

XMP メタデータ: チャンクサイズ（バイト）: XMP 形式の画像メタデータ。

「XMP」の FourCC の 4 番目の文字は ASCII スペース（0x20）です。

メタデータの処理に関するその他のガイダンスについては、 Metadata Working Group の「Guidelines for Handling Metadata」

不明なチャンク

FourCC がこのドキュメントで説明されているいずれのチャンクとも異なる RIFF チャンク（RIFF ファイル形式のセクションで説明）は、不明なチャンクと見なされます。

根拠: 未知のチャンクを許可すると、将来の形式拡張の準備ができ、アプリケーション固有のデータを保存することもできます。

ファイルには、不明なチャンクが含まれても構いません。

拡張 WebP ファイルの説明に沿って、ファイルの末尾に追加します。 header セクション、または
アニメーションのセクションで説明されているように、「ANMF」チャンクの最後に追加します。

リーダーはこれらのチャンクを無視する必要があります。書き込み側は、これらのチャンクを元の順序で保持する必要があります（これらのチャンクを変更する明確な意図がない限り）。

フレームからのキャンバスアセンブリ

ここでは、リーダーがケースにキャンバスを組み立てる方法の概要を説明します。作成します。

このプロセスは、VP8X チャンクで指定されたサイズ（幅 Canvas Width Minus One + 1 ピクセル、高さ Canvas Height Minus One + 1 ピクセル）を使用してキャンバスを作成することから始まります。「ANIM」チャンクの Loop Count フィールドは、アニメーションプロセスを繰り返す回数を制御します。これは、Loop Count 値がゼロでない場合の Loop Count - 1 または、Loop Count がゼロの場合の無限大です。

各ループの反復処理の開始時に、キャンバスは「ANIM」チャンクの背景色またはアプリケーション定義の色で塗りつぶされます。

「ANMF」チャンクには、表示順に並べられた個々のフレームが含まれます。レンダリング前前のフレームの Disposal method が適用されます。

デコードされたフレームのレンダリングは、デカルト座標（2 * Frame X、2 * Frame Y）から始まり、キャンバスの左上を原点として使用します。Frame Width Minus One + 1 ピクセル幅、Frame Height Minus One + 1 ピクセル高の画像が Blending method を使用してキャンバスにレンダリングされます。

キャンバスは Frame Duration ミリ秒間表示されます。これは、「ANMF」チャンクによって指定されたすべてのフレームが表示されるまで続きます。その後、新しいループの反復処理が開始されます。すべての反復処理が完了した場合は、キャンバスは最終状態のままになります。

次の擬似コードは、レンダリングプロセスを示しています。VP8X.field という表記は、同じ説明を持つ「VP8X」チャンクのフィールドを意味します。

VP8X.flags.hasAnimation MUST be TRUE
canvas ← new image of size VP8X.canvasWidth x VP8X.canvasHeight with
         background color ANIM.background_color or
         application-defined color.
loop_count ← ANIM.loopCount
dispose_method ← Dispose to background color
if loop_count == 0:
  loop_count = ∞
frame_params ← nil
next chunk in image_data is ANMF MUST be TRUE
for loop = 0..loop_count - 1
  clear canvas to ANIM.background_color or application-defined color
  until eof or non-ANMF chunk
    frame_params.frameX = Frame X
    frame_params.frameY = Frame Y
    frame_params.frameWidth = Frame Width Minus One + 1
    frame_params.frameHeight = Frame Height Minus One + 1
    frame_params.frameDuration = Frame Duration
    frame_right = frame_params.frameX + frame_params.frameWidth
    frame_bottom = frame_params.frameY + frame_params.frameHeight
    VP8X.canvasWidth >= frame_right MUST be TRUE
    VP8X.canvasHeight >= frame_bottom MUST be TRUE
    for subchunk in 'Frame Data':
      if subchunk.tag == "ALPH":
        alpha subchunks not found in 'Frame Data' earlier MUST be
          TRUE
        frame_params.alpha = alpha_data
      else if subchunk.tag == "VP8 " OR subchunk.tag == "VP8L":
        bitstream subchunks not found in 'Frame Data' earlier MUST
          be TRUE
        frame_params.bitstream = bitstream_data
    apply dispose_method.
    render frame with frame_params.alpha and frame_params.bitstream
      on canvas with top-left corner at (frame_params.frameX,
      frame_params.frameY), using Blending method
      frame_params.blendingMethod.
    canvas contains the decoded image.
    Show the contents of the canvas for
    frame_params.frameDuration * 1 ms.
    dispose_method = frame_params.disposeMethod

ファイルレイアウトの例

アルファ付きの非可逆エンコード画像は次のようになります。

RIFF/WEBP
+- VP8X (descriptions of features used)
+- ALPH (alpha bitstream)
+- VP8 (bitstream)

ロスレスでエンコードされた画像は次のようになります。

RIFF/WEBP
+- VP8X (descriptions of features used)
+- VP8L (lossless bitstream)
+- XYZW (unknown chunk)

ICC プロファイルと XMP メタデータを含むロスレス画像は、次のように表示されます。

RIFF/WEBP
+- VP8X (descriptions of features used)
+- ICCP (color profile)
+- VP8L (lossless bitstream)
+- XMP  (metadata)

EXIF メタデータを含むアニメーション画像は次のようになります。

RIFF/WEBP
+- VP8X (descriptions of features used)
+- ANIM (global animation parameters)
+- ANMF (frame1 parameters + data)
+- ANMF (frame2 parameters + data)
+- ANMF (frame3 parameters + data)
+- ANMF (frame4 parameters + data)
+- EXIF (metadata)