JPG vs PNG vs WebP: 어떤 포맷을 써야 할까?
짧은 답
- 사진이고 투명도가 필요 없다면? JPG를 쓰세요.
- 로고, 아이콘, 스크린샷, 또는 투명도가 필요한 무언가라면? PNG를 쓰세요.
- 가장 작은 파일 용량을 원하고 플랫폼이 지원한다면? WebP를 쓰세요 — JPG와 PNG가 하는 모든 걸 하면서 파일 용량은 대략 25~35% 더 작습니다.
- 짧은 반복 애니메이션뿐이라면? GIF를 쓰세요. 그 외에는 안 됩니다.
한 가지 규칙만 기억해야 한다면 이겁니다: 사진을 절대 PNG로 저장하지 마세요. 가장 흔한 포맷 실수이며, 눈에 보이는 이득 없이 파일을 필요 이상으로 5~10배 크게 만들 수 있습니다.
포맷이 실제로 중요한 이유
모든 포맷은 파일 용량, 화질, 어떤 종류의 이미지 콘텐츠를 잘 다루는지 사이에서 서로 다른 트레이드오프를 갖습니다. 잘못된 것을 고르면 공간만 낭비하는 게 아니라 눈에 띄게 더 나쁜 결과가 나올 수도 있습니다.
| 포맷 | 압축 방식 | 투명도 | 적합한 경우 |
|---|---|---|---|
| JPG | 손실 압축 | 없음 | 사진, 그라데이션, 복잡한 색상 |
| PNG | 무손실 압축 | 있음 | 로고, 아이콘, 텍스트, 단색, 스크린샷 |
| WebP | 손실 또는 무손실 | 있음 | 거의 모든 것 — 현대적인 기본값 |
| GIF | 무손실, 제한된 색상 | 있음(이진만) | 짧고 단순한 애니메이션 |
JPG: 사진을 위해 만들어짐
JPG는 손실 압축을 사용합니다. 즉 공간을 절약하기 위해 일부 이미지 데이터를 버리지만, 부드러운 그라데이션과 복잡한 색상 변화를 가진 사진의 특성에 맞게 특별히 튜닝되어 있습니다. 이것이 적절한 품질 설정으로 저장한 JPG 사진이 원본과 거의 똑같아 보이면서도 용량은 훨씬 작은 이유입니다.
JPG의 약점은 선명한 경계, 단색, 텍스트에서 드러납니다. 압축 아티팩트 — 블록 모양의 얼룩이나 흐릿한 후광 — 는 경계가 뚜렷한 곳에서 가장 쉽게 나타나는데, 이는 정확히 로고, 아이콘, 스크린샷의 특징입니다.
PNG: 사진이 아니라 그래픽을 위해 만들어짐
PNG는 무손실 압축을 사용합니다 — 데이터가 버려지지 않으므로 PNG는 항상 픽셀 단위로 완벽하게 보입니다. 이는 로고, 아이콘, UI 스크린샷, 단색이나 텍스트가 있는 모든 것에 이상적입니다. 이런 곳에서는 JPG의 아티팩트가 눈에 확 띌 것입니다.
트레이드오프는 파일 용량입니다. 무손실 압축은 JPG의 손실 방식만큼 사진을 줄이지 못합니다. 사진은 PNG의 압축 방식이 효율적으로 처리하기에는 색상 변화가 너무 많기 때문입니다. JPG 사진은 200 KB일 수 있지만, 같은 사진을 PNG로 저장하면 쉽게 2 MB 이상이 됩니다.
PNG는 또한 신뢰할 수 있는 투명도를 지원하는 유일한 클래식 포맷이라, 배경 제거 같은 도구의 기본 출력 형식으로 쓰입니다.
WebP: 현대적인 만능 선수
WebP는 대부분의 용도에서 JPG와 PNG를 모두 대체하도록 만들어졌습니다. 손실·무손실 압축을 모두 지원하고, 투명도를 처리하며, 비슷한 품질의 JPG나 PNG보다 보통 25~35% 더 작은 파일을 만들어냅니다.
브라우저와 플랫폼 지원이 거의 보편적인 수준이 되었으므로, 아주 오래된 소프트웨어와의 최대 호환성이 필요한 특별한 이유가 없다면 WebP는 웹에 올리는 무엇에든 안전한 기본 선택입니다.
GIF: 단순한 애니메이션 전용
GIF는 256색으로 제한되어 있고, 정적인 콘텐츠에는 현대적인 대안보다 눈에 띄게 큰 파일을 만듭니다. GIF에 남은 유일한 역할은 짧고 단순한 반복 애니메이션입니다. 정적인 이미지라면 — 아무리 단순한 그래픽이라도 — PNG나 WebP가 항상 더 좋아 보이고 더 빨리 로드됩니다.
흔한 실수
“안전하게” 사진을 PNG로 저장하기. 이미지 포맷 관련해서 가장 비용이 큰 습관입니다. 아무것도 손실되지 않으니 안전하게 느껴지지만, 사진의 경우 그 파일 용량 비용은 거의 그만한 가치가 없습니다.
로고나 스크린샷을 JPG로 저장하기. 텍스트와 선명한 경계 주변의 압축 아티팩트는 흔히 즉시 눈에 띄며, 특히 파일 크기를 조절하거나 확대했을 때 더 그렇습니다.
포맷만으로 파일 용량이 해결된다고 착각하기. 포맷은 이미지가 어떻게 압축되는지를 결정하지, 얼마나 압축할지를 결정하지 않습니다. 최고 품질로 저장된 JPG도 여전히 불필요하게 클 수 있습니다 — 포맷과 압축 설정은 서로 대체하는 게 아니라 함께 작동합니다.
실용적인 작업 순서
- 콘텐츠에 맞춰 포맷을 고르세요. 사진 → JPG 또는 WebP. 투명도나 단색이 있는 그래픽 → PNG 또는 WebP.
- 필요하면 변환하세요. 파일이 현재 어떤 포맷인지 모르거나 포맷을 바꿔야 한다면, 대부분의 압축과 크기 조절 도구가 처리 과정에서 출력 포맷을 선택할 수 있게 해줍니다.
- 포맷을 정한 뒤에 압축하세요, 먼저 압축하지 마세요. 다음 단계는 화질 저하 없이 이미지 압축하는 방법을 참고하세요.
빠른 참고
- 사진 → JPG(지원된다면 WebP)
- 로고, 아이콘, 스크린샷, 투명도 → PNG(지원된다면 WebP)
- 단순 애니메이션만 → GIF
- 확실하지 않고 플랫폼이 지원한다면 → WebP가 더 작은 용량으로 두 경우 모두 커버함