웹 상세페이지 사이즈 최적화 (스마트스토어, 쿠팡, 옥션 등 6가지)

온라인으로 상품판매를 진행하는 사람이라면, 한번은 들어봤을 그 단어.

'상세페이지'이다. 상세페이지는 나의 상품을 설명하는 상품설명서이다.

이 설명서를 어떻게 고객에게 보여줄 것인가가 판매의 핵심이라고 할 수 있다.

 

웹 상세페이지 사이즈 최적화 (스마트스토어, 쿠팡, 11번가, G마켓, 옥션, 위메프)

 

보통 상세페이지에서 사용하는 사이즈는 정확하게 딱! 정해져 있지 않은 편이다.

어느정도 커트라인에 들어오면 다 쓸 수 있는 편이다.

 

예를 들어, 스마트 스토어의 경우는 아래와 같다.

* 상품이미지 = 대표이미지(1) + 추가이미지(9)

상품의 이미지는 말그대로 상품을 보여주는 이미지이다.

대표이미지를 설정하면, 네이버 쇼핑에서 검색시에 대표적인 이미지로 보여진다.

 

그리고 추가적인 이미지는 최대 9개까지 등록이 가능하며,

깔끔하고, 상품을 잘 보여줄 수 있는 이미지들이 많을수록 좋다.

(이유는, 고객에게 더 많은 관심을 받을 수 있는 수단이 되니까!)

 

스토어팜의 경우, 권장 사이즈는 640x640 (윈도우대상은 750x1000) 

웹상의 단위는 px을 사용하며, 해상도는 72DPI가 보통이다.

아래에 한눈에 볼 수 있는 표를 정리해보았다.

 

 

#탁디장 디자인 연구소의 촬영현장 - #웅상사진관 #징징이작가님

 

그렇다면 궁금증이 생긴다?!

 

왜 좋은 카메라로 기껏 해상도 높게 찍은 사진을 왜 일부러 낮춰야 될까?

이유는, 용량때문이다.

좋은 해상도로 하면, 확대해도 잘보이고, 선명하고 좋을텐데...

궂이 해상도를 낮추는 이유는 용량이 높은 사진의 경우, 무겁고, 느리다.

온라인 상에서 스피드는 생명이다. 뭔가 버벅대고 느리면, 바로 빠져나가는게 온라인 고객이다.

 

72개의 점으로 표현될 그림이 300개의 점으로 표현이 된다면, 당연히 전자보다는 느릴 것이다.

물론, 개인 사이트를 두고 넉넉한 용량에서 사용하는 거면 괜찮을지도 모르지만!

오픈마켓의 경우, 많은 스토어 판매자들이 이용하고, 많은 구매자들이 왔다갔다하기때문에

사용하기에 가장 알맞은 사이즈와 해상도를 정한것으로 보인다.

 

이 정도 사이즈면, 고객들이 상품을 확인하기에 문제가 없을꺼야,

혹은 이정도 해상도면 적정한 속도로 업로드 될꺼야! 라는 판단이 있었을 것이다.

 

모바일 쇼핑의 성장으로, 모바일 중심으로 사이즈는 계속 변화하고 있다.

 

---

 

온라인 판매에서 실질적으로 도움이 되는,

상세페이지 사이즈를 콕!콕! 찝어 정리해보려고 한다~

 

제일 많이 쓰는 사이트 5곳을 선정하여, 정리하였다.

저번 오픈마켓 순위에 맞춰 순서를 나열하였으며, 지마켓과 옥션은 같이 등록이 가능해서, 함께 묶었다.

 

2020 쇼핑몰 상세페이지 최적의 사이즈 정리

 

모든 상세페이지의 기본적인 사항은 앞서 말했듯,

기본 단위는 px(픽셀)과 웹해상도 72DPI를 사용하고 있다!

 

* 간혹 96DPI도 사용하는 곳이 있는데,

윈도우 전용으로 저장시 텍스트가 깨지는 것을 보완해준다.

작은 글자를 많이 사용했다면, 96으로 저장해서 적용해보는 것도 좋을 것 같다.

 

표에서 상세페이지의 최적화 사이즈를 안내하고 있으며,

꼭 필요한 필수 요소는 앞의 두가지이다.

1. 대표 이미지와 2. 상세페이지이다.

- 대표이미지는 메인으로 보여지는 상품의 얼굴이다.

- 상세페이지는 상품을 설명해주는 상품설명서이다.

 

주로 상세페이지 디자인 작업을 할때,

썸네일(대표이미지)는 640 x 640 px

상세이미지의 경우는 가로 850 px을 기본으로 하고,

길이는 총 ~20,000px정도로 맞추고,

사장님들의 수정 및 사용의 편의를 위해 단락별로 끊어서 저장해서

디자인 결과물을 메일로 보낸다.

 

 

대표이미지 예시 사진 (좌)기본누끼사진 / (우)컨셉사진

 

 

- 보통 스마트스토어의 썸네일 사이즈인 640px으로 제작해드리면, 

쿠팡 사이즈가 최소 500이상이니깐 가능하고, 11번가의 경우도 600이상이니깐 가능하다.

위메프와 지마켓&옥션의 경우에는 따로 저장해드리면 된다.

 

 

최근 제작한 건어물 관련 상세페이지 예시

 

 

- 상세페이지 사이즈의 경우, 딱 정해지지는 않았지만, 가로를 850px으로 하면, 무난하게 다 OK이고,

단지 길이나 용량에 신경을 쓰면 된다. 아까 말한대로 단락을 나눠드리면, 11번가 위메프 등에서도 사용이 가능하다.

그리고, 쿠팡의 경우 등록이 미숙하신 분들은, 요청하시면 통이미지로 제작해드리고 있다.

 

 

 

각 쇼핑몰마다 사이즈가 다르고,

카페24 등을 통해 직접 제작한 사이트도 대부분 사이즈가 조금씩 다르다!

정확한 사이즈는 다르지만, 핵심은 하나다!

적당한 용량에 필요한 만큼 잘 보이는, 그런 상세페이지이다.

 

가끔 너무 해상도에 집착하시는 분이 계시는 분이 있는데,

물론 높은 해상도를 사용하는 것도 좋지만,

해상도보다 중요한 건 상세페이지의 기획과 내용, 그리고 분위기라고 생각한다.

 

 

제일 기본이 되는 내용이라, 이것저것 많이 적게 되었는데,

상세페이지에 대해 궁금해하는 많은 분에게 도움이 되면 좋겠다.

 

 

---

전문적인 상세페이지 제작이 필요하다면,

기획+촬영+상세까지 한번에 가능한 '탁디장'

카톡으로 문의주시면, 친절하게 안내드려요~

 

https://open.kakao.com/o/suSdZzs

[상세페이지 제작] 탁디장 디자인 스튜디오

 

혹시나 추가적으로 궁금한 사항이나,

덧붙이고 싶은 내용이 있으신 분들은 댓글 남겨주세요~

저도 추가적인 사항이 있으면 댓글 남겨둘께요!

 

---

< 오늘의 디자인 명언 >

폴랜드 1914-1996 (미국의 그래픽 디자이너)의 말씀

 

단순하게 유지하라. 정직하라.

그리고 그 작업에 최선을 다하라. 

- Paul Rand