JPG·PNG·WebP, 언제 무엇을 쓰고 용량은 어떻게 줄일까

제출 양식에 “500KB 이하 JPG”라고 적혀 있거나, 블로그에 올린 사진이 너무 무겁다는 경고를 받을 때가 있습니다. 이럴 때 형식만 바꾸면 해결될 것 같지만, 형식을 잘못 고르면 오히려 용량이 커지기도 합니다. 이 글은 JPG·PNG·WebP의 차이와 이미지에 맞는 형식을 고르는 법, 그리고 목표 용량에 맞춰 줄이는 순서를 설명합니다.

세 형식은 압축 방식과 투명도가 다릅니다

형식	압축	투명한 배경	움직이는 이미지	잘 맞는 이미지
JPG	손실	지원하지 않음	지원하지 않음	사진
PNG	무손실	지원	기본 PNG는 지원하지 않음	스크린샷, 도표, 로고처럼 선과 글자가 또렷한 이미지
WebP	손실과 무손실 모두	지원	지원	사진과 그래픽 모두

손실 압축은 사람 눈에 덜 띄는 정보를 버려서 용량을 줄입니다. 사진에는 효과가 크지만, 글자나 선처럼 경계가 또렷한 이미지에서는 테두리가 뭉개지거나 얼룩이 생기기 쉽습니다.
무손실 압축은 원래 픽셀을 그대로 되살릴 수 있게 저장합니다. 화질은 그대로지만, 사진처럼 색이 복잡한 이미지에서는 용량이 커집니다.
WebP는 두 방식을 모두 쓸 수 있습니다. Google은 같은 화질 기준에서 손실 WebP가 JPG보다 25 ~ 34%, 무손실 WebP가 PNG보다 26% 작다고 밝히고 있습니다. 다만 이미지마다 결과는 다릅니다.

이미지 종류에 맞는 형식 고르기

사진: JPG나 WebP를 씁니다. PNG로 저장하면 화질은 같아도 용량이 몇 배로 커질 수 있습니다.
스크린샷·도표·글자가 많은 이미지: PNG나 무손실 WebP가 낫습니다. JPG로 저장하면 글자 주변이 흐려집니다.
투명한 배경이 필요한 로고·서명: PNG나 WebP를 씁니다. JPG는 투명도를 담지 못해 투명한 부분이 흰색 등 단색으로 채워집니다.
단순한 도형으로 된 아이콘·로고·도표: 가능하면 SVG를 씁니다. SVG는 픽셀이 아니라 선과 도형을 기록하는 벡터 형식이라, 크기를 키워도 깨지지 않고 용량도 아주 작습니다. 사진처럼 색이 복잡한 이미지에는 맞지 않습니다.
제출처가 형식을 정해 둔 경우: 그 형식을 따릅니다. WebP는 최근 브라우저 대부분이 지원하지만, 오래된 프로그램이나 일부 제출 시스템은 받지 않을 수 있습니다.

실제 예로, 이 사이트도 도구 페이지에 넣는 설명 그림을 처음에는 PNG로 올렸다가 WebP와 SVG로 바꿨습니다. 색과 그러데이션이 많은 그림 61장은 WebP로 바꾸자 합계가 약 36MB에서 약 2.7MB로 줄었습니다(약 92% 감소). 한 장에 1MB가 넘던 그림 중에는 100KB 안팎이 된 것도 있습니다. 단순한 도형으로 그린 이미지 도구의 그림은 SVG로 만들어, 같은 그림을 PNG로 저장하면 34KB인데 SVG는 1KB도 되지 않았습니다. 같은 그림이라도 내용에 맞는 형식을 고르면 화면에서 보이는 모습은 거의 그대로 두고 용량만 크게 줄일 수 있습니다.

형식을 바꿔도 용량이 줄지 않는 경우

형식 변환은 이미지를 새 형식으로 다시 압축하는 일이지, 용량을 줄이는 기능이 아닙니다. 다음 경우에는 오히려 커지거나 화질만 나빠집니다.

JPG 사진을 PNG로 바꾸면 대개 용량이 커집니다. 무손실 압축은 사진의 복잡한 색을 효율적으로 줄이지 못하기 때문입니다.
이미 많이 압축된 JPG를 다시 JPG로 저장하면 손실이 한 번 더 일어납니다. 용량은 조금 줄어도 화질은 원래보다 나빠지고, 버린 정보는 되살아나지 않습니다.
화질이 낮은 이미지를 PNG로 바꿔도 화질은 좋아지지 않습니다. 이미 사라진 정보를 형식이 되살려 주지는 않습니다.

용량을 줄이는 것이 목적이라면, 형식보다 아래의 두 가지를 먼저 보는 편이 확실합니다.

용량을 줄이는 두 가지 방법: 품질과 픽셀 수

품질은 손실 압축에서 정보를 얼마나 버릴지 정하는 값입니다. 브라우저에서 이미지를 만들 때는 0 ~ 1 사이의 값으로 정하며, JPG와 WebP처럼 손실 압축을 하는 형식에만 적용됩니다. PNG에는 품질 값이 없습니다. 품질을 조금 낮추면 눈에 띄는 차이 없이 용량이 크게 줄어드는 경우가 많지만, 너무 낮추면 경계가 깨지고 얼룩이 생깁니다.

픽셀 수는 이미지의 가로 × 세로입니다. 가로와 세로를 각각 절반으로 줄이면 픽셀 수는 4분의 1이 되므로 용량도 크게 줄어듭니다. 화면에서 보거나 문서에 넣을 이미지라면, 휴대전화 카메라의 원본 해상도가 필요한 경우는 많지 않습니다.

목표 용량에 맞출 때는 보통 다음 순서가 좋습니다.

사진이면 JPG나 WebP, 그래픽이면 PNG처럼 이미지에 맞는 형식을 고릅니다.
실제로 쓸 크기보다 픽셀이 훨씬 많으면, 먼저 가로·세로를 쓸 크기에 맞게 줄입니다.
JPG·WebP라면 품질을 낮춰 가며 목표 용량 안에 들어오는 가장 높은 품질을 찾습니다.
품질을 낮춰도 목표에 못 미치면 픽셀 수를 조금 더 줄입니다. PNG는 품질 값이 없으므로 이 방법만 쓸 수 있습니다.

KB가 1,000바이트인지 1,024바이트인지 확인하세요

“500KB 이하”라고 할 때 1KB를 1,000바이트로 보는 곳도 있고 1,024바이트로 보는 곳도 있습니다. 차이는 2.4%로 작지만, 제한에 딱 맞춰 저장하면 한쪽 기준으로는 넘을 수 있습니다. 제출처의 기준을 모르면 목표 용량을 제한보다 조금 낮게 잡는 것이 안전합니다.

줄인 뒤에 확인할 것

원본은 따로 보관합니다. 줄이거나 다시 압축한 이미지는 원래 화질로 되돌릴 수 없습니다.
결과를 원래 크기로 확인합니다. 작은 미리보기에서는 괜찮아 보여도, 크게 보면 글자가 뭉개졌거나 얼룩이 생겼을 수 있습니다.
투명한 부분이 있었다면 형식을 확인합니다. JPG로 저장하면 투명한 배경이 단색으로 바뀝니다.
촬영 정보가 빠질 수 있습니다. 브라우저에서 이미지를 다시 그려 저장하면, 촬영 날짜나 위치 같은 메타데이터가 보통 함께 저장되지 않습니다. 정보를 지우고 싶을 때는 장점이지만, 꼭 남겨야 하는 경우라면 원본을 쓰세요.