Shopify는 Amazon 같은 마켓플레이스보다 이미지 치수에 관대하다 — 거의 무엇이든 기꺼이 표시한다. 그 유연함이 함정이다. 거대하고 제각각인 파일을 올리면 테마가 느리고 어긋난 격자를 렌더링해, 어떤 제품은 선명하고 다른 것은 잘리거나 작아 보인다. 처음부터 크기를 제대로 잡으면 상점 전체가 전문적으로 느껴지고 빠르게 로드된다.
크기와 테마 동작은 변하므로, 이것을 흔하고 널리 쓰이는 권장 사항으로 여기고 현재 테마 문서와 대조해 확인하라.
권장 크기
| 이미지 유형 | 흔한 권장 사항 | 가로세로 비율 |
|---|---|---|
| 제품 사진 | 2048 × 2048 px | 1:1 (정사각형) |
| 정사각형이 전반적으로 가장 안전 | 최대 4472 × 4472 px | 1:1 |
| 컬렉션 / 썸네일 | 약 1024 × 1024 px | 1:1 |
| 슬라이드쇼 / 히어로 배너 | 가로 약 1600px (또는 더 넓게) | 16:9 또는 테마 설정 |
| 최대 파일 크기 | 이미지당 20MB (훨씬 낮게 겨냥) | — |
어떤 단일 숫자보다 중요한 두 가지.
가로세로 비율 하나를 골라 고수하라. Shopify 테마는 모든 제품 사진이 같은 모양을 공유할 때 가장 좋아 보인다. 정사각형(1:1)이 가장 믿을 만한 선택이다. 거의 모든 테마의 격자에 어색한 잘림 없이 맞기 때문이다. 정사각형, 세로형, 가로형을 섞으면 격자가 들쭉날쭉해 보인다.
2048 × 2048이 제품의 최적점이다. 데스크톱에서 Shopify의 내장 확대에 충분히 선명하고, 썸네일과 모바일용으로 깔끔하게 축소되며, 파일 크기 상한을 여유 있게 밑돈다. 그보다 크면 대개 무게만 더한다.
카탈로그 전체를 한 번에 표준화하기
제품 사진 수십 장을 손으로 리사이즈하는 것이 오후가 사라지는 곳이다. 그러지 마라. 이커머스 이미지 리사이저에는 흰 배경 위 2048 × 2048 정사각형을 출력하는 Shopify 프리셋이 있어, 각 제품이 자동으로 가운데 정렬되고 아무것도 가장자리에 닿지 않도록 조정 가능한 여백이 붙는다. 폴더를 넣고 ZIP을 돌려받아라 — 모든 이미지가 같은 크기, 같은 모양, 같은 구도.
그 일관성이 Shopify 격자를 조립된 것이 아니라 디자인된 것처럼 보이게 한다.
그다음 파일 무게 줄이기
올바른 치수는 레이아웃을 해결한다. 파일 무게는 속도를 해결하고 — Shopify에서 속도는 돈이다. 느린 페이지는 조용히 전환을 앗아가고 검색 순위를 해친다.
카메라에서 막 나온 2048px 사진은 수 메가바이트일 수 있다. 페이지가 필요한 것보다 훨씬 많다. 모든 이미지를 이미지 압축기로 돌려라. 사진은 품질 75~85가 대개 눈에 보이는 차이 없이 파일을 40~70% 줄인다. PNG는 자동으로 양자화된다. 압축기는 당신이 준 것보다 큰 파일을 절대 돌려주지 않으므로 상점 전체를 안전하게 일괄 처리할 수 있다.
잘 통하는 순서:
- Shopify 프리셋으로 2048 × 2048로 리사이즈.
- 품질 75~85로 압축(또는 PNG 양자화 실행).
- 업로드 — 같은 모양, 작은 파일, 빠른 격자.
WebP, JPG, 아니면 PNG?
Shopify는 지원하는 브라우저에 자동으로 WebP를 제공하므로, 대개 직접 포맷을 변환할 필요가 없다. 사진에는 깨끗한 JPG를, 투명도나 선명한 텍스트가 필요한 그래픽에만 PNG를 올려라. 포맷 전달은 플랫폼에 맡겨라. 당신의 일은 올바른 크기로 잘 압축된 원본 파일을 보내는 것이다.
모든 것이 당신 기기에 남는다
두 도구 모두 Canvas와 WebAssembly를 써서 전적으로 브라우저에서 돌아간다 — 업로드도, 계정도, 워터마크도 없다. 당신 제품 사진은 서버를 절대 건드리지 않는다. 첫 방문 이후 도구가 캐시되어 오프라인에서 계속 작동하므로, 기차에서 카탈로그 전체를 준비하고 온라인으로 돌아오면 한 번에 업로드할 수 있다.
정사각형으로 만들고, 2048로 크기를 잡고, 압축하라. 그러면 Shopify 상점이 빠르게 로드되고 무작위 업로드 더미가 아니라 하나의 일관된 상점처럼 보인다.