화질 저하 없이 이미지를 압축하는 방법

과도하게 큰 이미지는 대부분의 웹페이지에서 가장 무거운 부분이자, 가장 고치기 쉬운 부분입니다. 좋은 소식: “압축했다”고 “흐릿하다”는 뜻이 아닙니다. 다섯 가지 기법을 이 순서대로 적용하세요.

1. 먼저 크기를 줄인다 — 이것이 모든 것을 이긴다

가장 큰 이득은 공짜입니다. 카메라와 휴대폰 사진은 30005000픽셀 폭으로 나오지만 블로그 본문 칼럼은 700900픽셀밖에 표시하지 않습니다. 4000픽셀 이미지를 800픽셀 자리에 서빙하는 것은 아무도 볼 수 없는 디테일에 용량의 80~90%를 낭비하는 일입니다.

이미지를 실제 최대 표시 크기의 2배(고밀도 화면 대응)에 맞추세요. 1440픽셀 뷰포트를 채우는 히어로 이미지도 최대 2880픽셀이면 충분하고, 본문 이미지는 12001600으로 충분합니다. 나머지는 죽은 무게입니다.

2. 올바른 형식을 고른다

형식 선택만으로 같은 결과물을 절반 용량으로 만들 수 있습니다:

• 사진 → JPEG, 더 좋으면 WebP(같은 화질에서 보통 JPEG보다 25~35% 작음)
• 스크린샷, 그래픽, 글자 → PNG 또는 WebP 무손실
• 투명 필요 → PNG 또는 WebP(절대 JPEG 금지)
• 최대 절약 → AVIF, 폴백은 WebP

사진을 PNG에서 JPEG/WebP로 바꾸는 것만으로 70~90%가 줄어드는 일이 드물지 않습니다. PNG는 애초에 사진용으로 설계되지 않았기 때문입니다.

3. 품질의 스위트 스팟을 쓴다

손실 압축의 품질 설정에는 수확 체감의 법칙이 작동합니다: 95에서 75로 내려가면 파일이 절반으로 줄어도 보통 구분이 안 됩니다. 실용 가이드:

• 70~80 — 웹 사진의 스위트 스팟
• 80~90 — 디테일이 중요한 포트폴리오·제품 사진
• 60~70 — 썸네일과 미리보기
• 60 미만 — 아티팩트가 보이기 시작. 공개 콘텐츠에는 금물

고민되면 몇 단계로 압축해 100% 확대에서 비교하세요. 판단은 숫자가 아니라 여러분의 눈이 합니다.

4. 필요 없는 것을 떼어낸다

이미지 파일에는 짐이 실려 있습니다: EXIF 촬영 데이터, GPS 좌표, 컬러 프로파일, 내장 썸네일. 웹 용도로는 이 메타데이터가 거의 순수한 낭비이고, 공개된 사진의 GPS 태그는 위치 정보 유출이 될 수 있습니다.

압축 파이프라인을 통한 재인코딩(Canvas 기반 도구는 자연스럽게 그렇게 함)은 대부분의 메타데이터를 자동으로 떨어뜨립니다. 몇 퍼센트의 절약에 프라이버시 보너스까지 붙습니다.

5. 일괄 처리하고 검산한다

압축은 파일마다 판단이 필요하지만 200장을 위해 슬라이더를 계속 만지고 싶은 사람은 없습니다. 좋은 워크플로:

1. 배치 전체를 도구에 투입
2. 합리적인 프로파일 하나 설정(예: WebP, 품질 78, 최대 너비 1600)
3. 전후 용량표 확인 — 거의 안 줄은 파일은 이미 최적화된 것
4. 중요한 이미지만 원본 해상도로 샘플링 확인

“무손실”이 실제로 주는 것

무손실 압축(PNG, WebP 무손실)은 모든 픽셀을 지키는 대신 사진에서 1020%밖에 줄여 주지 못합니다. 합리적 품질의 손실 압축은 6080%를 줄여도 눈으로 구분되지 않습니다. 사진에서 무손실은 거의 항상 잘못된 거래이며, 아티팩트가 한눈에 드러나는 그래픽을 위해 아껴 둘 것입니다.

업로드 없이 압축하기

이미지가 개인적인 것이거나 고객 작업물이거나 비밀유지 대상이라면 낯선 압축 사이트에 올리는 것은 실재하는 위험입니다. 우리의 이미지 압축기는 Canvas와 WebAssembly로 브라우저 안에서 인코딩합니다 — 파일은 기기를 떠나지 않고, 다운로드 전에 파일별 절감 결과를 확인할 수 있습니다.