이미지 포맷 선택 가이드 2026: WebP vs AVIF vs JPG 실측 비교
웹사이트 로딩 속도의 상당 부분은 이미지 용량이 좌우합니다. JPG만 쓰던 시절을 지나 WebP, AVIF까지 선택지가 늘었지만, "AVIF가 제일 작다더라"는 말만 믿고 무작정 바꾸면 호환성 문제로 낭패를 볼 수 있습니다. 이 가이드는 세 포맷을 실측 기준으로 비교하고 용도별 선택 기준을 정리합니다.
1. 압축 방식의 차이
JPG는 1990년대에 표준화된 손실 압축 포맷으로 대부분의 환경에서 100% 호환되지만 압축 효율은 가장 낮습니다. WebP는 구글이 2010년 공개한 포맷으로 손실·무손실 압축을 모두 지원하며 JPG 대비 25~35% 작은 용량으로 비슷한 화질을 냅니다. AVIF는 AV1 비디오 코덱 기반의 최신 포맷으로 WebP보다도 20~30% 더 작은 용량을 만들 수 있지만, 인코딩 속도가 느리고 구형 브라우저·이미지 편집 프로그램에서 지원이 불완전합니다.
2. 동일 원본 기준 실측 파일 크기 비교
1920×1080 사진 원본(품질 우선순위: 화질 손실 체감 최소화)을 기준으로 압축했을 때 일반적인 결과는 다음과 같습니다.
| 포맷 | 품질 80 기준 예상 크기 | 브라우저 호환성 |
|---|---|---|
| JPG | 350~450KB | 사실상 100%(모든 환경) |
| WebP | 230~300KB | 주요 브라우저 대부분, 일부 구형 도구 미지원 |
| AVIF | 150~220KB | 최신 브라우저 위주, 구형 환경·일부 CMS 미지원 |
같은 원본을 직접 변환해서 실제 용량을 확인하고 싶다면 WebP 변환기와 AVIF ↔ JPG 변환기로 품질 설정을 바꿔가며 비교해보세요.
3. 투명 배경 처리 시 주의점
PNG의 투명 배경을 WebP나 AVIF로 변환하면 알파 채널(투명도)이 유지되지만, JPG로 변환하면 투명 영역이 흰색 또는 검은색으로 채워집니다. 로고나 아이콘처럼 투명 배경이 필요한 이미지는 JPG를 피하고 WebP를 사용하세요. 반대로 사진처럼 배경이 불투명한 이미지는 포맷 선택에 투명도가 변수가 되지 않습니다.
4. 카카오톡·SNS 공유 시 호환성 이슈
AVIF는 아직 카카오톡, 일부 구형 안드로이드 기기의 기본 갤러리 앱, 오래된 워드프레스 플러그인 등에서 썸네일이 깨지거나 아예 표시되지 않는 사례가 보고됩니다. 불특정 다수에게 공유되는 이미지(블로그 대표 이미지, SNS 카드 등)는 아직 WebP나 JPG가 더 안전하고, 자사 웹사이트 내부에서만 쓰는 이미지(상품 상세 이미지 등)라면 AVIF로 최대한 압축해도 무방합니다.
5. 상황별 선택 가이드
- 웹사이트 성능 최적화(자사 사이트 내부용): AVIF 우선, 폴백으로 WebP 준비
- SNS·메신저 공유용 이미지: JPG 또는 WebP (AVIF 지양)
- 로고·아이콘(투명 배경 필요): WebP 또는 PNG
- 이메일 첨부, 인쇄용: JPG (범용 호환성)
- 용량이 크고 화질 손실을 줄여야 하는 사진 아카이브: WebP 무손실 모드
업로드 전 용량이 너무 크다면 포맷 변경과 별개로 이미지 압축기로 먼저 용량을 줄이고, 특정 픽셀 크기가 필요하면 이미지 리사이저로 규격에 맞추세요. 반대로 WebP·AVIF를 지원하지 않는 구형 시스템에 업로드해야 한다면 PNG → JPG 변환기로 가장 호환성 높은 포맷으로 되돌릴 수 있습니다.
인코딩 속도와 브라우저 디코딩 부담
파일 크기만 보고 AVIF를 무조건 선택하면 안 되는 이유가 하나 더 있습니다. AVIF는 인코딩 연산량이 WebP의 5~10배, JPG의 수십 배에 달해 이미지 수백~수천 장을 일괄 변환하는 배치 작업에서는 서버 CPU 부담과 처리 시간이 크게 늘어납니다. 또한 구형 모바일 기기에서는 AVIF 디코딩(재생) 자체가 느려 오히려 체감 렌더링 속도가 늦어지는 경우도 보고됩니다. 트래픽이 매우 크고 대역폭 절감이 절실한 서비스가 아니라면, 인코딩·디코딩 비용까지 고려해 WebP를 기본값으로, AVIF는 트래픽이 많은 핵심 페이지에만 선택적으로 적용하는 절충안도 현실적입니다.
폴백(fallback) 전략: picture 태그 활용
HTML의 <picture> 태그를 쓰면 브라우저가 지원하는 최적의 포맷을 자동으로 골라 로드하게 만들 수 있습니다. AVIF 소스를 최우선으로 두고, 그다음 WebP, 마지막에 JPG를 폴백으로 지정하면 최신 브라우저는 가장 작은 AVIF를, 구형 브라우저는 자동으로 JPG를 받습니다. 이 방식이라면 "AVIF만 고집하다 일부 사용자에게 이미지가 아예 안 보이는" 최악의 상황을 피하면서도 지원 브라우저에서는 최대 압축 효율을 그대로 누릴 수 있습니다.
자주 묻는 질문
Q. 구글 검색 순위에 이미지 포맷이 영향을 주나요?
직접적인 순위 요소는 아니지만, 페이지 로딩 속도(Core Web Vitals)에 영향을 주고 이는 간접적으로 검색 순위에 반영됩니다. 용량이 작은 포맷일수록 유리합니다.
Q. 아이폰 사진(HEIC)은 어떤 포맷으로 바꿔야 하나요?
범용 호환성이 필요하면 JPG로, 용량 절감이 우선이면 WebP로 변환하는 것을 권장합니다.
Q. 화질 손실 없이 용량만 줄이는 방법이 있나요?
WebP·AVIF의 무손실(lossless) 모드를 사용하면 원본과 픽셀 단위로 동일한 화질을 유지하면서도 PNG보다 작은 용량을 만들 수 있습니다.