WebP 컨테이너 사양

소개

WebP는 (i) VP8 키 프레임 인코딩을 사용하여 이미지 데이터를 손실 방식으로 압축하거나 (ii) WebP 무손실 인코딩을 사용하는 이미지 형식입니다. 이러한 인코딩 스키마를 사용하면 JPEG, GIF, PNG와 같은 이전 형식보다 효율적일 수 있습니다. 네트워크를 통한 빠른 이미지 전송 (예: 웹사이트)에 최적화되어 있습니다. WebP 형식은 다른 형식과 기능 패리티 (색상 프로필, 메타데이터, 애니메이션 등)가 있습니다. 이 문서에서는 WebP 파일의 구조를 설명합니다.

WebP 컨테이너 (즉, WebP용 RIFF 컨테이너)를 사용하면 WebP의 기본 사용 사례 (즉, VP8 키 프레임으로 인코딩된 단일 이미지가 포함된 파일) 외에도 기능을 지원할 수 있습니다. WebP 컨테이너는 다음을 추가로 지원합니다.

  • 무손실 압축: WebP 무손실 형식을 사용하여 이미지를 무손실 압축할 수 있습니다.

  • 메타데이터: 이미지에 교환 가능한 이미지 파일 형식 (Exif) 또는 확장 가능한 메타데이터 플랫폼 (XMP) 형식으로 저장된 메타데이터가 있을 수 있습니다.

  • 투명도: 이미지에 투명도, 즉 알파 채널이 있을 수 있습니다.

  • 색상 프로필: 국제 색상 컨소시엄의 설명에 따라 이미지에 ICC 프로필이 삽입되어 있을 수 있습니다.

  • 애니메이션: 이미지에 여러 프레임이 있을 수 있으며 프레임 사이에 일시중지가 있으면 애니메이션이 됩니다.

이름 지정

WebP 컨테이너를 참조할 때는 다음 유형을 사용하는 것이 좋습니다.

컨테이너 형식 이름WebP
파일 이름 확장자.webp
MIME 유형이미지/webp
유니폼 유형 식별자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 파일에는 정지 이미지 (즉, 인코딩된 픽셀 행렬) 또는 애니메이션이 포함됩니다. 원하는 경우 투명도 정보, 색상 프로필, 메타데이터를 포함할 수도 있습니다. 픽셀 매트릭스를 이미지의 캔버스라고 합니다.

청크 다이어그램의 비트 번호 지정은 RFC 1166에 설명된 대로 최상위 비트('MSB 0')의 0에서 시작합니다.

다음은 이 문서 전체에서 사용되는 추가 용어입니다.

리더/작성자
WebP 파일을 읽는 코드를 리더라고 하고, 쓰는 코드를 작성자라고 합니다.
uint16
16비트, little-endian, 부호 없는 정수입니다.
uint24
24비트, little-endian, 부호 없는 정수입니다.
uint32
부호 없는 32비트 little-endian 정수입니다.
FourCC
4자리 코드 (FourCC)는 4개의 ASCII 문자를 little-endian 순서로 연결하여 만든 uint32입니다. 즉, 'aaaa' (0x61616161)와 'AAAA' (0x41414141)는 서로 다른 FourCCs로 취급됩니다.
1기반
-1로 오프셋된 값을 저장하는 부호 없는 정수 필드입니다. 예를 들어 이러한 필드는 값 2524로 저장합니다.
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비트
청크 식별에 사용되는 ASCII 4자리 코드입니다.
청크 크기: 32비트 (uint32)
이 필드, 청크 식별자 또는 패딩을 제외한 청크의 크기(바이트)입니다.
청크 페이로드: 청크 크기 바이트
데이터 페이로드입니다. 청크 크기가 홀수이면 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바이트이므로 전체 파일의 크기는 최대 4GiB - 2바이트입니다.
'WEBP': 32비트
ASCII 문자 'W', 'E', 'B', 'P'.

WebP 파일은 FourCC 'WEBP'가 있는 RIFF 헤더로 시작해야 합니다. 헤더의 파일 크기는 뒤에 오는 청크의 총 크기에 'WEBP' FourCC의 4바이트를 더한 값입니다. 파일에는 파일 크기로 지정된 데이터 뒤에 데이터가 포함되어서는 안 됩니다. 판독기는 이러한 파일을 파싱할 수 있으며, 이때 후행 데이터는 무시됩니다. 청크의 크기는 짝수이므로 RIFF 헤더에서 제공하는 크기도 짝수입니다. 개별 청크의 콘텐츠는 다음 섹션에서 설명합니다.

간단한 파일 형식 (손실이 있음)

이미지에 손실 인코딩이 필요하고 확장 형식에서 제공하는 투명도 또는 기타 고급 기능이 필요하지 않은 경우 이 레이아웃을 사용해야 합니다(SHOULD). 이 레이아웃의 파일은 크기가 작고 이전 소프트웨어에서 지원됩니다.

간단한 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 ' FourCC의 네 번째 문자는 ASCII 공백 (0x20)입니다.

VP8 비트스트림 형식 사양은 VP8 데이터 형식 및 디코딩 가이드에 설명되어 있습니다. VP8 프레임 헤더에는 VP8 프레임 너비와 높이가 포함됩니다. 이는 캔버스의 너비와 높이로 가정됩니다.

VP8 사양에서는 이미지를 Y'CbCr 형식으로 디코딩하는 방법을 설명합니다. RGB로 변환하려면 권장사항 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여야 합니다(MUST). 독자는 이 필드를 무시해야 합니다.
ICC 프로필 (I): 1비트
파일에 'ICCP' 청크가 포함되어 있는지 설정합니다.
알파 (L): 1비트
이미지의 프레임에 투명도 정보('알파')가 포함되어 있는지 설정합니다.
Exif 메타데이터 (E): 1비트
파일에 Exif 메타데이터가 포함된 경우 설정합니다.
XMP 메타데이터 (X): 1비트
파일에 XMP 메타데이터가 포함되어 있는지 설정합니다.
애니메이션 (A): 1비트
애니메이션 이미지인 경우 설정합니다. 'ANIM' 및 'ANMF' 청크의 데이터는 애니메이션을 제어하는 데 사용해야 합니다.
예약됨 (R): 1비트
0여야 합니다(MUST). 독자는 이 필드를 무시해야 합니다.
예약됨: 24비트
0여야 합니다(MUST). 리더는 이 필드를 무시해야 합니다(MUST).
캔버스 너비 - 1: 24비트
캔버스의 1 기반 너비(픽셀)입니다. 실제 캔버스 너비는 1 + Canvas Width Minus One입니다.
캔버스 높이 - 1: 24비트
캔버스의 1 기반 높이(픽셀)입니다. 실제 캔버스 높이는 1 + Canvas Height Minus One입니다.

캔버스 너비캔버스 높이의 곱은 2^32 - 1 이하여야 합니다(MUST).

향후 사양에 더 많은 필드가 추가될 수 있습니다. 알 수 없는 필드는 무시해야 합니다.

애니메이션

애니메이션은 '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] 바이트 순서로 캔버스의 기본 배경 색상입니다. 이 색상은 프레임 주변의 캔버스에서 사용되지 않는 공간과 첫 번째 프레임의 투명한 픽셀을 채우는 데 사용될 수 있습니다. 배경 색상은 폐기 방법이 1인 경우에도 사용됩니다.

참고:

  • 배경 색상은 'VP8X' 청크알파 플래그가 설정되지 않은 경우에도 불투명하지 않은 알파 값을 포함할 수 있습니다.

  • 뷰어 애플리케이션은 배경 색상 값을 힌트로 취급해야 하며 이를 사용할 필요는 없습니다.

  • 캔버스는 각 루프가 시작될 때 지워집니다. 이를 위해 배경 색상을 사용할 수 있습니다.

루프 횟수: 16비트 (uint16)
애니메이션을 반복할 횟수입니다. 0이면 무한대를 의미합니다.

이 청크는 'VP8X' 청크의 애니메이션 플래그가 설정된 경우 표시되어야 합니다(MUST). 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밀리초). 프레임 시간 0 (종종 10 이하)의 해석은 구현에 의해 정의됩니다. 많은 도구와 브라우저는 GIF와 유사한 최소 시간을 할당합니다.
예약됨: 6비트
0여야 합니다(MUST). 리더는 이 필드를 무시해야 합니다(MUST).
혼합 방법 (B): 1비트

현재 프레임의 투명 픽셀이 이전 캔버스의 상응하는 픽셀과 얼마나 블렌딩되는지를 나타냅니다.

  • 0: 알파 혼합을 사용합니다. 이전 프레임을 폐기한 후 알파 혼합을 사용하여 캔버스에 현재 프레임을 렌더링합니다 (아래 참고). 현재 프레임에 알파 채널이 없는 경우 알파 값이 255라고 가정하여 직사각형을 효과적으로 대체합니다.

  • 1: 혼합하지 않습니다. 이전 프레임을 폐기한 후 현재 프레임으로 덮인 직사각형을 덮어쓰기하여 현재 프레임을 캔버스에 렌더링합니다.

폐기 방법 (D): 1비트

캔버스에 표시된 후 (다음 프레임을 렌더링하기 전) 현재 프레임을 처리하는 방법을 나타냅니다.

  • 0: 폐기하지 않습니다. 캔버스는 그대로 둡니다.

  • 1: 배경 색상을 삭제합니다. 현재 프레임으로 덮인 캔버스의 직사각형'ANIM' 청크에 지정된 배경 색상으로 채웁니다.

참고:

  • 프레임 삭제는 프레임 직사각형, 즉 프레임 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여야 합니다(MUST). 독자는 이 필드를 무시해야 합니다.
사전 처리 (P): 2비트

이러한 정보 제공 비트는 압축 중에 실행된 사전 처리를 알리는 데 사용됩니다. 디코더는 이 정보를 사용하여 예를 들어 표시하기 전에 값을 디더링하거나 그라데이션을 부드럽게 할 수 있습니다.

  • 0: 사전 처리가 없습니다.
  • 1: 레벨 감소.

디코더는 이 정보를 지정된 방식으로 사용할 필요가 없습니다.

필터링 방법 (F): 2비트

사용되는 필터링 방법은 다음과 같습니다.

  • 0: 없음.
  • 1: 가로 필터입니다.
  • 2: 세로 필터입니다.
  • 3: 그라데이션 필터

각 픽셀에 대해 필터링은 다음 계산을 사용하여 수행됩니다. 현재 X 위치를 둘러싼 알파 값이 다음과 같이 라벨이 지정되었다고 가정합니다.

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

X 위치의 알파 값을 계산합니다. 먼저 필터링 방법에 따라 예측이 실행됩니다.

  • 메서드 0: 예측자 = 0
  • 메서드 1: 예측자 = A
  • 메서드 2: 예측자 = B
  • 메서드 3: 예측자 = 클립(A + B - C)

여기서 clip(v)은 다음과 같습니다.

  • 0 if v < 0,
  • v > 255인 경우 255, 또는
  • 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' 청크가 포함된 프레임은 이 청크를 포함하면 안 됩니다(SHOULD NOT).

근거: 투명도 정보는 이미 'VP8L' 청크의 일부입니다.

알파 채널 데이터는 압축되지 않은 원시 데이터 (압축 방법이 '0'인 경우)로 저장되거나 무손실 형식을 사용하여 압축(압축 방법이 '1'인 경우)됩니다.

  • 원시 데이터: 길이 = 너비 * 높이의 바이트 시퀀스로 구성되며 스캔 순서에 모든 8비트 투명도 값이 포함됩니다.

  • 무손실 형식 압축: 바이트 시퀀스는 암시적 크기 너비 x 높이의 압축된 이미지 스트림입니다 ('WebP 무손실 비트스트림 형식' 참고). 즉, 이 이미지 스트림에는 이미지 크기를 설명하는 헤더가 포함되지 않습니다.

    근거: 측정기준은 이미 다른 소스에서 알려져 있으므로 다시 저장하면 중복되고 오류가 발생하기 쉽습니다.

    무손실 형식 사양에 설명된 프로세스에 따라 이미지 스트림이 알파, 레드, 그린, 블루 (ARGB) 색상 값으로 디코딩되면 투명성 정보는 ARGB 4중 집합의 그린 채널에서 추출해야 합니다.

    근거: 녹색 채널은 다른 채널과 달리 사양에서 압축을 개선할 수 있는 추가 변환 단계가 허용됩니다.

비트스트림 (VP8/VP8L)

이 청크에는 단일 프레임의 압축된 비트스트림 데이터가 포함됩니다.

비트스트림 청크는 (i) 'VP8 '을 FourCC로 사용하는 'VP8 ' 청크(넷째 문자의 공백에 주의) 또는 (ii) 'VP8L'을 FourCC로 사용하는 'VP8L' 청크일 수 있습니다.

'VP8 ' 및 '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('ICCP')                      |
|                                                               |
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
:                       Color Profile                           :
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
색상 프로필: 청크 크기 바이트
ICC 프로필

이 청크는 이미지 데이터 앞에 표시되어야 합니다.

이러한 청크는 1개 이하여야 합니다. 이러한 청크가 더 있는 경우 리더는 첫 번째 청크를 제외한 모든 청크를 무시할 수 있습니다. 자세한 내용은 ICC 사양을 참조하세요.

이 청크가 없으면 sRGB로 간주해야 합니다.

메타데이터

메타데이터는 '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 메타데이터: 청크 크기(바이트)
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의 네 번째 문자는 ASCII 공백 (0x20)입니다.

메타데이터 처리에 관한 추가 안내는 메타데이터 작업 그룹의 '메타데이터 처리 가이드라인'을 참고하세요.

알 수 없는 청크

FourCC가 이 문서에 설명된 청크와 다른 RIFF 청크 (RIFF 파일 형식 섹션에 설명됨)는 알 수 없는 청크로 간주됩니다.

근거: 알 수 없는 청크를 허용하면 향후 형식을 확장할 수 있으며 애플리케이션별 데이터를 저장할 수도 있습니다.

파일에 알 수 없는 청크가 포함될 수 있습니다.

판독기는 이러한 청크를 무시해야 합니다. 작성자는 이러한 청크를 수정할 의도가 없는 한 원래 순서로 보존해야 합니다 (SHOULD).

프레임에서 캔버스 어셈블리

다음은 애니메이션 이미지의 경우 리더가 캔버스를 조합해야 하는 방법을 간략하게 설명합니다.

이 프로세스는 'VP8X' 청크에 지정된 크기(너비 Canvas Width Minus One + 1픽셀, 높이 Canvas Height Minus One + 1픽셀)를 사용하여 캔버스를 만드는 것으로 시작됩니다. 'ANIM' 청크의 Loop Count 필드는 애니메이션 프로세스가 반복되는 횟수를 제어합니다. Loop Count 값이 0이 아니면 Loop Count - 1이고 Loop Count이 0이면 무한대입니다.

각 루프 반복이 시작될 때 캔버스는 'ANIM' 청크의 배경 색상 또는 애플리케이션 정의 색상을 사용하여 채워집니다.

'ANMF' 청크에는 표시 순서에 따라 지정된 개별 프레임이 포함됩니다. 각 프레임을 렌더링하기 전에 이전 프레임의 Disposal method가 적용됩니다.

디코딩된 프레임의 렌더링은 캔버스의 왼쪽 상단을 원점으로 사용하여 데카르트 좌표 (2 * Frame X, 2 * Frame Y)에서 시작됩니다. Blending method를 사용하여 가로 Frame Width Minus One + 1픽셀, 높이 Frame Height Minus One + 1픽셀이 캔버스에 렌더링됩니다.

캔버스는 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)