이미지는 웹 페이지 총 전송량의 50~70%를 차지하는 경우가 많으며, 로딩 속도에 가장 직접적인 영향을 미치는 요소입니다. 이미지를 압축한다고 해서 반드시 화질을 희생할 필요는 없습니다. 압축 원리를 이해하고, 올바른 포맷을 선택하고, 적절한 품질 매개변수를 설정하면 대부분의 경우 사람 눈으로는 거의 차이를 느낄 수 없으면서도 파일 크기를 60~80% 줄일 수 있습니다.
1. 손실 압축 vs 무손실 압축：원리와 트레이드오프
이미지 압축은 크게 두 가지로 나뉩니다. 어떤 것을 선택할지는 이미지의 용도에 따라 다릅니다：
| 종류 | 원리 | 대표 포맷 | 적합한 용도 |
|---|---|---|---|
| 손실 압축 | 사람 눈으로 잘 인지하지 못하는 고주파 세부사항을 버리며, 압축 후 완전 복원 불가 | JPEG, WebP(손실), AVIF | 사진, 사실적 일러스트, SNS |
| 무손실 압축 | 데이터의 반복 패턴을 인코딩하여 압축하며, 완전 복원 가능 | PNG, WebP(무손실), GIF | 스크린샷, 로고, 아이콘, 정확한 색상이 필요한 디자인 |
흔한 오해：「PNG가 항상 JPEG보다 화질이 좋다」. 화질은 포맷이 아니라 압축 유형과 관련됩니다. PNG는 무손실 포맷으로 스크린샷과 아이콘에 적합하고, JPEG는 손실 포맷으로 사진에 적합합니다. 사진을 PNG로 저장해도 더 선명해지지 않으며, 파일만 더 커집니다.
2. 품질 매개변수(Quality)란 무엇인가？
JPEG와 WebP 손실 모드에는 0~100의 품질 매개변수가 있습니다. 이는 선형이 아니며, 세부사항 버림 정도에 대응합니다：
- 85~95：원본과 거의 구별 불가. 인쇄나 확대 표시에 적합하지만 파일이 큼
- 75~85：웹 사진의 최적 구간 — 사람 눈으로는 거의 차이를 못 느끼면서 파일 크기를 40~60% 줄일 수 있음
- 60~75：썸네일, SNS 이미지에서 허용 가능한 범위. 작은 크기 표시 시 충분한 품질
- 60 미만：압축 아티팩트가 눈에 띄기 시작. 매우 낮은 대역폭의 특수 상황에만 적합
온라인 이미지 도구：이미지 도구는 포맷 변환과 압축을 지원하며, 브라우저 로컬에서 처리됩니다 — 이미지가 서버에 업로드되지 않아 개인정보나 기밀 내용이 포함된 이미지 처리에도 안전합니다.
3. WebP：현대 웹의 최선택 포맷
WebP는 Google이 2010년에 출시한 이미지 포맷으로, 현재 주요 브라우저(Chrome, Firefox, Safari 14+, Edge)에서 모두 지원합니다. 기존 포맷과 비교하면：
| 비교 항목 | JPEG | PNG | WebP |
|---|---|---|---|
| 손실 압축 | 지원 | 미지원 | 지원 (동일 품질에서 JPEG보다 25~35% 작음) |
| 무손실 압축 | 미지원 | 지원 | 지원 (PNG보다 약 26% 작음) |
| 투명도(Alpha) | 미지원 | 지원 | 지원 |
| 애니메이션 | 미지원 | 제한적(APNG) | 지원 |
| 브라우저 지원 | 모든 브라우저 | 모든 브라우저 | 주요 브라우저(IE 미지원) |
포맷 변환하기：이미지 도구로 JPEG, PNG를 WebP로 원클릭 변환하고, 압축 결과와 파일 크기 변화를 실시간으로 미리볼 수 있습니다.
4. PDF 내 이미지
PDF 파일이 과도하게 큰 경우, 대부분은 내부 이미지가 압축되지 않았기 때문입니다. 원본 이미지를 그대로 삽입한 후 PDF 도구로 압축하는 것보다, PDF에 삽입하기 전에 이미지를 적절한 품질(75~85)로 미리 압축하는 것이 더 효과적입니다.
PDF 크기 줄이기：PDF 도구로 PDF 파일을 압축할 수 있습니다. 이미지가 많은 PDF 문서의 크기를 줄이는 데 적합합니다.
요약
- 사진에는 손실 압축(JPEG, WebP), 스크린샷·로고·아이콘에는 무손실 압축(PNG, WebP 무손실)을 사용
- JPEG/WebP 품질 매개변수는 80부터 시작해 아티팩트가 「간신히 보이지 않는」 최솟값을 찾는다
- WebP는 현대 웹에 가장 적합：동일 화질에서 JPEG보다 25~35% 작고, 투명도와 애니메이션도 지원
- 반응형 이미지(srcset)로 각 기기가 자신에게 맞는 해상도의 이미지만 다운로드하도록 한다
- PDF에 삽입하기 전에 이미지를 압축하면 더 예측 가능하고 효과적인 결과를 얻을 수 있다