WebP vs JPG vs PNG — 웹사이트 이미지는 어떤 형식?

세 형식 한눈에

JPG: 사진용 손실 압축, 투명 배경 없음, 어디서나 열림.

PNG: 무손실, 투명 배경 지원, 글자·선이 선명하지만 사진은 용량이 큼.

WebP: 손실·무손실 모두 가능, 투명 배경 지원, 같은 화질에서 JPG·PNG보다 작음.

용량이 왜 중요한가

이미지는 대부분 웹페이지 용량의 가장 큰 비중을 차지합니다. 이미지가 가벼울수록 모바일에서 페이지가 빨리 뜨고, 로딩 속도는 검색 순위와 이탈률에도 영향을 줍니다. 같은 사진이라면 WebP가 JPG보다 보통 25~35% 작고, 투명 PNG를 WebP로 바꾸면 차이가 더 크게 나는 경우가 많습니다.

상황별 추천

상품 사진·배너·블로그 사진: WebP(화질 80~90%). 호환성이 중요한 곳이면 JPG.

로고·아이콘·투명 배경 이미지: WebP 또는 PNG. JPG는 투명한 부분이 흰색으로 채워지니 피하세요.

스크린샷·도표: PNG 또는 무손실에 가까운 고화질 WebP.

메일 첨부·다운로드용 파일: 받는 사람이 바로 열 수 있게 JPG·PNG.

브라우저 지원과 주의점

크롬·엣지·파이어폭스·사파리(iOS 14·macOS Big Sur 이후) 모두 WebP를 지원하므로 일반 웹사이트에서는 걱정할 필요가 거의 없습니다. 다만 일부 오래된 프로그램이나 문서 편집기, 업로드 양식은 WebP를 못 받기도 하니, 파일을 사람에게 직접 건넬 때는 JPG·PNG가 낫습니다.

더 작게 하고 싶다면 AVIF도 선택지지만, 인코딩 지원 범위는 WebP가 더 넓습니다.

WebP로 바꾸는 방법

anyview.dev에 이미지를 여러 장 끌어다 놓고 「WEBP」를 누르면 바로 변환됩니다. 「옵션」에서 화질을 80~90%로 맞추면 대부분 눈으로 차이를 느끼기 어렵습니다. 결과가 여러 개면 「전체 다운로드 (ZIP)」로 받으세요. 파일은 서버에 올라가지 않습니다.