쇼핑몰 상품 이미지, 크기와 용량 기준 잡기

2026. 08. 03

상품 상세 페이지를 열었는데 이미지가 한참 뒤에 뜨는 경험, 판매자 입장에서는 매출과 직결됩니다. 방문자는 로딩을 기다려 주지 않습니다.

원인은 대부분 이미지입니다

상세 페이지는 텍스트보다 이미지의 비중이 압도적입니다. 상품 사진 열 장에 상세 설명 이미지까지 붙으면 페이지 하나가 수십 MB가 되기도 합니다. 스마트폰에서 데이터로 접속한 방문자에게는 상당한 부담입니다.

문제는 대부분 두 가지입니다.

쇼핑몰 이미지는 용도별로 필요한 크기가 다릅니다.

고해상도 화면을 고려해 실제 표시 크기의 두 배 정도로 잡는 것이 일반적입니다. 표시 크기가 500픽셀이라면 1000픽셀로 준비하는 식입니다. 그 이상은 방문자가 차이를 느끼기 어렵습니다.

플랫폼이 자체 규격을 안내하는 경우도 많으니, 입점한 곳의 가이드를 먼저 확인하세요. 규격을 벗어나면 플랫폼이 알아서 줄이는데, 그 과정에서 화질이 나빠지기도 합니다.

상품 사진은 JPG나 WebP가 맞습니다. 색이 부드럽게 이어지는 이미지에서는 두 형식의 압축 효율이 좋습니다.

PNG는 배경이 투명해야 할 때만 쓰세요. 누끼를 딴 상품 이미지처럼 배경이 비어 있어야 하는 경우입니다. 배경이 흰색으로 채워진 사진을 PNG로 저장하면 용량만 커지고 얻는 게 없습니다.

WebP는 같은 화질에 더 작습니다. 최신 브라우저는 모두 지원하므로 웹에 올리는 이미지라면 유리합니다. 다만 플랫폼이 WebP 업로드를 받지 않는 경우가 있으니 확인이 필요합니다.

상품 사진이 수십 장이라면 하나씩 편집하는 건 현실적이지 않습니다. 일괄 처리로 접근하세요.

플랫폼에 따라 목록 썸네일을 1:1 정사각형으로 요구합니다. 가로가 긴 사진을 그냥 잘라내면 상품이 화면 밖으로 밀려나기도 합니다.

이럴 때는 잘라내는 대신 여백을 채우는 방식이 안전합니다. 원본 비율을 유지한 채 위아래(또는 좌우)에 배경색을 넣어 정사각형으로 만드는 것입니다. imgzet의 고급 옵션에 1:1 정사각형 패딩이 있고, 배경색을 흰색이나 원하는 색으로 지정할 수 있습니다.

상세 설명을 이미지 한 장으로 길게 만드는 경우가 많습니다. 세로가 1만 픽셀을 넘어가기도 하는데, 이건 몇 가지 문제를 만듭니다.

적당한 단위로 잘라서 여러 장으로 올리는 편이 낫습니다. 위에서부터 순서대로 뜨기 때문에 방문자가 먼저 보이는 부분을 읽는 동안 나머지가 로딩됩니다. 잘린 지점이 어색하지 않도록 문단이나 섹션 경계에서 나누세요.

정리한 이미지는 되돌릴 수 없으니 원본 관리가 중요합니다. 상품 수가 늘어나면 더 그렇습니다.

플랫폼을 옮기거나 규격이 바뀌면 원본에서 다시 만들어야 합니다. 그때 원본이 없으면 촬영부터 다시 해야 합니다.

정리 작업은 한 번 해 두면 계속 효과가 남습니다. 새 상품을 올릴 때도 같은 기준으로 처리하는 습관을 들이면 페이지가 다시 무거워지지 않습니다.