본문으로 건너뛰기

WebP·AVIF·JPG — 어떤 걸 고를까?

이미지 형식을 잘못 고르면 「안 열린다」거나 「필요 이상으로 무겁다」로 끝나기 쉽습니다. 공유·제출이라면 지금도 JPG가 가장 무난하고, 내가 직접 올리는 사이트라면 WebP가 실용적인 본선입니다. 더 줄이려면 AVIF지만, 못 읽는 환경을 위한 대비가 필요합니다. 메일 첨부·상품 목록·블로그 메인 이미지처럼 자주 있는 상황별 고르는 법과, 바로 쓸 수 있는 변환 페이지 링크를 모았습니다.

약어보다, 누가 보는지부터

오래된 태블릿으로 메일을 여는 가족에게 여행 사진을 보낸다면 JPG 그대로가 안심입니다. 공공 양식, 은행 업로드, JPEG만 받는 인쇄소에서도 호환성을 걸 이유는 거의 없습니다.

내 사이트·블로그·상품 카탈로그이고 방문자가 대체로 최신 브라우저라면 WebP가 맞습니다. 느낌은 JPG에 가깝고 용량은 꽤 줄어드는 경우가 많으며, 투명도 됩니다.

트래픽이 많은 페이지에서 `<picture>`로 여러 소스를 줄 수 있다면 AVIF를 시험할 만합니다. 다만 못 읽는 기기용 JPG·WebP 백업 없이 AVIF만 배포하지는 마세요.

JPG: 가장 잘 통하는 사진 형식

JPEG는 사진용 손실 압축입니다. 인물·풍경·행사 사진처럼 휴대폰·PC·CMS·SNS가 거의 예외 없이 엽니다.

투명 배경, 단색 로고, 글자를 또렷이 남겨야 하는 UI 스크린샷에는 맞지 않습니다. 그쪽은 PNG나 WebP입니다.

「JPG로 저장」을 반복할수록 화질이 조금씩 깎입니다. 가능하면 깨끗한 원본에서 한 번만 내보내세요.

WebP: 지금 웹의 본선

비슷한 느낌이라면 WebP가 JPG보다 가벼운 경우가 많습니다. JPEG에 없는 알파(투명)도 쓸 수 있습니다.

정적 호스팅·CDN·많은 사이트 프레임워크는 이미 WebP 제공을 지원합니다. 예외는 메일 클라이언트로, 첨부를 JPEG처럼 다루는 경우가 많아 뉴스레터 안 이미지는 JPG가 무난합니다.

무거운 PNG 스크린샷은 PNG로 다시 저장하는 것보다 WebP로 바꾸는 편이 더 작아지기 쉽습니다. 그래서 PNG 압축 기본 출력이 WebP입니다.

AVIF: 더 작지만 손도 더 감

복잡한 사진에서는 AVIF가 WebP보다 더 작아지는 일이 흔합니다. 대신 인코딩이 느리고, 구형 기기·앱 안 WebView에서는 미지원 구멍이 남습니다.

운영에서는 `<picture>`로 AVIF를 앞에 두고 WebP나 JPG를 폴백으로 두어, 브라우저가 읽을 수 있는 최선의 형식을 고르게 하는 게 정석입니다.

빌드가 AVIF 변환 시간에 막히거나 폴백이 아직 없다면, 먼저 WebP만 제대로 써도 효과가 충분한 경우가 많습니다.

고르는 기준(대략)

상대 기기를 통제할 수 없는 공유·제출 → JPG.

내 사이트의 히어로·목록(폴백 있음) → WebP. 여유가 있으면 AVIF + WebP/JPG.

웹 투명 → WebP 또는 PNG. 구형 환경까지 넓게 맞추려면 PNG.

메일 본문에 넣는 이미지 → 대개 JPG.

고민되면 → WebP와 JPG를 둘 다 내보내고 이미지 압축에서 용량과 느낌을 나란히 비교.

형식만으로는 부족 — 크기와 화질도

너비 4000px 사진을 WebP로 바꿔도 표시 폭에 맞게 줄이지 않으면 그대로 무겁습니다. 먼저 표시 크기로 리사이즈한 뒤 형식을 정하세요.

형식과 치수가 정해지면 압축으로 마지막을 깎을 수 있습니다. 손실로 내보낼 때는 원본을 남기고, 같은 파일을 여러 번 다시 압축하지 마세요.

올리기 전에 압축

형식이 정해지면 [[image-compressor|이미지 압축]]으로 용량과 미리보기를 비교한 뒤 CDN이나 실서비스에 올리세요.

이미지 압축 열기

형식에 대한 자주 묻는 질문

이 사이트에서 형식을 바꿀 수 있나요?
됩니다. JPG→WebP, PNG→AVIF, WebP→JPG를 쓰거나 이미지 압축에서 출력 형식을 고르세요.
변환하면 화질이 떨어지나요?
손실 형식끼리 바꾸거나 같은 파일을 여러 번 인코드하면 블록 노이즈가 보일 수 있습니다. 깨끗한 원본에서 한 번만 변환하고, 미리보기로 직접 판단하세요.
SVG는 이 비교에서 어디에 들어가나요?
SVG는 아이콘·단순 일러스트용 벡터라 사진 형식을 대체하지 않습니다. 마크·UI 아이콘은 SVG, 사진은 JPG·WebP·AVIF로 나누면 됩니다.
아이폰 HEIC 사진은?
HEIC는 기기 안 저장에는 좋지만 웹·Windows에서는 불편합니다. 공개 전에 JPG나 WebP로. Windows에서 안 열리면 Windows에서 HEIC를 보세요.
JPG로 투명을 유지할 수 있나요?
아니요. JPEG에는 투명이 없습니다. PNG·WebP를 쓰거나, JPG로 바꾸기 전에 투명 PNG→JPG로 배경을 채우세요.

변환해 보기