WebP

WebP는 웹에서 이미지 파일의 크기를 줄이면서 효율적으로 배포하기 위해 설계된 래스터 이미지 형식이다. 손실 압축과 무손실 압축을 모두 지원하며 투명도와 애니메이션을 표현할 수 있다. 웹사이트와 웹 애플리케이션에서는 사진과 아이콘, 움직이는 이미지 등 다양한 콘텐츠를 네트워크 비용에...

분류이미지 파일 형식
주요 기능손실·무손실 압축 웹 이미지 표현
관련 기술World Wide Web, 웹 브라우저, HTTP, JavaScript
관련 표준Google: WebP

WebP는 웹에서 이미지 파일의 크기를 줄이면서 효율적으로 배포하기 위해 설계된 래스터 이미지 형식이다. 손실 압축과 무손실 압축을 모두 지원하며 투명도와 애니메이션을 표현할 수 있다. 웹사이트와 웹 애플리케이션에서는 사진과 아이콘, 움직이는 이미지 등 다양한 콘텐츠를 네트워크 비용에 맞게 전달하는 용도로 사용한다.

WebP의 손실 압축은 영상 압축 기술에서 유래한 예측과 변환 과정을 바탕으로 이미지 데이터를 효율적으로 표현한다. 무손실 압축은 원래 픽셀 값을 재현하면서 반복되는 패턴과 색상 정보를 압축한다. 실제 압축률과 복원된 화질은 이미지의 특성, 품질 설정과 인코더 구현에 따라 달라지므로 모든 이미지에서 동일한 결과가 나오지는 않는다.

WebP는 알파 채널을 통한 투명도와 여러 프레임으로 구성된 애니메이션을 지원한다. 애니메이션 파일에서는 프레임의 표시 시간과 합성 방식이 움직임 표현에 영향을 준다. 이미지 메타데이터를 포함할 수도 있지만 웹 서비스는 파일 크기와 개인정보 보호를 고려해 필요한 메타데이터만 유지할 수 있다.

웹 브라우저는 응답의 MIME 타입과 실제 파일 형식을 바탕으로 이미지를 디코딩한다. picture 요소와 source를 사용하면 브라우저가 지원하는 이미지 형식과 화면 환경에 따라 적절한 파일을 선택하도록 할 수 있다. 이미지의 표시 크기와 압축 크기는 서로 다른 값이므로 반응형 디자인에서는 해상도와 다운로드 비용을 함께 고려해야 한다.

WebP는 PNG와 JPEG, GIF 같은 기존 이미지 형식과 사용 목적이 겹치지만 모든 장면에서 가장 좋은 형식이라고 단정할 수는 없다. 선명한 글자와 그래픽, 복잡한 사진, 애니메이션에는 서로 다른 인코딩 설정이 적합할 수 있다. 이미지 배포에서는 브라우저 호환성과 압축 품질, 디코딩 비용을 비교하여 선택한다.[1]

기원과 발전

WebP 개발

웹 브라우저 지원

형식 구성

컨테이너

손실 압축

무손실 압축

추가 기능

투명도

애니메이션

메타데이터

웹 배포

MIME 타입

picture와 source

반응형 이미지

압축과 성능

화질

파일 크기

디코딩

다른 이미지 형식과 비교

JPEG

PNG

AVIF

GIF

관련 문서

  1. Google: WebP ↩