WebP란
WebP는 Google이 출시한 이미지 포맷으로, 유손실 압축, 무손실 압축, 투명 채널을 모두 지원합니다. 간단히 말해, 하나의 포맷으로 JPEG와 PNG를 대체하려는 것입니다 — 용량은 더 작고, 기능은 더 많습니다.
현재 주요 브라우저(Chrome, Edge, Firefox, Safari)가 모두 WebP를 지원하며, 웹사이트에서 JPEG/PNG를 WebP로 교체하면 로딩 속도가 크게 향상됩니다.
WebP의 핵심 장점
용량이 더 작음
- 유손실 WebP vs JPEG: 동일한 시각 품질에서 25%~35% 작음
- 무손실 WebP vs PNG: 20%~30% 작음
- 투명 지원: 투명 PNG보다 훨씬 작아, JPEG가 투명을 지원하지 않는 단점을 보완
이미지가 많은 웹사이트에서 전체를 WebP로 바꾸면 대량의 트래픽과 로딩 시간을 절약할 수 있습니다.
기능이 포괄적
- 투명 채널 지원(PNG처럼)
- 유손실과 무손실 지원(JPEG와 PNG가 각각 절반씩 차지)
- 애니메이션 지원(GIF처럼)
- 하나의 포맷으로 다양한 용도 커버
최신 브라우저의 전면 지원
2020년 이후 주요 브라우저가 모두 WebP 표시를 지원합니다. 과거의 호환성 문제는 기본적으로 사라졌습니다.
WebP의 한계
구형 환경 미지원
구버전 브라우저(IE, 구형 iOS)는 지원하지 않습니다. 사용자층에 이런 환경이 있으면 JPEG/PNG 폴백을 제공해야 합니다.
편집 소프트웨어 지원 편차
일부 구버전 이미지 편집 소프트웨어는 WebP를 직접 편집할 수 없습니다. 하지만 보기, 변환 도구는 폭넓게 지원합니다.
유손실 WebP는 극저품질에서 JPEG보다 못함
품질을 매우 낮게 압축하면 WebP가 때로 JPEG보다 못합니다. 하지만 정상 사용 품질 범위(70 이상)에서는 WebP가 더 우수합니다.
WebP vs JPEG vs PNG
| 차원 | JPEG | PNG | WebP |
|---|---|---|---|
| 유손실 압축 | 지원 | 미지원 | 지원 |
| 투명 | 미지원 | 지원 | 지원 |
| 애니메이션 | 미지원 | 미지원 | 지원 |
| 용량 | 중간 | 큼 | 가장 작음 |
| 호환성 | 전 플랫폼 | 전 플랫폼 | 최신 브라우저 |
결론: 최신 브라우저 대상 웹사이트는 WebP 우선; 전 플랫폼 호환이 필요하면 JPEG/PNG; 투명도 필요하고 작길 원하면 WebP가 최적의 선택입니다.
어떤 시나리오가 WebP에 적합한가
- 웹사이트 이미지: JPEG/PNG 교체, 로딩 속도 향상
- 투명 이미지: 투명 PNG 교체, 용량 대폭 감소
- 움직이는 이미지: GIF 교체, 용량 작고 화질 좋음
- 앱 내 이미지: 패키지 용량 감소
- CDN 이미지 리소스: 트래픽 절약
어떤 시나리오가 부적합한가
- 전 플랫폼 호환이 필요한 대외 문서(PDF 삽화 등 구형 환경)
- 사용자층에 구형 브라우저가 포함된 경우
- 구형 소프트웨어에서 편집해야 하는 경우
어떻게 변환하나
이미지 포맷 변환 도구를 사용:
- JPEG/PNG 업로드
- 목표 포맷 WebP 선택
- 품질 설정(유손실 80이 무손실에 근접한 효과)
- 변환 다운로드
일괄 변환 시 품질을 통일 설정, 사진은 80, 스크린샷은 90.
picture 태그로 호환성 처리
웹사이트에서 WebP를 쓰면서 구형 브라우저도 호환하려면 picture 태그를 사용:
source 태그가 WebP를 우선하고, 미지원 시 img의 JPEG로 폴백합니다. 이렇게 하면 양쪽 모두를 배려합니다.
일반적인 함정
변환 후 용량이 오히려 커짐
무손실 WebP는 때로 작은 JPEG보다 큽니다. 사진류는 유손실 WebP를 사용하고, 무손실은 사용하지 마세요.
품질 100이 무손실은 아님
WebP 품질 100도 여전히 유손실입니다. 진정한 무손실이 필요하면 "무손실 WebP" 옵션을 선택하되, 용량은 커집니다.
투명 PNG를 WebP로 변환 시 투명 유지
WebP는 투명을 지원해 PNG를 WebP로 변환하면 투명 영역이 유지되며, JPG 변환처럼 바닥색을 채울 필요가 없습니다.
요약
WebP는 최신 웹사이트의 이미지 1순위입니다 — 용량이 가장 작고, 기능이 가장 포괄적이며, 호환성도 더 이상 문제가 아닙니다. 사진, 투명 이미지, 움직이는 이미지 모두 가능합니다. DocsAll 포맷 변환 도구로 일괄 WebP 변환, 브라우저에서 처리되어 사진이 업로드되지 않습니다. 구형 환경 호환이 필요할 때는 picture 태그로 폴백을 처리하세요.