본문으로 건너뛰기

버그 제보

이상한 점을 알려 주시면 고칠게요. 지금 보고 있는 페이지와 브라우저 정보가 함께 담겨요.

페이지:

Career

상세페이지 9단계 구조

작성 2026. 10. 14.추가
목차7개 항목
출처와 참고

재영(나재영)의 「작은 브랜드가 바로 써먹는 상세페이지 9단계 구조」(브런치, 2021.08)를 바탕으로 재구성한 노트다.

상세페이지는 스크롤 싸움이다

상세페이지(상품 상세 설명)는 오픈 마켓·자사몰·크라우드 펀딩에서 상품 사진 아래 길게 이어지는 설명 영역이다. 작은 브랜드에게는 고객이 그 브랜드를 처음 만나는 곳이기도 하다. 광고로 본 적도, 이름을 들어 본 적도 없다.

모르는 사람이 길에서 "저기 맛있는 식당이 있으니 같이 가자"고 하면 따라가지 않는다. 모르는 브랜드의 상세페이지도 같다. 고객은 의심을 품고 들어오고, 휴대폰의 알림 하나에도 쉽게 떠난다. 그래서 상세페이지의 일은 의심을 하나씩 풀어 구매 버튼까지 스크롤을 내리게 하는 것이다. 시간을 들여 끝까지 본 사람일수록 그 시간을 헛되게 하고 싶지 않아 구매로 이어질 가능성이 높다.

유입과 전환, 세일즈 퍼널

개념뜻좌우하는 것
유입고객이 상품 페이지에 들어오는 것. 유입률 ≈ 클릭률검색 키워드, 썸네일
전환들어온 고객이 구매하는 것. 전환율상세페이지
세일즈 퍼널인지 → 흥미 → 욕망 → 행동. 단계마다 사람이 줄어드는 깔때기각 단계에서 이탈 이유를 없앤다

판매는 유입과 전환이 둘 다 높을 때 일어난다. 단계를 나눠 보면 어디를 고쳐야 할지 보인다. 퍼널은 실제 구매 경로가 다양해지면서 그대로 맞지는 않지만, 고객이 구매에 이르는 과정을 쪼개 보는 틀로는 여전히 쓸모 있다. 상세페이지는 퍼널을 위에서 아래로 내려가는 한 장의 지도다.

디자이너가 이 구조를 알면 툴을 켜기 전에 고객의 행동부터 생각하게 된다. 제품 스펙만 받고 기획까지 떠안는 작은 브랜드 환경에서 특히 가이드가 된다.

9단계: 고객의 질문 순서

flowchart TB
  in["들어옴"] --> s1
  subgraph g1["이 브랜드, 믿어도 되나?"]
    s1["1 판매 증거"] --> s2["2 판매 관리"] --> s3["3 인증"]
  end
  s3 --> s4
  subgraph g2["이 제품, 나한테 필요한가?"]
    s4["4 메인 이미지"] --> s5["5 문제"] --> s6["6 상세 이미지"]
  end
  s6 --> s7
  subgraph g3["왜 여기서, 왜 지금?"]
    s7["7 공감"] --> s8["8 액션"] --> s9["9 상세 정보"]
  end
  s9 --> buy["구매 버튼"]
단계고객의 질문담을 것
1. 판매 증거나만 사는 거 아니지?누적 판매량(적으면 기간 한정 판매량, 펀딩 달성), 실구매 리뷰, 체험단·셀럽 후기, 전후 비교 GIF
2. 판매 관리사면 잘 보내 주겠지?발송 마감 시각, 택배사, 검수 과정, 연락처·소재지
3. 인증진짜 문제없을까?A/S·보증 기간, 기관 인증 마크(HACCP, KC 등), 특허
4. 메인 이미지내가 뭘 사려는 거지?제품을 쓰는 장면. 누끼 사진 확대보다 구매 후 얻는 모습
5. 문제나한테 필요한가?제품이 없애 주는 일상의 불편을 구체적으로("완전 내 얘기네")
6. 상세 이미지설명이 충분한가?부분별 기능. 스펙 숫자보다 삶이 어떻게 나아지는지(바람 온도보다 줄어드는 드라이 시간)
7. 공감이 브랜드 믿을 만한가?만든 계기, 만든 사람의 이야기, 제작 환경. 짧고 따뜻하게
8. 액션굳이 지금 사야 하나?기간 한정 할인, 추가 증정, 오늘 주문 시 발송 등 지금 사야 하는 이유
9. 상세 정보한 번 더 확인상세 스펙(크기·무게·소재), 옵션, 고객 센터, 교환·환불, 배송 공지

단계별 요점

  • 판매 증거가 맨 앞인 이유: 온라인 구매 실패(사진과 다름, 느린 배송, 흠집)는 누구나 겪었다. 고객은 자신이 첫 구매자가 아니라는 확인을 가장 먼저 찾는다. 리뷰가 페이지 위쪽에 보이지 않는 플랫폼이라면 상세페이지 안에서라도 보여 준다.
  • 판매 관리: 빠른 배송에 익숙한 시장일수록 "지금 주문하면 언제 발송되는지"가 구매 기준이 되고, 배송 문의(CS)도 줄어든다. 신선 식품처럼 배송이 핵심인 상품은 이 단계를 더 위로 올린다. 정돈된 디자인 자체가 "운영이 잘되는 곳"이라는 인상을 준다.
  • 인증: 인증을 받는 것만큼 눈에 띄게 알리는 것이 중요하다. 받아 놓고 작게 묻어 두는 경우가 많다.
  • 메인 이미지: 첫인상이 전체 판단을 좌우한다(초두 효과). 캠핑 용품이라면 실제 캠핑 장면에서 찍는다. 플랫폼마다 선호하는 비율·구도가 다르고, 모바일에서 보기 좋은지가 기준이다.
  • 문제: 사람은 혜택을 얻는 것보다 문제를 없애는 데 더 끌린다.
  • 공감: 작은 브랜드가 큰 브랜드를 이길 수 있는 곳이다. 도형 몇 개와 로고로 시크하게 끝내면 기억에 남지 않는다. 지면이 부족하면 브랜드 이야기는 링크로 뺀다.
  • 액션: 자주 할인하는 브랜드는 평소에 안 팔린다. 찜해 두고 나중에 사길 바라면, 그 사이에 경쟁 상품으로 간다. 그래서 이 단계를 맨 위에 두는 판매자도 있다.

순서를 조정하는 법

9단계는 처음 막막할 때 쓰는 기본값이지 정답이 아니다. 채널(오픈 마켓, 펀딩, 자사몰), 상품 분야, 그때의 유행에 따라 달라진다.

  • 다 넣을 필요는 없다. 넣을 수 있는 것을 고르고 부족한 것을 채운다.
  • 브랜드의 강점을 위로 올린다. 상단은 퍼널의 가장 넓은 부분이라 가장 많은 사람이 본다.
  • 일단 한 번 끝까지 만들어 보고, 고객의 눈으로 처음부터 끝까지 읽어 보며 고친다.

함께 지킬 것

항목내용
표시·광고 규정체험단·협찬처럼 대가를 받은 후기는 광고임을 밝혀야 한다(공정거래위원회 「추천·보증 등에 관한 표시·광고 심사지침」). 리뷰 조작, 근거 없는 "1위"·"최초" 표현은 법 위반이다
필수 정보전자상거래법상 상품정보제공고시(소재, 제조국, 품질보증 기준 등)는 상품 분야별로 항목이 정해져 있다. 9단계의 "상세 정보"가 그 자리다
접근성상세페이지를 통이미지로만 만들면 스크린 리더 사용자와 검색 엔진은 아무것도 읽지 못한다. 핵심 문구와 스펙은 텍스트로 두거나 대체 텍스트를 단다(→ 웹 접근성)
모바일대부분 휴대폰으로 본다. 글자 크기, 한 화면에 들어오는 정보량을 모바일 기준으로 맞춘다

정리

  • 상세페이지는 전환을 맡는다. 목표는 고객이 끝까지 스크롤하게 만드는 것이다.
  • 고객의 의심은 "다른 사람도 샀나 → 잘 보내 주나 → 믿을 만한가 → 무엇인가 → 필요한가 → 충분한가 → 이 브랜드인가 → 지금인가 → 최종 확인" 순서로 풀린다.
  • 스펙보다 혜택, 누끼보다 사용 장면, 로고보다 이야기를 보여 준다.
  • 9단계는 기본값이다. 강점을 위로 올리고 채널에 맞게 고친다.

관련 노트: 전자상거래 UI 디자인, 웹 접근성, 콘텐츠 전략과 핵심 모델, 디자이너와 함께 일하기: 역할·채용·협업

원본 기록1

댓글

GitHub 계정으로 댓글을 남길 수 있어요.