PNG와 JPG의 가장 근본적인 차이는 압축 방식에 있습니다. JPG는 손실 압축(lossy)을 써서 데이터 일부를 버리고 파일을 작게 만듭니다. PNG는 무손실 압축(lossless)을 써서 모든 픽셀을 원본 그대로 지킵니다. 이 차이 하나가 화질과 파일 크기, 투명도 지원, 그리고 각 형식이 어디에 어울리는지까지 전부 결정합니다.
한눈에 보는 비교
| 항목 | PNG | JPG |
|---|---|---|
| 압축 방식 | 무손실(Lossless) | 손실(Lossy) |
| 투명도(알파 채널) | ✅ 지원 | ❌ 미지원 |
| 사진에 적합 | ❌ 부적합 — 파일이 큼 | ✅ 적합 — 매우 효율적 |
| 로고와 아이콘에 적합 | ✅ 적합 — 경계가 또렷함 | ❌ 부적합 — 아티팩트가 보임 |
| 글자가 있는 화면 캡처에 적합 | ✅ 적합 | ❌ 부적합 — 글자가 뭉개짐 |
| 파일 크기(사진) | JPG보다 3~10배 큼 | 기준(1×) |
| 다시 저장해도 손실이 쌓이지 않음 | ✅ 적합 | ❌ 아님 — 저장할 때마다 나빠짐 |
| 호환성 | 어디서나 지원 | 어디서나 지원 |
| 애니메이션 지원 | ❌ 자체 지원 없음 | ❌ 미지원 |
각 형식은 이미지를 어떻게 압축할까
JPG는 이미지를 8×8 픽셀 블록으로 나눈 뒤 이산 코사인 변환(DCT)을 적용해, 사람 눈이 잘 알아채지 못하는 고주파 정보를 걷어냅니다. 그러데이션이 부드럽고 색 변화가 자연스러운 사진에서는 이렇게 버린 정보가 거의 티 나지 않습니다. 반대로 경계가 또렷하거나 색이 균일한 영역, 그러니까 글자와 로고, 아이콘에서는 8×8 블록이 눈에 보이는 얼룩을 남깁니다. 이것을 JPEG 아티팩트라고 부릅니다.
PNG은 DEFLATE 알고리즘(무손실 압축)으로 픽셀 데이터를 더 효율적으로 재배열할 뿐, 아무것도 버리지 않습니다. 픽셀 하나하나가 정확히 보존됩니다. 사진에는 이 방식이 비효율적입니다. 화질은 그대로인데 파일만 거대해집니다. 반면 경계가 또렷하고 색이 균일한 이미지에서는 아티팩트가 아예 없다는 점이 결정적인 차이를 만듭니다.
⚠️ JPG 재압축은 조심하십시오: JPG를 열어 다시 저장할 때마다 이미 압축된 데이터 위에 압축이 또 얹힙니다. 5~10번쯤 반복하면 화질 저하가 눈에 보이기 시작합니다. 작업은 항상 원본 파일에서 하고, JPG로 내보내는 것은 맨 마지막 단계에서만 하십시오.
PNG를 써야 할 때
- 배경이 투명해야 하는 로고, 아이콘, 브랜드 마크
- 글자가 들어간 화면 캡처
- 경계가 또렷한 인포그래픽과 일러스트
- 여러 번 편집하고 다시 저장할 이미지
- 단색 면이 많은 디지털 아트
JPG를 써야 할 때
- 웹사이트, 블로그, 쇼핑몰에 올리는 사진
- 제품 이미지, 배너, 웹사이트 대표 이미지
- 투명 배경이 필요 없는 모든 사진
- 이메일 마케팅(호환성이 가장 확실합니다)
- 사진 인화
그럼 WebP는요?
WebP는 둘 모두와 경쟁하는 최신 형식입니다. 사진에서는 JPG보다 25~35%, 그래픽에서는 PNG보다 20~30% 작은 파일을 만들면서 투명도까지 지원합니다. 2026년의 웹이라면 JPG나 PNG를 쓰던 자리 거의 전부에서 WebP가 가장 효율적인 선택입니다. 자세한 비교는 PNG vs WebP와 JPG vs WebP에서 확인하실 수 있습니다.