용도에 맞는 형식 선택
| 형식 | 추천 시작 용도 | 주의할 점 |
|---|---|---|
| AVIF | 배포 파일을 작게 만들고 싶은 사진과 디테일이 풍부한 웹 이미지. | 인코딩이 느릴 수 있습니다. 사용할 앱, 플랫폼 또는 작업 환경이 AVIF를 지원하는지 확인하세요. |
| WebP | 웹 사진, 제품 이미지, 투명도가 필요한 이미지. | 작은 글자나 선명한 가장자리는 더 높은 화질 설정이나 무손실 버전이 필요할 수 있습니다. |
| PNG | 스크린샷, 도표, 로고, 픽셀 아트, 투명한 그래픽. | 큰 사진은 여전히 파일 크기가 클 수 있습니다. 색상 수를 줄이면 색이 달라질 수 있습니다. |
| JPEG | 익숙하고 폭넓게 지원되는 형식이 필요한 사진 작업. | 투명도를 지원하지 않습니다. 손실 인코딩을 반복하면 눈에 보이는 화질 저하가 누적될 수 있습니다. |
이는 시작하기 위한 기준이며 순위가 아닙니다. 같은 페이지에 표시되는 이미지라도 투명한 아이콘과 화면 전체를 채우는 사진에는 서로 다른 형식이 적합할 수 있습니다. 사용처에 업로드 요건이 있다면 해당 요건을 먼저 따르세요.
먼저 필요한 이미지 크기 사용
픽셀 수는 파일 크기에 큰 영향을 줍니다. 너비 6000픽셀 사진은 웹사이트의 작은 카드에 쓰기에는 대체로 필요 이상으로 큽니다. 지원하려는 픽셀 밀도를 고려해 실제 표시 크기에 맞게 조정하세요.
예를 들어 너비 800 CSS 픽셀로 표시되는 이미지라면 2배 픽셀 밀도의 화면을 위해 너비 1600픽셀 원본을 사용할 수 있습니다. 이는 설계 예시이며 모든 상황에 필요한 조건은 아닙니다. 반응형 레이아웃, 자르기 방식, 전송 대역폭에 따라 적절한 선택이 달라집니다.
그다음 화질 조정
손실 형식에서 화질 설정은 인코더가 얼마나 많은 정보를 버릴 수 있는지를 조정합니다. 화질 수치는 코덱마다 다릅니다. JPEG의 ‘80’이 WebP나 AVIF의 ‘80’과 같은 시각적 화질을 의미하지는 않습니다.
- 균형 설정으로 시작하고 실제 표시 크기에서 결과를 확인하세요.
- 100%로 확대해 얼굴, 그라데이션, 글자, 작은 질감, 가장자리 등 중요한 부분을 비교하세요.
- 화질을 조금씩 낮추다가 중요한 변화가 보이면 다시 올리세요.
- 필요한 화질을 충족하면서 실제로 사용할 수 있는 가장 작은 파일을 선택하세요.
절감률뿐 아니라 결과를 확인하세요
원본이 너무 크거나 비효율적으로 인코딩되어 있다면 크기를 크게 줄이기 쉽습니다. 이것만으로 인코더가 더 우수하다고 판단할 수는 없습니다. 같은 이미지 크기, 투명도, 시각적 화질로 비교하세요.
PNG 이해하기: 무손실 압축과 색상 수 줄이기
PNG가 인코딩된 픽셀 데이터를 압축하는 과정은 무손실입니다. 하지만 도구가 인코딩 전에 데이터를 변경할 수 있습니다. 더 작은 팔레트로 색상 수를 줄이면 비슷한 색을 합치므로 파일 크기를 줄일 수 있지만, 시각적인 변화도 생길 수 있습니다.
엄밀한 무손실 처리 방식은 디코딩한 픽셀을 유지하고 저장 방법만 바꿉니다. 색상 수를 줄이는 방식은 단순한 그림에 유용할 수 있지만, 부드러운 그라데이션, 옅은 그림자, 반투명 가장자리는 자세히 살펴봐야 합니다. 디더링은 미세한 패턴을 넣어 색상 단계가 덜 보이게 만들지만, 단색 영역의 노이즈를 늘릴 수도 있습니다.
정확한 픽셀 값이 필요하다면 무손실 처리 방식을 선택하고 그 기준으로 결과를 비교하세요. 형식 이름만으로 전체 변환 과정이 무손실이었다고 보장할 수는 없습니다.
투명도를 고려해 처리하기
PNG, WebP, AVIF는 알파 채널을 저장할 수 있지만 JPEG는 저장할 수 없습니다. 투명한 이미지를 JPEG로 변환할 때는 사용처와 어울리는 배경색을 선택하세요. 그렇지 않으면 배경을 제거한 이미지, 로고, 그림자에 원하지 않는 배경이나 가장자리가 생길 수 있습니다.
투명한 가장자리는 밝은 배경과 어두운 배경 모두에서 확인하세요. 흰 배경에서는 깔끔한 결과도 어두운 페이지에서는 가장자리에 밝은 테두리가 보일 수 있습니다.
AVIF: 작은 파일에 더 많은 처리 필요
AVIF는 유용한 압축 옵션을 제공하지만 인코딩에 많은 처리가 필요할 수 있습니다. 인코딩 처리량을 늘리는 설정은 시각적 화질 설정과 다릅니다. 더 효율적인 데이터 표현을 찾도록 인코더에 더 많은 시간을 허용합니다.
여러 번 재사용할 사진에는 AVIF를 시도해 보세요. 휴대전화에서 빠르게 일괄 처리하려면 WebP나 JPEG가 더 편한 시작점일 수 있습니다. 이미지 크기, 내용, 설정, 기기 성능이 모두 영향을 주므로 일정한 처리 시간을 약속할 수는 없습니다.
원본, 메타데이터, 색상 고려
재인코딩하면 EXIF, 위치 정보, 기타 메타데이터가 삭제될 수 있습니다. 이런 정보가 중요하다면 원본을 보관하세요. 브라우저 디코딩과 인코딩은 색상 프로필, 높은 동적 범위 데이터, 방향 메타데이터에도 영향을 줄 수 있습니다. 색상이 중요한 작업은 최종 사용처에서 확인하세요.
이미 손실 압축된 파일을 반복해서 편집하면 화질이 낮아질 수 있습니다. 가능하다면 각 배포용 버전을 원본에서 생성하세요.
일괄 처리가 느리거나 실패하는 경우
디코딩된 이미지는 압축 파일보다 많은 메모리를 사용합니다. 6000 × 4000 이미지는 8비트 RGBA 픽셀 버퍼 하나에 약 96 MB가 필요합니다. 디코딩, 크기 조정, 인코딩 과정에서는 여러 버퍼가 동시에 필요할 수 있습니다.
탭이 느려지면 한 번에 처리할 파일 수를 줄이거나, 이미지 크기를 줄이거나, 더 빠른 출력 형식을 사용해 보세요. 손상된 파일, 지원하지 않는 이미지 유형, 부족한 기기 메모리도 처리를 막을 수 있습니다. 페이지를 닫거나 새로고침하기 전에 필요한 결과를 저장하세요.
이미지를 더 가볍게 만들까요?
이미지를 선택하고 브라우저에서 더 작은 파일을 만들어 보세요.