簡介
WebP 是一種圖片格式，可使用 (i) VP8 金鑰影格編碼以失真的方式壓縮圖片資料，或 (ii) 採用 WebP 無損編碼方式。這些編碼配置應比 JPEG、GIF 和 PNG 等舊版格式更有效率。能夠透過網路快速傳輸圖片 (例如網站)。WebP 格式也有與其他格式相同的功能性 (色彩設定檔、中繼資料、動畫等)。本文件將說明 WebP 檔案的結構。
WebP 容器 (即 WebP 容器的 RIFF 容器) 支援在 WebP 基本用途以上的功能上 (也就是包含以 VP8 金鑰頁框編碼的單一圖片檔案)，WebP 容器針對下列項目提供額外支援：
無損壓縮：使用 WebP 無損格式時，圖片可能會無損壓縮。
中繼資料：圖片可能包含中繼資料，並以可交換圖片檔案格式 (Exif) 或擴充中繼資料平台 (XMP) 格式儲存。
透明度：圖片可能包含透明度，也就是 Alpha 管道。
顏色設定檔：圖片可能具有嵌入式 ICC 設定檔，如國際色彩協會所述。
動畫：同一圖片可能會有多個影格，且這些片段之間有停頓，使得動畫製作成動畫。
命名
參照 WebP 容器時，建議使用下列類型：
| 容器格式名稱 | WebP |
| 副檔名 | .webp |
| MIME 類型 | 圖片/WebP |
| 統一類型 ID | org.webmproject.webp |
術語與基本須知
這份文件中的「必須」、「必須」、「絕對」、「必要」、「應該」、「不要」、「建議」、「不應該」、「建議」和「其他
WebP 檔案包含靜態圖片 (也就是像素的編碼矩陣) 或動畫。它也可以包含透明度資訊、色彩設定檔和中繼資料。我們將像素矩陣視為圖片的畫布。
區塊圖的位元編號是以 0 為最重要的位元 (「MSB 0」) 開始，如 RFC 1166 中所述。
以下是本文件所採用的其他條款：
- 讀取者/寫入者
- 讀取 WebP 檔案的程式碼稱為「讀取者」，而寫入檔案的程式碼稱為「寫入者」。
- uint16
- 16 位元、小端序、無符號整數。
- uint24
- 24 位元的小型位元組，無符號整數。
- uint32
- 32 位元、小端序、無符號整數。
- FCC
- 4 個字元的代碼 (FourCC) 是一種 uint32，會以串連函式中的四個 ASCII 字元串連而成。這表示「aaaa」(0x61616161) 和「AAAA」(0x41414141) 被視為不同的 FourCCs。
- 以 1 為基礎
- 將未簽署的整數欄位儲存在
-1中，例如將這類欄位的值儲存在 25 中，做為 24。 - ChunkHeader('ABCD')
- 用於說明個別區塊的 FourCC 和 Chunk Size 標頭，其中「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 位元
- 用來識別區塊的 ASCII 半形字元代碼。
- 區塊大小：32 位元 (uint32)
- 區塊大小 (以位元組為單位)，不含這個欄位、區塊 ID 或邊框間距。
- 區塊酬載：區塊大小位元組
- 資料酬載。如果「Chunk Size」為奇數，會新增一個邊框間距位元組 (「必須」
0以符合 RIFF)。
注意：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」開頭。標頭中的檔案大小是其後方的區塊大小加上「WEBP」FourCC 的 4 位元組。「File Size」指定的資料後方「不會」包含任何資料。讀取器「可能」會剖析這類檔案，忽略結尾資料。由於任何區塊的大小是偶數，因此 RIFF 標頭提供的大小也會跟著如此。以下各節將說明個別區塊的內容。
簡易檔案格式 (寬鬆)
如果圖片需要失真編碼，且不需要延伸格式提供的透明度或其他進階功能，請使用這個版面配置。採用這個版面配置的檔案較小，且較舊版軟體支援。
簡易 WebP (lossy) 檔案格式：
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 資料：Chunk Size 個位元組
- VP8 位元資料。
請注意，「VP8 FourCC」中的第四字元是 ASCII 空格 (0x20)。
如要瞭解 VP8 位元格式規格，請參閱「VP8 資料格式和解碼指南」。請注意，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 資料：Chunk Size 個位元組
- VP8L 位元資料。
VP8L 位元串流的目前規格請參閱「WebP Lossless Bitstream Format」。請注意，VP8L 標頭包含 VP8L 圖片寬度和高度。這會假設畫布的寬度和高度。
擴充檔案格式
注意：舊版讀者不支援採用擴充格式的檔案。
擴充格式檔案包含：
「VP8X」區塊，提供檔案所用功能的相關資訊。
選用顏色的選用「ICCP」區塊。
含有動畫控制資料的選用「ANIM」區塊。
圖片資料。
選用 Exif 中繼資料的「EXIF」區塊。
選用的「XMP 檔案」和 XMP 中繼資料。
選用的未知區塊清單。
針對靜態圖片，圖片資料由單一影格組成，並由下列元件組成：
如果是動畫圖片，圖片資料包含多個畫面。如要進一步瞭解影格，請參閱「動畫」一節。
所有區塊都必須以上述順序排列。如果區塊出現在錯誤的位置，檔案無效，但讀者「必須」剖析檔案，並忽略順序有誤的區塊。
原因：設定區塊順序後，就能加快檔案剖析速度。舉例來說，如果「ALPH」區塊未顯示在所需的位置，解碼器可以選擇停止搜尋。忽略晚期區塊的規則應讓需要完整搜尋的程式能提供與盡早停止搜尋結果相同的結果。
擴充 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」區塊，請進行設定。
- Alpha (L)：1 位元
- 如果圖片任何頁框含有透明度資訊 (即「Alpha 版」)，請設定。
- 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。 - 畫布高度減號：24 位元
- 以 1 為單位畫布的高度 (以像素為單位)。實際畫布高度為
1 + Canvas Height Minus One。
「Canvas Width」(畫布寬度) 和「Canvas Height」(畫布高度) 的產品的尺寸「必須」小於 2^32 - 1。
日後的規格可能會新增更多欄位。「必須」忽略不明欄位。
動畫
動畫是由「ANIM」和「ANMF」區塊控制。
「ANIM」區塊：
如果是動畫圖片，這個區塊會包含動畫的全域參數。
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)
- [Blue, Green, Red, Alpha] 位元組順序的預設畫布背景顏色。這個顏色「MAY」可用於填滿影格周圍的未使用的空間，以及第一個影格的透明像素。當棄置方法為
1時，系統也會使用背景顏色。
注意：
即使未設定 「VP8X' Chunk」中的 Alpha 旗標，背景顏色 MAY 仍包含非不透明的 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。 - 影格寬度減掉一：24 位元 (uint24)
- 頁框的1 寬度寬度。
畫面寬度為
1 + Frame Width Minus One。 - 影格高度下限為 24 位元 (uint24)
- 頁框的1 高度高度。
畫面高度為
1 + Frame Height Minus One。 - 影格持續時間：24 位元 (uint24)
- 顯示下一個影格前的等待時間，以 1 毫秒為單位。請注意，影格持續時間為 0 (通常 <= 10) 的定義會由實作定義。許多工具和瀏覽器都會指派與 GIF 類似的時間長度下限。
- 已保留：6 位元
- 必須為
0。讀者「必須」忽略這個欄位。 - 混合方法 (B)：1 位元
表示目前影格的透明像素如何與上一個畫布的對應像素混合：
0：使用 Alpha-blending。丟棄上一個影格後，使用 Alpha 混合效果在畫布上轉譯目前的影格 (請參閱下方說明)。如果目前頁框沒有 Alpha 管道，請假設 Alpha 值為 255，可有效取代矩形。1：不要混用。丟棄前一個影格後，請覆寫目前畫面涵蓋的矩形，在畫布上轉譯目前的影格。
- 處理方法 (D)：1 位元
指出在顯示畫布後顯示目前頁框 (在轉譯下一個影格之前) 的處理方式：
注意：
影格處理僅適用於影格矩形，也就是影格 X、影格 Y、畫面寬度和畫面高度定義的矩形。不一定會涵蓋整個畫布。
Alpha 混合：
由於每個 R、G、B 和 A 管道都是 8 位元，而 RGB 管道並未由 Alpha 乘前，因此混合 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在 Alpha 色域中，請務必考量圖片的色彩設定檔，以線性色彩空間完成。如果沒有顏色設定檔，系統會假設標準 RGB (sRGB)。(請注意，sRGB 也必須支援約 2.2 的 Gamma，因此必須線性處理)。
注意：上方的「ANMF」酬載 (影格資料) 包含各個「已新增的」區塊，如 RIFF 檔案格式所述。
Alpha 值
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 位置前後的 Alpha 值會標示為：
C | B |
---+---+
A | X |
我們會努力計算 X 位置的 Alpha 值。首先，系統會根據篩選方法進行預測：
- 方法
0：預測者 = 0 - 方法
1：預測者 = A - 方法
2：預測者 = B - 方法
3：預測者 = clip(A + B - C)
其中 clip(v) 等於：
- 0 (如果 < 0)
- 如果 v > 255，則為 255；或
- v 鍵
透過將壓縮值 X 新增至預測值，並使用模數-256 算術來將 [256..511] 範圍納入 [0..255] 範圍，就可以產生最終值：
alpha = (predictor + X) % 256
針對最左側和最頂端的像素位置，存在特殊情況。例如，位置的左值 (0, 0) 會使用 0 做為預測值。如果是其他情況：
- 針對水平或漸層的篩選方法，位於位置的左側像素 (0、y) 是使用上方位置 (0、y-1) 進行預測。
- 針對垂直或漸層篩選方法，系統會使用位置 (x-1, 0) 左側的位置 (x-1, 0) 預測最高像素。
- 壓縮方法 (C)：2 位元
使用的壓縮方法：
0：未壓縮。1：使用 WebP 無損格式壓縮。
- Alpha 位元串流：Chunk Size -
1個位元組 經過編碼的 Alpha 位元串流。
這個選用區塊包含這個影格的編碼 Alpha 資料。含有「VP8L」區塊的區塊「不應」包含這個區塊。
原因：透明度資訊已在「VP8L」區塊中。
Alpha 管道資料會以未壓縮的原始資料 (當壓縮方法為「0」) 時儲存，或使用無損格式 (壓縮方式為「1」) 壓縮。
原始資料：包含位元組 = 寬度 * 的位元組序列，包含掃描順序中的所有 8 位元透明度值。
無損格式壓縮：位元組序列是經過壓縮的圖片寬度 x 高度的壓縮圖片串流 (如「WebP Lossless Bitstream Format」一節中所述)。也就是說，這個圖片串流「不」包含描述圖片尺寸的任何標頭。
原因：系統已從其他來源得知維度，因此再次儲存這些維度會重複且容易出錯。
將圖片串流解碼為 Alpha 版、紅色、綠色、藍色 (ARGB) 色彩值後，請按照無失真格式規格所述的程序擷取透明度資訊，接著必須從 ARGB 四元組的綠色管道擷取透明度資訊。
Rationale：在規格中，綠色管道允許使用額外的轉換步驟，這與其他管道不同，可改善壓縮。
Bitstream (VP8/VP8L)
這個區塊包含單一畫面的壓縮位元資料。
位元區塊可能為 (i)「VP8 的區塊」，使用「VP8」(請注意明顯的四個字元空間) 做為其 FourCC，或 (ii)「VP8L」區塊，並使用「VP8L」做為 FourCC。
「VP8」和「VP8L」區塊的格式分別為「簡易檔案格式 (Lossy)」和「簡易檔案格式 (無失真)」一節的說明。
色彩設定檔
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 :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
- 顏色設定檔：Chunk Size 個位元組
- ICC 設定檔。
這個區塊「必須」位在圖片資料之前。
應該只有一個區塊。如有更多這類區塊，讀者則只會忽略第一種區塊。詳情請參閱 ICC 規格。
如果沒有，則假設這是 sRGB SHOULD。
Metadata
中繼資料可儲存在「EXIF」或「XMP 區塊」。
應該「不」構成每種類型 (「EXIF」和「XMP」) 的一個區塊。如有更多區塊，讀者則「必須」忽略第一個區塊，
區塊的定義如下：
「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 中繼資料：Chunk Size 位元組
- 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 中繼資料：Chunk Size 位元組
- XMP 格式的圖片中繼資料。
請注意，「XMP F CC」中的第四字元是 ASCII 空格 (0x20)。
如要進一步瞭解處理中繼資料，請參閱中繼資料工作小組的「處理中繼資料指南」。
不明區塊
RIFF 區塊 (如 RIFF 檔案格式一節所述)，其中 FourCC 與本文所述的任一區塊不同，才被視為「不明區塊」。
原因：允許不明區塊將佈建日後的格式，並允許儲存任何應用程式的特定資料。
檔案可能含有不明區塊：
- 如擴充 WebP 檔案標頭一節所述，或是
- 如「Animation」一節中所述，「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」區塊中的欄位，但說明相同。
assert VP8X.flags.hasAnimation
canvas ← new image of size VP8X.canvasWidth x VP8X.canvasHeight with
background color ANIM.background_color.
loop_count ← ANIM.loopCount
dispose_method ← Dispose to background color
if loop_count == 0:
loop_count = ∞
frame_params ← nil
assert next chunk in image_data is ANMF
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
assert VP8X.canvasWidth >= frame_right
assert VP8X.canvasHeight >= frame_bottom
for subchunk in 'Frame Data':
if subchunk.tag == "ALPH":
assert alpha subchunks not found in 'Frame Data' earlier
frame_params.alpha = alpha_data
else if subchunk.tag == "VP8 " OR subchunk.tag == "VP8L":
assert bitstream subchunks not found in 'Frame Data' earlier
frame_params.bitstream = bitstream_data
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
檔案版面配置範例
使用 Alpha 版進行有損編碼的圖片，可能如下所示：
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)