CodeKitHub왜 사용해야 할까요?
- 네이버 스마트스토어나 쿠팡에 상품 사진 30장을 올려야 하는데 휴대폰 원본이 장당 5MB일 때 — 30장을 한꺼번에 드롭하면 각각 개별 다운로드 버튼이 생겨 하나씩 처리할 필요가 없습니다.
- 압축하려는 사진에 가족 얼굴이나 아직 공개하지 않은 제품 디자인이 담겨 있을 때 — 모든 처리가 내 기기 안에서 끝나고, "대신 압축해준다"는 낯선 서버로 사진이 올라갈 일이 없습니다.
- 구글 페이지스피드에서 배너 이미지 3MB 때문에 속도 점수가 낮게 나올 때 — 최대 폭을 1920px, 화질을 75%로 낮추면 배너는 여전히 선명한데 용량은 몇 분의 1로 줄어듭니다.
- 고객에게 이메일로 사진을 첨부해야 하는데 메일함 용량 제한이 25MB일 때 — 미리 압축해두면 용량 초과로 반송되는 일을 막을 수 있습니다.
- 각 사진마다 JPG와 WebP 중 무엇이 나을지 확신이 안 설 때 — 이미지별 정확한 절감률을 보여주므로 추측 대신 숫자로 비교해서 고를 수 있습니다.
자주 묻는 질문
압축하면 이미지가 안 좋아 보이나요?
70~85% 화질에서는 화면으로 보는 사진의 차이가 사실상 눈에 띄지 않습니다. 눈에 보이는 손상은 약 50% 이하부터 나타납니다. 텍스트가 많은 스크린샷은 예외입니다 — JPG에서는 손상이 더 일찍 나타나므로 WebP 출력을 쓰거나 화질을 85% 이상으로 유지하세요.
파일 크기나 개수 제한이 있나요?
없습니다. 압축이 서버가 아니라 기기에서 실행되므로 제한할 게 없습니다 — 50MB짜리 이미지 하나든, 100개짜리 일괄 처리든 상관없습니다. 매우 큰 이미지는 조금 더 시간이 걸릴 뿐입니다.
제 이미지가 어딘가에 업로드되나요?
아닙니다. 파일은 HTML5 캔버스 API를 사용해 브라우저에서 전부 읽고 다시 인코딩됩니다. 이 페이지를 로드한 뒤 인터넷을 끊고도 계속 압축할 수 있습니다.
JPG와 WebP 중 어떤 걸 출력해야 하나요?
WebP는 같은 시각적 화질에서 보통 25~35% 더 작고 최신 브라우저에서 모두 작동합니다 — 웹사이트용으로 최선입니다. JPG는 오래된 소프트웨어와 프린터를 포함해 어디서든 열립니다 — 공유와 이메일용으로 최선입니다. 확신이 서지 않으면 JPG를 선택하세요.
제 PNG는 왜 그렇게 많이 줄어들었나요?
PNG는 무손실 방식이라 사진에는 비용이 큽니다 — 사진을 담은 PNG는 시각적으로 동일한 JPG보다 5~10배 더 큰 경우가 흔합니다. 사진 PNG를 JPG/WebP로 변환하면 가장 큰 절감 효과를 얻습니다. PNG는 투명도나 날카로운 경계가 필요한 그래픽에만 유지하세요.
출력이 원본보다 더 커질 때도 있는 이유는요?
이미지가 이미 강하게 압축되어 있었다면 다시 인코딩해도 도움이 안 되고 오히려 용량이 늘어날 수 있습니다. 이 도구는 이런 경우를 알려주므로, 그럴 땐 원본을 그대로 유지하면 됩니다.
손실 압축과 무손실 압축은 어떻게 다른가요?
손실 압축(JPG, 낮은 화질의 WebP)은 눈으로 알아채기 힘든 디테일을 영구히 버려서 용량을 크게 줄입니다. 무손실 압축(PNG)은 어떤 디테일도 잃지 않고 데이터를 더 효율적으로 재배열만 하므로 용량 절감 폭이 훨씬 작습니다. 이 도구는 JPG/WebP에 선택한 화질 수준에 따른 손실 압축을 적용합니다.
이미지의 EXIF 데이터(GPS 위치, 카메라 기종)도 제거되나요?
네 — 이미지가 HTML5 캔버스로 처음부터 다시 그려져 새 파일로 출력되므로, 원본 EXIF 메타데이터(휴대폰 위치 정보가 켜져 있었다면 GPS 좌표 포함)는 결과 파일에 남지 않습니다. 사진을 공개적으로 올릴 때 촬영 위치를 노출하고 싶지 않다면 유용한 부수 효과입니다.
압축 없이 포맷만 변환할 수 있나요?
기술적으로는 가능합니다 — 화질을 최댓값(100%에 가깝게)으로 설정하면 시각적 화질을 거의 원본 그대로 유지하면서 PNG를 JPG나 WebP로 바꿀 수 있습니다. 다만 용량 변화 없이 포맷만 바꾸는 게 목적이라면 전용 PNG to JPG 변환기를 쓰는 편이 더 직관적입니다.
이 도구는 무엇인가요?
이미지 압축기는 더 효율적인(손실) 설정으로 이미지를 다시 인코딩해 파일 크기를 줄입니다. 휴대폰 카메라 사진은 보통 3~8MB인데, 웹사이트나 채팅 메시지, 이메일에서는 200~500KB만 되어도 화면에서는 똑같아 보입니다. 이미지가 작아지면 업로드도, 로딩도 빨라지고 저장 공간과 대역폭도 절약됩니다.
이 도구는 브라우저 자체 코덱으로 원하는 화질에 맞춰 이미지를 다시 인코딩하며, 필요하면 지나치게 큰 이미지를 적당한 최대 가로 폭으로 축소하기도 합니다 — 파일 크기에 가장 큰 영향을 주는 두 가지 수단입니다. 압축 강도와 눈에 보이는 화질은 언제나 트레이드오프 관계이며, 실시간으로 보여주는 전후 용량 비교를 통해 이미지마다 적절한 지점을 찾을 수 있습니다.
포맷 비교: 용량 기준 JPG vs WebP vs PNG
같은 사진, 같은 시각적 화질이라도 용량은 완전히 다릅니다: PNG는 가장 무겁고(무손실 — 사진에서는 JPG보다 5~10배 큰 경우가 많음), JPG는 범용적인 중간값이며, WebP는 보통 JPG보다 25~35% 더 작습니다. 그래서 사진의 압축 우선순위는 이렇습니다: 먼저 PNG에서 벗어나고, 호환성이 필요하면 JPG, 최소 용량이 필요하면 WebP를 선택하세요.
그래픽은 상황이 반대입니다: 스크린샷, 로고, 단색 UI 이미지의 경우 팔레트 양자화된 PNG가 대개 용량과 선명도 모두에서 JPG를 앞섭니다 — JPG의 사진용 압축 방식은 날카로운 경계를 뭉개기 때문입니다. 이 경우를 위한 전용 도구는 아래에 있습니다.
| 콘텐츠 유형 | 최적 포맷 | 이유 |
|---|---|---|
| 웹/이메일/채팅용 사진 | WebP(호환성이 필요하면 JPG) | 손실 압축이 사진의 디테일에 적합하며, WebP는 같은 화질에서 JPG보다 25~35% 더 작습니다. |
| 스크린샷, 로고, 단색 UI | PNG | 무손실 — JPG의 사진용 압축은 선명한 텍스트와 날카로운 경계를 흐리게 만듭니다. |
| 투명도가 필요한 이미지 | PNG 또는 WebP | JPG에는 알파 채널이 없고, PNG와 WebP는 둘 다 투명 배경을 지원합니다. |
| 최대 호환성(구형 소프트웨어, 프린터) | JPG | 1990년대부터 보편적으로 지원되며, WebP 지원은 더 최근이지만 브라우저에서는 이제 거의 보편적입니다. |
성능 참고사항
- 화질을 더 낮추기 전에 먼저 크기를 줄이세요: 4000px에서 1920px로 줄이면 픽셀의 약 77%가 사라집니다 — 어떤 화질 슬라이더도 이만큼의 효과는 낼 수 없습니다.
- 일괄 처리는 CPU에서 순차적으로 실행됩니다. 휴대폰 사진 100장이면 노트북에서 몇 분 정도 걸립니다. 서버 대기열이 없으므로 업로드 기반 사이트보다 대체로 더 빠르고, 오프라인에서도 작동합니다.
- −% 숫자가 여러분의 판단 기준입니다: 한 자릿수로 나온다면 이미지가 이미 최적화된 상태이며, 화질을 더 낮춰봐야 용량 절감보다 화질 손상이 먼저 옵니다.
- 웹 게시용으로는 콘텐츠 이미지는 200KB 이하, 전체 폭 히어로 이미지는 500KB 이하를 목표로 하면 모바일 환경에서 Core Web Vitals를 넉넉하게 지킬 수 있습니다.
SNS에 사진 올릴 때 EXIF 개인정보 주의점
- 위치 정보를 켠 상태로 찍은 휴대폰 사진에는 정확한 GPS 좌표가 EXIF 메타데이터에 남습니다 — 중고거래 카페나 당근마켓에 원본을 그대로 올리면 EXIF를 읽을 줄 아는 사람은 촬영 장소를 알아낼 수 있습니다.
- 이 도구로 압축하면 이미지가 캔버스로 완전히 다시 그려지므로 EXIF가 전부 사라집니다. 용량을 줄이는 김에 개인정보도 함께 정리되는 셈입니다.
- 쇼핑몰 상품 사진이라면 EXIF 제거로 촬영에 쓴 카메라나 휴대폰 기종 정보도 함께 지워집니다 — 매장에서 어떤 장비를 쓰는지 노출하고 싶지 않을 때 유용합니다.
- 구글 포토처럼 촬영 날짜·위치로 사진을 정리하는 개인 보관용 앨범을 쓴다면, 압축 전에 원본을 따로 보관하세요. 압축된 파일에는 그 정보가 남아있지 않습니다.
직접 테스트한 결과
이 도구를 출시하기 전에 생성한 테스트 이미지로 직접 돌려보고 눈으로만이 아니라 픽셀 단위로 결과를 확인했습니다. 3000×2000 다색상 PNG는 75% 화질과 1920px 제한으로 140KB에서 94KB(−33%)로 줄었고, 테스트 이미지가 합성 이미지였기 때문에 어떤 픽셀도 JPG 코덱의 예상 허용 오차 이상으로 벗어나지 않았음을 확인할 수 있었습니다. 이미 최적화된 파일 경고가 조용히 더 큰 파일을 만드는 대신 제대로 작동하는지도 확인했습니다 — 이미 강하게 압축된 JPG를 넣으면 도움이 됐다고 속이는 대신 원본을 유지하라고 알려줍니다.
사용 방법
- 이미지를 박스에 드롭하거나 클릭해서 선택하세요 — JPG, PNG, WebP를 지원합니다.
- 화질을 설정하세요: 75%가 균형 잡힌 값이고, 최대한 절감하려면 60%까지 낮추세요.
- 최대 폭을 고르세요 — 전체 화면 웹 용도라면 1920px이면 충분합니다.
- JPG(범용) 또는 WebP(더 작고 최신 브라우저 전부 지원) 출력을 선택하세요.
- 각 결과 옆의 다운로드를 클릭하세요. 파일별로 용량과 절감률이 표시됩니다.
예시
- 입력
phone-photo.jpg — 4.20MB, 4032×3024- 결과
phone-photo-compressed.jpg — 0.48MB(−89%), 1920×1440
1920px로 크기를 줄이고 75% 화질로 재인코딩: 어떤 화면에서도 시각적으로 동일하지만 용량은 9분의 1입니다.