PNG는 거대하다는 나쁜 평판을 얻는데, 마땅합니다 — 아이콘 하나가 어떻게든 사진 전체보다 무거울 수 있으니까요. 반가운 소식은, 그 부풀림 대부분이 낭비이고, 애초에 PNG가 필요했던 이유인 선명한 가장자리와 투명 배경을 유지하면서 그것을 걷어낼 수 있다는 것입니다.
PNG가 그렇게 큰 이유
PNG는 무손실 형식입니다. JPEG와 달리 아무것도 버리지 않습니다 — 모든 픽셀을 정확히 저장하죠. 선명한 로고, 아이콘, UI 스크린샷에는 완벽하지만, 파일이 많은 데이터를 정직하게 기술해야 한다는 뜻입니다.
진짜 원흉은 색 심도 입니다. 표준 PNG는 최대 1,600만 색(24비트)에 완전한 투명도 채널까지 저장할 수 있습니다. 하지만 여러분의 로고는 아마 열몇 가지 색을 씁니다. 아이콘 세트라면 쉰 개쯤이겠죠. 그 쓰지 않은 색 용량이 여전히 바이트를 잡아먹습니다. 스무 개면 되는 그림을 그리려고 1,600만 색 캔버스 값을 치르는 셈입니다.
두 번째 함정이 있습니다. 사람들이 사진 을 PNG로 저장하는 것이죠. 사진은 정말로 수백만 색과 미묘한 그라데이션을 쓰므로 PNG가 잘 압축하지 못합니다 — 파일이 같은 사진의 JPEG나 WebP보다 5~10배 커집니다. 여러분의 "PNG 문제"가 사실 사진이라면, 해법은 압축이 아니라 변환입니다.
양자화: 투명도를 지키는 해법
진짜 PNG — 평면 색, 선명한 가장자리, 투명도 — 에는 승리의 수가 색 양자화(color quantization) 입니다. 수백만 가능한 색을 저장하는 대신, 이미지를 신중하게 고른 256색 팔레트 로 줄입니다. 어차피 여러분 이미지가 그중 일부밖에 쓰지 않았으므로, 결과는 똑같아 보이면서 파일은 60~80% 줄어듭니다.
사람들이 걱정하는 부분: 이게 투명 배경을 파괴하지 않나? 아니요. 양자화는 색 팔레트를 줄이지만, 투명도(알파) 채널은 보존됩니다. 여러분의 로고는 여전히 어떤 배경에도 깔끔하게 놓입니다 — 흰 상자도, 회색 테두리도 없습니다. 이것은 잘 알려진 "tinify" 방식 PNG 최적화기가 쓰는 것과 같은 기법이며, 그들이 투명 PNG를 그토록 극적으로 줄일 수 있는 이유입니다.
IMG.DIY의 이미지 압축기는 PNG에 256색 양자화를 자동으로 적용합니다. 화질 숫자를 고르지 않습니다 — 무손실 형식에는 화질 슬라이더가 없죠 — 파일을 넣기만 하면 투명도가 온전한 훨씬 작은 PNG를 얻습니다.
투명 PNG를 위한 빠른 체크리스트
- 정말 그래픽인지, 사진이 아닌지 확인하세요. 로고, 아이콘, 일러스트, UI 컷 → PNG로 압축. 사진 → WebP(투명도도 지원)나 JPEG(지원 안 함)로 변환.
- 과대한 치수를 줄이세요. 200px로 표시되는 2000px 아이콘은 필요한 픽셀의 100배입니다. 먼저 폭을 제한하세요 — 압축기에 선택적 폭 제한이 있습니다.
- 양자화하세요. 256색 축소가 무거운 일을 하게 두세요. 투명도는 살아남습니다.
- 가장자리를 검증하세요. 100%로 열어 복잡한 배경에 대고 알파 가장자리가 깔끔한지 확인하세요.
일괄 처리하고, 비공개로 유지하기
아이콘 세트 전체나 내보낸 그래픽 폴더가 있다면 하나씩 할 필요 없습니다. 압축기는 일괄 처리하고 ZIP을 돌려주며, 원본보다 큰 파일을 절대 출력하지 않습니다 — 그래서 이미 빡빡한 PNG 폴더가 실수로 커지지 않습니다.
모든 것이 Canvas와 WebAssembly로 전적으로 여러분 브라우저에서 실행됩니다. 여러분의 PNG는 절대 어디로도 업로드되지 않고, 첫 방문 이후 도구는 캐시되어 오프라인에서 작동합니다. 신호가 없는 기차에서 고객의 브랜드 자산을 압축해도 아무것도 노트북을 떠나지 않습니다.
요점: PNG가 큰 이유는 쓰지도 않는 색 용량을 쌓아 두기 때문입니다. 256색으로 양자화하고, 투명도를 유지하고, 눈에 보이는 변화 없이 파일이 줄어드는 것을 지켜보세요.