WebP vs PNG vs JPG: 어떤 형식을 써야 할까?

짧은 답

사진에는 JPG, 투명도나 픽셀 단위의 선명함이 필요할 때는 PNG, 웹용으로 가장 작은 파일을 원하고 대상이 최신 브라우저를 쓸 때는 WebP를 쓰세요. 이 가이드의 나머지에서는 그 이유를 설명하므로, 간단한 규칙이 들어맞지 않을 때도 자신 있게 판단할 수 있습니다.

각 형식의 압축 방식

JPG는 자연스러운 이미지에 맞춰 조정된 손실 압축을 사용합니다. 눈이 알아차리기 어려운 디테일을 버려서, 부드러운 그라데이션을 가진 작은 파일을 얻지만 투명도는 없습니다. PNG는 무손실입니다. 모든 픽셀을 정확히 재현하고 투명도를 위한 알파 채널을 지원하므로, 로고, 스크린샷, 단단한 가장자리의 그래픽에 이상적이지만 사진에서는 파일이 커지는 대가가 있습니다. WebP는 둘 다 해내는 신참입니다. 비슷한 품질에서 보통 JPG보다 25~35% 작은 손실 모드와, 보통 PNG를 능가하는 투명도 지원 무손실 모드를 제공합니다.

투명도와 가장자리

이미지의 어떤 부분이라도 비쳐 보여야 한다면 JPG는 제외됩니다. 알파 채널이 없어 투명 영역을 흰색으로 채워 버립니다. PNG와 WebP는 둘 다 투명도를 지원합니다. 또렷한 텍스트, UI 요소, 단색 일러스트에서는 PNG와 무손실 WebP가 가장자리를 면도날처럼 날카롭게 유지하지만, JPG는 고대비 선 주위에 희미한 번짐(압축 아티팩트)을 남깁니다.

브라우저와 앱 지원

JPG와 PNG는 보편적입니다. 지난 20년간의 모든 브라우저, 운영체제, 앱이 이를 엽니다. WebP는 현행 주요 브라우저 모두가 지원하지만, 그래도 일부 구형 소프트웨어, 일부 이메일 클라이언트, 그것을 인식하지 못하는 레거시 시스템을 만날 수 있습니다. 마지막 몇 킬로바이트보다 호환성이 더 중요할 때 JPG나 PNG 대체본을 남겨 두는 주된 이유가 바로 이것입니다.

실용적인 결정 흐름

• 최신 대상을 위한 웹용 사진? WebP(손실).
• 어디서나 열려야 하는 사진? JPG.
• 로고, 아이콘, 스크린샷, 또는 투명도가 있는 모든 것? PNG, 또는 크기가 중요하고 지원에 문제가 없다면 무손실 WebP.
• 인쇄나 보관용 마스터? 무손실 사본(PNG 또는 원본)을 남겨 두세요.

무엇을 정하든, 비공개 브라우저 내 변환기로 이 세 형식 사이를 몇 초 만에 오갈 수 있습니다. 그리고 형식을 바꾸지 않고 파일만 작게 하고 싶다면, 전용 압축기가 더 나은 도구입니다.