Shopify는 어떤 마켓플레이스보다 더 넉넉한 업로드 한도를 제공합니다. 5000×5000픽셀, 파일당 20MB, 다양한 포맷을 지원합니다. 하지만 이 자유가 곧 함정이기도 합니다. 판매자들은 카메라에서 나온 원본을 그대로 올리고, 테마가 예상치 못한 방식으로 잘라내며, 모바일 방문자는 메인 이미지를 4초간 기다리다가 이탈하고, 이탈률은 조용히 올라갑니다. 이 글은 Shopify 판매자가 상품 이미지에 대해 실제로 가장 많이 묻는 10가지 질문(사양, 테마, 성능, SEO, 배리언트)에 결정에 필요한 구체적 수치와 함께 답합니다.
Shopify 상품 이미지는 어떤 크기여야 하나요?
2048×2048픽셀, 정사각형으로 업로드합니다. Shopify 공식 문서가 권장 마스터 크기로 제시하는 값이며, 모든 주요 테마가 이 기준으로 설계되어 있습니다.
| 이미지 용도 | 권장 크기 | 종횡비 | 이 크기인 이유 |
|---|---|---|---|
| 상품 이미지 (마스터) | 2048×2048 px | 1:1 | 줌 + 레티나 디스플레이 대응 |
| 상품 이미지 (최소) | 800×800 px | 1:1 | 이보다 작으면 줌 기능이 작동하지 않음 |
| 컬렉션 이미지 | 1024×1024 px | 1:1 | 테마 그리드 표시용 |
| 히어로/배너 | 1920×1080 px | 16:9 | 데스크톱 풀 와이드 |
| 슬라이드쇼 | 1600×500 ~ 1920×600 px | 3:1 ~ 4:1 | 테마에 따라 상이 |
| 로고 | 450×200 px | 약 2:1 | 헤더 표시 |
| 파비콘 | 32×32 px | 1:1 | 브라우저 탭 |
업로드 한도: 5000×5000 px, 20MB. 이를 초과하면 거부됩니다. 하지만 "업로드 가능"과 "업로드해야 함"은 다릅니다. 아래 파일 크기 섹션을 참고하세요.
페이지 속도를 빠르게 유지하는 파일 크기는?
Shopify 자체 가이드는 상품 이미지당 200~500KB를 실전 목표치로 제시하며, 모바일 트래픽이 많은 스토어는 200~300KB에 가깝게 맞춰야 합니다.
왜 중요할까요? 이미지 용량이 100KB 증가할 때마다 4G 모바일 환경에서 대략 150~300ms의 로딩 시간이 추가됩니다. 10개 이미지가 각 2MB인 상품 페이지는 총 20MB의 페이로드가 되며, 느린 모바일 네트워크에서는 30초 이상 걸립니다. Shopify 자체 데이터도 이 수치가 장바구니 이탈률과 강하게 상관된다는 점을 보여줍니다.
| 이미지 용량 | 로딩 시간 (4G) | 발생하는 현상 |
|---|---|---|
| <200KB | <1초 | 빠름, 체감 지연 없음 |
| 200~500KB | 1~2초 | 히어로/상품 이미지로 무난함 |
| 500KB~1MB | 2~4초 | 지연이 느껴지고 이탈 위험 상승 |
| >1MB | >4초 | 모바일에서 이탈률 급증 |
Shopify는 자동으로 이미지를 압축하고 지원 브라우저에 WebP 버전을 제공하지만, 원본이 최적화되어 있을 때만 효과가 제대로 납니다. 15MB PNG를 올리면 Shopify가 압축하긴 하지만 자동 압축은 보수적이므로, 업로드 전에 JPEG 품질 80~85로 직접 압축하는 편이 훨씬 나은 결과를 줍니다.
JPEG, PNG, WebP, SVG 중 어느 것을 써야 하나요?
포맷 선택은 이미지 유형에 따라 달라집니다.
| 포맷 | 적합한 용도 | 피해야 할 용도 | 비고 |
|---|---|---|---|
| JPEG | 상품 사진, 라이프스타일 컷 | 투명도가 필요한 이미지 | 품질 80~85가 최적점 |
| PNG | 로고, 아이콘, 투명 배경이 필요한 인포그래픽 | 사진(파일 용량 과다) | 알파 채널이 필요할 때만 사용 |
| WebP | 가능하면 모든 용도 | 구형 브라우저(2026년엔 드문 이슈) | 동일 품질 JPEG보다 25~35% 작음 |
| SVG | 아이콘, 로고, 단순 그래픽 | 상품 사진 | 무한 확대 가능, 초경량 파일 |
| GIF | 애니메이션 데모(최소한) | 그 외 모든 용도 | 애니메이션은 MP4/WebM이 낫습니다 |
Shopify는 업로드 포맷과 상관없이 지원 브라우저에 자동으로 WebP를 제공하므로 업로드 포맷 자체에 스트레스 받을 필요는 없습니다. 원본이 고품질인지, 파일 크기 목표 내인지에 집중하세요. 상품 사진이라면 JPEG 품질 85가 안전한 기본값입니다.
Shopify에서 반드시 정사각형 이미지를 써야 하나요?
아니요. 다만 쓰는 편이 좋습니다. 대부분의 Shopify 테마는 기본적으로 정사각형 그리드로 표시하며, 정사각형이 아닌 이미지는 잘립니다. 테마가 1:1을 기대하는데 4:3을 올리면, 상품의 위쪽이나 아래쪽이 잘리거나 이미지가 흰 여백이 있는 박스 안에 떠서 주변 이미지와 어색하게 보입니다.
정사각형이 통하는 경우: 기본 상품 그리드, 컬렉션 페이지, 검색 결과, 관련 상품 캐러셀. 전체의 90%가 여기에 해당합니다.
세로형(3:4 또는 4:5)을 선택할 수 있는 경우: 전신 모델컷 중심의 패션 스토어처럼 세로 구도가 중요한 경우입니다. 이때는 세로 비율에 맞춰 설계된 테마(설정 가능한 Dawn, Impact, Impulse)가 필요하며, 정사각형 기본 테마에 세로 이미지를 억지로 넣지 마세요.
가로형(16:9)이 맞는 경우: 히어로 배너, 보조 이미지로 쓰는 분위기 연출 라이프스타일 컷. 정사각형 그리드 테마의 메인 상품 이미지로는 절대 쓰지 마세요.
안전한 워크플로: 필요한 것보다 넓게 촬영하고, 마스터 상품 이미지는 2048×2048 정사각형으로 크롭한 뒤, 다른 각도별로 추가 2048×2048 배리언트를 만듭니다. 가로 구도는 배너와 슬라이드쇼에만 사용합니다.
Shopify 테마가 이미지 표시에 어떻게 영향을 미치나요?
테마마다 이미지를 자르고 사이즈를 맞추는 방식이 다릅니다. "사이트에서 사진이 이상하게 보인다"는 불만의 가장 흔한 원인이 바로 이것입니다. 이미지 사양을 최종 확정하기 전에 실제 사용하는 테마에서 반드시 테스트하세요.
| 테마 | 상품 페이지 크롭 | 컬렉션 그리드 | 비고 |
|---|---|---|---|
| Dawn (Shopify 기본) | 설정 가능(정사각/세로/가로/원본) | 상품 페이지 설정과 동일 | 가장 유연함 |
| Debut | 정사각 강제 | 정사각 | 엄격한 1:1 표시 |
| Impact | 세로 친화적 | 설정 가능 | 패션 최적화 |
| Motion | 풀블리드, 테마 제어 | 카드 스타일 | 애니메이션 중심 |
| Minimal | 패딩과 함께 중앙 정렬 | 정사각 | 정사각이 아니면 흰 여백 추가 |
실전 테스트: 업로드 후 상품 페이지와 컬렉션 페이지를 데스크톱과 모바일에서 확인하세요. 크롭이 이상해 보이면 원본 이미지를 수정하세요. 테마 CSS를 손대는 건 테마 업데이트 시 깨지므로 권장하지 않습니다.
Amazon과 eBay와 비교하면 어떤가요?
동일한 상품 이미지 라이브러리로 여러 채널에 판매한다면, 사양 차이가 중요하게 작용합니다.
| 사양 | Shopify | Amazon | eBay |
|---|---|---|---|
| 권장 크기 | 2048×2048 px | 2000×2000 px | 1600×1600 px |
| 최소 크기 | 800×800 px | 1000×1000 px (줌용) | 500×500 px |
| 최대 크기 | 5000×5000 px, 20MB | 가장 긴 변 10000 px | 7MB |
| 종횡비 | 테마에 따라 유연 | 1:1 필수 | 1:1 권장 |
| 배경 | 자유 선택 | 순수 흰색 (메인 이미지) | 깔끔하게, 흰색 의무 아님 |
| 로고/워터마크 | 허용 | 메인 이미지에서 금지 | 메인에서 금지 |
| 텍스트 오버레이 | 허용 | 메인 금지, 보조 이미지 허용 | 메인에서 제한적 |
| 파일 포맷 | JPEG, PNG, WebP, GIF, SVG | JPEG, PNG, TIFF, GIF | JPEG, PNG, GIF, BMP, TIFF |
실전 시사점: Amazon 규정을 만족하는 이미지(2000×2000 순수 흰 배경, 텍스트 없음) 한 장이면 어디서나 쓸 수 있지만, 라이프스타일이나 인포그래픽 이미지가 더 잘 전환되는 Shopify에서는 너무 밋밋해 보일 수 있습니다. 2048×2048 깔끔한 배경의 마스터 이미지를 기본으로, 그 위에 레이어를 얹은 배리언트를 쌓아 이미지 라이브러리를 구축하세요.
SEO를 위한 대체 텍스트(alt text)는 어떻게 작성하나요?
대체 텍스트는 세 가지 독자를 위한 것입니다. 스크린 리더, Google 이미지 검색, 이미지가 깨졌을 때의 폴백입니다. 앞 두 가지를 염두에 두고 쓰면 세 번째는 자연히 해결됩니다.
좋은 대체 텍스트 공식: [상품명] [핵심 설명자] [필요시 맥락]
| 이미지 유형 | 약한 대체 텍스트 | 강한 대체 텍스트 |
|---|---|---|
| 메인 상품 | "흰색 머그" | "매트 마감 12oz 화이트 세라믹 커피 머그" |
| 컬러 배리언트 | "빨간색 버전" | "매트 마감 12oz 레드 세라믹 커피 머그" |
| 라이프스타일 컷 | "테이블 위 머그" | "아침 커피가 담긴 원목 식탁 위 화이트 세라믹 머그" |
| 디테일 컷 | "클로즈업" | "손잡이 질감이 드러나는 매트 화이트 세라믹 머그 클로즈업" |
| 인포그래픽 | "도해" | "높이 3.5인치, 지름 4인치를 보여주는 커피 머그 치수 인포그래픽" |
규칙:
- 125자 이내(스크린 리더는 이 길이에서 잘림)
- 주요 키워드를 자연스럽게 포함하되 억지로 채우지 말 것
- 실제 보이는 것을 묘사, 상품명을 복붙하지 말 것
- 동일 상품의 이미지마다 서로 다른 대체 텍스트(같은 문구 복붙 금지)
- "image of" "photo of" 같은 표현은 생략(보조 기술이 자동 추가)
배리언트 이미지(색상, 사이즈, 스타일)는 어떻게 관리하나요?
Shopify는 특정 상품 배리언트에 이미지를 할당할 수 있게 해줍니다. 대부분의 스토어가 기대에 못 미치는 지점이 여기입니다.
최소한의 기본 설정: 색상 배리언트당 해당 색상을 정확히 보여주는 이미지 한 장. 고객이 "빨강"을 클릭하면 흰색이 아닌 빨간 상품이 뜨는 게 당연한 기대입니다.
패션·홈 카테고리의 더 나은 설정:
- 기본 배리언트 이미지: 모든 색상에서 동일한 각도, 동일한 조명, 동일한 구도의 상품 컷(쉽게 비교할 수 있도록)
- 보조 라이프스타일 이미지: 배리언트 색상에 맞춘 사용 장면
- 디테일 이미지: 색상/질감을 정확히 보여주는 클로즈업
사이즈 배리언트는 별도 이미지가 필요 없습니다. 사이즈에 따라 시각적으로 확연히 다른 경우(예: 비례가 다른 소형 가방과 대형 가방)만 예외입니다. 의류는 모델컷 한 세트에 사이즈표 한 장이면 충분합니다.
색상 정확도는 결정적입니다. 구매자는 배리언트 이미지가 화면에서 보는 실제와 일치하길 기대합니다. 스튜디오 조명이 색감을 왜곡한다면 업로드 전 후보정으로 교정하세요. 색상 관련 반품은 배리언트 이미지와 실물 차이에서 크게 발생합니다.
페이지 속도와 이미지 크기가 전환율에 실제로 영향을 주나요?
네, 측정 가능한 수준으로 영향을 줍니다. Google Core Web Vitals 데이터와 e커머스 벤치마크 연구는 일관되게 다음을 보여줍니다.
- LCP(Largest Contentful Paint) 2.5초 미만: 양호한 랭킹의 기준선
- LCP 2.5~4초: 참여 지표의 유의미한 하락
- LCP 4초 초과: 모바일 이탈률 대폭 상승
상품 페이지의 LCP 요소는 보통 히어로 상품 이미지입니다. 여기서 500KB를 줄이면 4G 모바일에서 LCP가 200~500ms 감소하고, 세션 전체에 걸쳐 누적 효과를 냅니다.
| 페이지 속도 개선 | 전형적인 전환율 변화 |
|---|---|
| 1초 → 2초 | 기준선, 영향 없음 |
| 3초 → 2초 | 전환율 +3~7% |
| 5초 → 2초 | 모바일 전환율 +10~15% |
| 8초 → 3초 | 모바일 전환율 +25~30% |
이것이 200~500KB 파일 크기 목표가 생각보다 훨씬 더 중요한 이유입니다. 500KB 이미지 10장은 5MB 페이지입니다. 2MB 이미지 10장은 20MB 페이지입니다. 이 차이를 모든 모바일 방문자가 체감합니다.
업로드 전 체크리스트
상품에 이미지를 추가하기 전에 이 체크리스트를 점검하세요.
- 마스터 크기 2048×2048픽셀 (멀티 채널이면 2000×2000)
- 종횡비가 테마 기본 그리드와 일치
- JPEG 품질 80~85(또는 WebP 품질 80)로 내보냄
- 파일 크기 이미지당 200~500KB
- 설명적인 파일명:
product-name-color-angle.jpg(IMG_4821.jpg금지) - 모든 이미지에 125자 이내 대체 텍스트 작성
- 색상이 실물과 일치(캘리브레이션된 디스플레이에서 확인)
- Shopify 관리자에서 배리언트 이미지가 올바르게 연결됨
- 업로드 후 데스크톱·모바일에서 미리보기 확인
- 실제 테마에서 크롭 테스트 완료
FAQ
Shopify가 자동으로 이미지를 압축해 주나요?
네. Shopify는 CDN 최적화 버전을 제공하며, 지원 브라우저에는 주로 WebP로, 뷰포트에 맞는 크기로 서빙합니다. 다만 이 압축은 업로드한 파일 위에 손실 압축을 덧씌우는 것이므로, 미리 최적화된 원본이 자동 압축에만 의존하는 것보다 항상 더 나은 결과를 냅니다.
Shopify와 Amazon에 같은 상품 이미지를 써도 되나요?
메인 상품 이미지는 가능합니다. 2000×2000 순수 흰 배경 이미지 한 장이면 양쪽 모두에서 통합니다. 다만 보조 이미지는 보통 달라야 합니다. Amazon은 메인 이미지에서 로고와 대부분의 텍스트 오버레이를 금지하고 보조 이미지 규칙도 엄격한 반면, Shopify는 창의적 자유를 허용합니다. 채널별로 태그를 붙여 폴더를 분리해 관리하세요.
홈페이지 히어로 배너의 이상적인 크기는?
1920×1080픽셀이 안전한 기본값입니다. 일부 테마는 초와이드 디스플레이용으로 2400×1200을 지원합니다. 모바일 최적화 크롭(1080×1080 또는 1080×1350)은 반드시 준비하세요. 모바일 사용자는 데스크톱 배너 가운데의 좁은 띠가 아니라, 상품에 집중한 타이트한 크롭을 봐야 합니다.
상품당 몇 장의 이미지를 써야 하나요?
대부분의 카테고리에서 78장이 최적입니다. 흰 배경 메인 1장, 추가 각도 23장, 라이프스타일/사용 장면 1~2장, 스케일/사이즈 참조 1장, 인포그래픽 1장입니다. 4장 미만이면 리스팅이 덜 완성되어 보이고, 10장 초과면 전환 향상 없이 소음만 늘어나는 경우가 많습니다.
모바일에서 상품 이미지가 흐리게 보이는 이유는?
흔한 원인은 세 가지입니다. (1) 원본 이미지가 2048px 미만이어서 늘어남, (2) 원본 파일이 너무 커서 테마가 과도하게 압축된 버전을 서빙함, (3) 모바일 레티나 디스플레이가 데스크톱과 다르게 렌더링함(데스크톱에서 선명해도 3배 밀도 모바일에서는 부드럽게 보일 수 있음). 해결책: 선명한 2048×2048 원본을 업로드하고 다운스케일링은 Shopify에 맡기세요.