이미지 용량을 줄이는 순서 — 해상도 먼저, 품질값은 그다음

1. 순서가 결과를 좌우합니다

용량을 줄일 때 대부분 품질 슬라이더부터 내립니다. 하지만 효과가 큰 순서는 반대입니다.

필요한 표시 크기까지 해상도를 줄인다

포맷을 적절히 고른다

품질값을 조정한다

가로 4000px 사진을 웹에서 800px로 표시한다면, 나머지 3200px는 데이터만 차지하고 화면에는 기여하지 않습니다. 해상도를 1/5로 줄이면 픽셀 수는 1/25이 됩니다. 품질값을 아무리 낮춰도 이만한 절감은 나오지 않습니다.

2. 손실 압축과 무손실 압축

무손실(PNG, WebP 무손실): 원본 픽셀이 그대로 복원됩니다. 스크린샷, 도형, 텍스트가 든 이미지에 적합합니다.

손실(JPEG, WebP 손실, AVIF): 사람 눈이 덜 민감한 정보를 버립니다. 사진에 적합합니다.

손실 압축은 되돌릴 수 없습니다. 한 번 저장한 JPEG를 다시 저장하면 손실이 누적됩니다. 원본을 보관하고 사본을 압축하세요.

3. 포맷 고르기

| 포맷 | 잘 맞는 대상 | 특징 |
|---|---|---|
| JPEG | 사진 | 호환성 최고, 투명도 없음 |
| PNG | 스크린샷, 로고, 도형 | 무손실, 투명도 지원, 사진에는 용량 과다 |
| WebP | 대부분의 웹 이미지 | JPEG보다 25~35% 작음, 투명도·애니메이션 지원 |
| AVIF | 사진 | WebP보다 더 작지만 인코딩이 느림 |

스크린샷을 JPEG로 저장하는 것은 흔한 실수입니다. 글자 경계에 지저분한 얼룩(아티팩트)이 생기고 용량도 PNG보다 크게 줄지 않습니다.

4. 품질값은 어디까지 내려야 할까

JPEG·WebP 품질값은 0.75~0.85 구간이 실용적인 균형점으로 알려져 있습니다.

0.9 이상: 용량은 큰데 눈에 띄는 차이는 거의 없음

0.75~0.85: 대부분의 사진에서 열화가 잘 보이지 않음

0.6 이하: 하늘, 피부처럼 완만한 그라데이션에서 띠(banding)가 보이기 시작

정답은 이미지마다 다르므로, 실제 표시 크기에서 눈으로 비교하는 것이 가장 확실합니다.

5. 왜 사진 용량이 줄면 개인정보도 정리될까

스마트폰 사진에는 EXIF 메타데이터가 붙습니다. 여기에는 촬영 일시, 기기 모델, 그리고 설정에 따라 GPS 좌표까지 들어갑니다. 집에서 찍은 사진을 그대로 올리면 위치가 노출될 수 있습니다.

캔버스를 통해 다시 그리는 방식의 압축 도구는 대개 EXIF가 제거됩니다. 다만 도구마다 동작이 다르므로 중요한 경우에는 결과 파일의 속성을 확인하세요.

6. 웹 성능 관점

페이지에서 가장 큰 이미지는 보통 LCP(Largest Contentful Paint) 요소입니다. 즉 이미지 용량이 곧 체감 로딩 속도입니다.

화면에 보이는 크기의 2배(고해상도 디스플레이 대응)까지만 준비합니다.

첫 화면에 안 보이는 이미지에는 loading="lazy"를 붙입니다.

이미지에 width와 height를 지정해 레이아웃 밀림(CLS)을 막습니다.

7. 도구

EVEDAYS 이미지 압축기는 브라우저 안에서 압축과 PNG/JPG/WebP 상호 변환을 처리합니다. 업로드 과정이 없으므로 전송 중 파일이 노출될 위험이 없습니다. 다만 이 방식이 기기 자체의 악성코드 감염까지 막아주지는 않습니다.

8. 출처

web.dev — Optimize images

MDN — Image file type and format guide