지금 읽는 곳화질 손실 없는 압축률의 표준값이 공개돼 있나목차
S2 › 상품 콘텐츠·미디어 제작 › 과목 224 › 레슨 04
상세페이지 이미지 용량 최적화: 화질 손실 없이 로딩 속도를 개선하는 압축 기준
품질 계수 몇 퍼센트가 정답인지는 어디에도 공개돼 있지 않습니다. 그 기준선을 우리 상품 이미지로 직접 만드는 절차가 이 글의 내용입니다.
핵심요약
- 압축 품질 계수의 표준값을 정한 공식 문서는 확인되지 않는다. 구글 공식 문서가 제시하는 것은 포맷 간 평균 용량 감소폭이지 권장 품질값이 아니다
- 포맷 교체가 품질 계수 조정보다 먼저다. WebP 손실 압축은 동등 화질 JPEG보다 파일이 25~34퍼센트 작고, 무손실 WebP는 PNG보다 26퍼센트 작다
- 품질 기준선은 우리 상품 컷으로 만든다. 색 재현이 까다로운 컷을 표본으로 잡고 품질 계수를 낮춰가며 육안 판별이 깨지는 지점 바로 위를 사내 기준으로 고정한다
- 용량을 줄여도 LCP가 안 나오면 문제는 압축이 아니라 로딩 순서다. 첫 화면 최대 이미지는 지연 로딩하지 않고 fetchpriority를 high로 올린다
- 지연 로딩을 잘못 구현하면 구글이 이미지를 보지 못해 색인에서 누락될 수 있다. 변경 후 서치 콘솔에서 색인 상태를 함께 본다
화질 손실 없는 압축률의 표준값이 공개돼 있나
JPEG 품질 80퍼센트가 최적이라는 식의 기준은 실무에서 널리 인용되지만, 이 값을 표준으로 정한 공식 문서는 이번 조사에서 확인되지 않았습니다. 구글 WebP 공식 문서가 확인해 주는 것은 포맷 간 평균 용량 비교값이고, 구글 web.dev의 LCP 최적화 가이드도 이미지 압축을 강화하라고 권고할 뿐 구체적인 품질 계수를 제시하지 않습니다.
이유는 단순합니다. 같은 품질 계수라도 피사체에 따라 결과가 전혀 다르기 때문입니다. 단색 배경에 놓인 금속 제품과 니트 조직이 살아야 하는 의류 컷은 같은 값에서 무너지는 지점이 다릅니다. 그래서 이 글은 정답 수치 대신, 우리 상품군에서 그 지점을 찾아내는 절차를 기준으로 삼습니다.
포맷을 바꾸면 실제로 얼마나 줄어드나
품질 계수를 만지기 전에 포맷부터 확인하는 편이 효율이 좋습니다. 구글 공식 WebP 문서에 따르면 WebP 손실 압축 이미지는 동등한 화질의 JPEG보다 파일 크기가 25에서 34퍼센트 작고, 무손실 WebP 이미지는 PNG보다 26퍼센트 작습니다. 구글이 웹에서 임의 추출한 약 100만 장을 재인코딩한 초기 연구에서는 평균 39퍼센트가 줄었습니다.
누끼 컷이 많은 상품군이라면 절감 폭이 더 큽니다. WebP는 손실과 무손실 양쪽에서 투명도(알파 채널)를 지원하므로, 투명 배경 때문에 PNG로 올리던 이미지를 그대로 대체할 수 있습니다. web.dev도 LCP 리소스 크기를 줄이는 방법으로 압축 강화, WebP·AVIF 같은 최신 포맷, 화면 크기에 맞춘 반응형 이미지, CDN, 캐시 정책을 함께 제시합니다.
주의할 점은 받아주는 쪽입니다. 오래된 브라우저와 일부 저작 도구, 일부 국내 서비스 업로더는 WebP를 지원하지 않습니다. 자사몰은 전환할 수 있어도 오픈마켓 상품 등록 화면은 확장자 제한이 걸릴 수 있으므로, 업로드 대상별로 받아주는 확장자를 먼저 확인하고 원본은 별도로 보관합니다.
우리 상품 이미지의 품질 기준선은 어떻게 정하나
절차는 네 단계로 잡습니다. 첫째, 우리 카테고리에서 색과 질감 재현이 가장 까다로운 컷 다섯 장을 표본으로 고릅니다. 반품 사유 상위 항목이 색상 차이라면 그 상품군 컷이 표본이 됩니다. 둘째, 같은 원본을 품질 계수를 단계적으로 낮춰가며 인코딩합니다.
셋째, 판정은 모니터 확대가 아니라 실제 노출 환경에서 합니다. 상품 목록의 썸네일 크기와 상세페이지 확대 보기 두 가지로 열어 육안 차이가 보이기 시작하는 지점을 찾고, 그 바로 위 단계를 사내 기준값으로 고정합니다. 넷째, 고정한 값을 카테고리별로 문서에 적고 확인한 날짜를 함께 남깁니다. 원본 촬영 조건이 바뀌면 이 값도 다시 잡아야 하기 때문입니다.
용량을 줄였는데 속도가 안 나오면 어디를 봐야 하나
이미지를 절반으로 줄였는데 지표가 그대로라면 문제는 압축이 아니라 로딩 순서입니다. 구글 코어 웹 바이탈 기준으로 LCP는 2.5초 이내, INP는 200밀리초 이내, CLS는 0.1 이하가 양호 등급이고, 판정은 파일 용량이 아니라 이 결과 지표로 합니다.
web.dev는 LCP를 첫 바이트까지의 시간, 리소스 로드 지연, 리소스 로드 시간, 요소 렌더 지연 네 구간으로 나누고 잘 최적화된 페이지의 배분 기준으로 첫 바이트 약 40퍼센트, 리소스 로드 지연 10퍼센트 미만, 리소스 로드 시간 약 40퍼센트, 요소 렌더 지연 10퍼센트 미만을 제시합니다. 압축이 줄여 주는 것은 리소스 로드 시간 구간뿐입니다. 로드 지연 구간이 부풀어 있다면 첫 화면 최대 이미지가 늦게 발견되고 있다는 뜻이고, 이때 필요한 조치는 초기 HTML에서 발견 가능하게 두고 fetchpriority를 high로 올리는 쪽입니다. 구글은 LCP 이미지를 지연 로딩하면 항상 불필요한 지연으로 이어진다고 명시합니다.
압축과 지연 로딩이 검색 노출을 깎는 지점은 어디인가
구글 서치 센트럴은 지연 로딩이 성능과 사용자 경험 면에서 모범 사례이지만 잘못 구현하면 구글이 콘텐츠를 보지 못해 색인에서 누락될 수 있다고 경고하며, 뷰포트에 들어오는 시점에 관련 콘텐츠가 모두 로드되도록 구현할 것을 요구합니다. 상세페이지 이미지를 전부 지연 로딩으로 돌리면 속도 점수는 좋아져도 이미지 검색 유입이 줄 수 있습니다.
같은 이유로 반응형 이미지를 쓸 때도 폴백을 빼면 안 됩니다. 구글 이미지 SEO 권장사항은 picture 요소나 img 요소의 srcset 속성으로 반응형 이미지를 제공하되 src 속성으로 폴백 URL을 항상 지정하라고 안내하고, 이미지 사이트맵 사용과 지원 포맷 사용을 함께 권장합니다. 변경 후에는 서치 콘솔에서 색인 상태를 확인해 속도와 노출을 같이 봅니다.
판매자센터 업로드 규격은 어떤 제약을 먼저 거나
자사몰에서 정한 기준이 마켓플레이스에서 그대로 통하지는 않습니다. 국내 마켓플레이스 상품 이미지 실무 가이드는 대표 이미지 권장 크기를 1000×1000픽셀, 최소 한 변 500픽셀로 제시하고, 300픽셀 미만이거나 3000×3000픽셀·4MB를 넘는 파일, 가로세로 비율이 1대2를 넘는 이미지는 피하라고 안내합니다. 다만 이 가이드는 주로 쿠팡 기준으로 정리된 2차 자료이며 공식 공지 원문과 대조된 것이 아닙니다.
네이버 스마트스토어의 대표 이미지 규격은 이번 조사에서 공식 문서로 확인하지 못했습니다. 셀러 대상 2차 자료에 수치가 널리 돌지만 원문 대조가 되지 않았으므로 여기서 숫자를 단정하지 않습니다. 확인 경로는 스마트스토어센터에 로그인한 뒤 상품등록 화면의 이미지 등록 안내와 판매자 공지이며, 확인한 날짜를 사내 문서에 함께 적어 두는 편이 안전합니다. 대표 이미지 규격은 상품 제재로 이어질 수 있는 항목이라 옛 규격으로 계속 운영하는 것이 가장 위험합니다.