shadcn.io— shadcn/ui 블록 수천 개
본문으로 건너뛰기

스크린샷이 2MB인 이유, 그리고 60~90% 줄이는 법

한번은 디자인 리뷰 메일 한 묶음에 담긴 스크린샷을 세어 봤습니다. 열한 장, 전부 PNG, 각각 평균 2MB 남짓이었습니다. 20여 MB의 거의 흰 대시보드가, 모두 다른 탭에 같은 앱을 열어 둔 여섯 사람 사이를 오갔습니다. 아무도 신경 쓰지 않았습니다. 「잘 됐으니까」요. 그게 함정입니다. 스크린샷은 조용히 거대하고, 그 이유는 컴퓨터가 스크린샷을 찍는 방식에 새겨져 있습니다.

스크린샷이 2MB짜리 파일인 이유

스크린샷 단축키를 누르면 운영체제가 PNG로 저장합니다. 합리적인 기본값입니다. PNG는 무손실이라 캡처가 픽셀 단위로 완벽하고, 또렷한 글자로 가득한 스크린샷에는 그게 진짜로 옳은 본능입니다. 문제는 PNG가 용량을 어떻게 다루느냐입니다.

PNG는 모든 픽셀을 정확히 저장합니다. 요즘 화면은 촘촘합니다. Retina나 4K 디스플레이의 전체 창 캡처는 가로 2,000픽셀이 넘을 수 있고, PNG는 그 수백만 픽셀을 하나하나 온전한 충실도로 성실히 기록합니다. 화면의 60%가 같은 거의 흰색이든 말든 상관하지 않습니다. 아무것도 버리지 않는데, 버리는 게 PNG가 하는 일이 아니기 때문입니다. 그래서 거의 빈 설정 페이지 스크린샷은, 눈으로는 거의 아무것도 없는데도 여전히 1.5~2.5MB가 나갑니다. 내용이 성글어도 캔버스가 거대하기 때문입니다.

해법: WebP로 변환하기

WebP는 PNG가 못 하는 일을 합니다. 또렷한 가장자리와 투명함을 지키면서 손실 압축을 하는 것입니다. 스크린샷에서는 특히 그 조합이 마술에 가깝습니다. 스크린샷은 대개 평평한 면(압축이 싼 부분)에 약간의 글자(WebP가 또렷하게 지키는 부분)로 이루어져 있으니까요. 손실 단계가 눈에 안 띄는 잡음을 버리고, 눈은 불평을 접수하지 않습니다.

제 디스크에 있는 스크린샷의 실제 수치입니다.

스크린샷PNG로WebP로
거의 흰 설정 페이지1.6MB~180KB
꽉 찬 분석 대시보드2.4MB~310KB
다크 모드 코드 편집기1.9MB~240KB

대략 85~90% 깎였고, 나란히 놓아도 어느 것이 어느 것인지 구분할 수 없습니다. 글자는 픽셀 단위까지 또렷하게 남습니다. 제가 하는 변환 중 수익률이 가장 높은데, 스크린샷이 애초에 터무니없이 과체중이기 때문입니다. 짜낼 「아무것도 아닌 것」이 어마어마하게 많은 겁니다.

「글자가 흐려지지 않나요?」

이게 두려움이고, 정당한 두려움입니다. 흐릿한 후광이 낀 글자의 JPG 스크린샷을 봤을 테고, 모든 손실 형식이 그런 줄 짐작했을 테니까요. WebP는 가장자리를 JPG보다 잘 다룹니다. 눈에 띄게 낫습니다. 적당한 품질 설정이면 WebP 스크린샷의 글자는 또렷하게 남습니다. 글자꼴 둘레의 잡티를 찾겠다고 400%까지 확대해 봤지만 평범한 UI 캡처에서는 빈손이었습니다.

솔직한 예외는 이겁니다. 아주 작은 파일을 쫓아 품질을 세게 낮추면 결국 글자가 무너지는 게 보이기 시작합니다. 해법은 그러지 않는 것입니다. 중간 품질 설정이면 이미 글자를 지킨 채로 60~90% 이득을 줍니다. 무너지는 구간까지 밀어 넣을 이유가 없습니다.

줄이는 게 도움 안 되는 때

PNG를 그냥 두는 경우가 둘 있습니다.

스크린샷이 마크업이나 주석이나 합성을 위해 디자인 도구로 다시 들어간다면 무손실로 유지합니다. WebP의 손실 단계는 한 방향 문이고, 곧 편집해서 다시 내보낼 것에 압축을 새겨 넣고 싶지는 않습니다. WebP를 내보내고 PNG 원본을 지킨다. 늘 같은 규칙입니다.

그리고 스크린샷이 이미 작다면, 즉 작게 잘라 낸 세부나 버튼 하나처럼 이미 약 100KB 아래라면, 변환은 바늘을 거의 못 움직입니다. 60~90% 이득은 캔버스가 거대해서 큰 파일에서 나옵니다. 작게 자른 것은 그 문제를 이미 해결한 셈입니다. 아무것도 없는데 단계만 늘리지 마세요.

제가 실제로 하는 방법

스크린샷이 메일이나 문서 근처에 가기 전에 이 사이트의 PNG를 WebP로 변환하는 도구에 통과시킵니다. 브라우저 안에서 일어나서, 솔직히 화면 절반과 배경에 있던 것까지 자주 담기는 그 캡처가 기기를 절대 벗어나지 않습니다. PNG를 넣고, 용량 열이 무너지는 것을 보고, WebP를 내려받아 대신 첨부하세요.

더 큰 요점은 도구가 아니라 반사 습관입니다. 「스크린샷, 그다음 줄이기」가 자동이 되면, 이미 앱을 열어 둔 사람들에게 2MB 이미지를 쏘는 일이 사라지고, 메일은 더 빨리 보내지고, 스레드가 수십 MB로 부푸는 일이 멈춥니다. 그 열한 장짜리 메일도 20여 MB가 아니라 약 2MB로 끝났을 겁니다. 같은 그림, 같은 모든 것. 다만 죽은 무게가 없을 뿐입니다.

관련 글


전체 글