상세페이지 구성안, 다섯 질문 순서로 짜는 법

상세페이지는 판매 페이지에서 제품을 설명하는 세로로 긴 화면입니다. 구성안은 그 화면에 무엇을 어떤 순서로 놓을지 적은 한 장짜리 설계 문서입니다. 구성안을 짜는 일은 예쁜 배치를 고르는 일이 아니라, 읽는 사람이 떠올리는 질문의 순서를 찾아 그 순서대로 섹션을 놓는 일입니다.

다섯 개의 질문과 섹션 순서

사람은 위에서 아래로 훑으며 머릿속으로 질문을 던지고, 답이 나오면 다음 질문으로 넘어갑니다. 질문의 순서대로 섹션을 놓으면 한 번 내려가는 동안 읽기가 끝납니다.

합치면 이미지 8~12컷, 글 1,200자 안팎이 나옵니다. 이 범위를 먼저 정해 두면 촬영에 필요한 컷 수가 구성안에서 바로 계산됩니다.

순서를 바꾸는 두 경우

다섯 질문의 순서는 제품이 놓인 자리에 따라 한 칸씩 움직입니다. 판매 페이지 검색창에 제품 이름을 넣고, 첫 화면에 뜨는 비슷한 제품의 개수로 나눕니다.

• 10개 이상 — 필요성은 이미 알려진 시장입니다. 3번 믿을 만한가를 2번 앞으로 올립니다
• 5개 미만 — 처음 보는 형태의 제품입니다. 4번 어떻게 쓰나를 3번 앞으로 올립니다

5개에서 10개 사이면 표의 순서를 그대로 씁니다. 어느 경우든 1번과 5번의 자리는 움직이지 않습니다.

맨 위 한 화면

맨 위 한 화면은 스크롤하기 전에 보이는 영역입니다. 여기서 세 가지가 전해지면 나머지는 아래에서 채울 수 있습니다.

• 정체 — 명사로 끝나는 한 줄. 형용사를 빼면 15자 안팎으로 줄어듭니다
• 크기감 — 손이나 흔한 물건과 함께 찍은 사진 1컷
• 분위기 — 배경색 1가지와 사진 톤. 여기서 정한 배경색을 아래 섹션에도 그대로 씁니다

글자는 제목 한 줄과 보조 문구 한 줄, 모두 두 줄까지만 올립니다.

사진이 맡는 것과 글이 맡는 것

눈으로 확인되는 것은 사진, 숫자로 적어야 하는 것은 글입니다. 사진은 색 · 질감 · 두께 · 구성품 전체 · 쓰는 장면을 맡고, 글은 치수 · 소재 비율 · 무게 · 세탁이나 보관 조건 · 호환 여부를 맡습니다.

이미지 안에 넣는 글자는 제목 한 줄까지로 두고, 설명은 이미지 아래 본문으로 내립니다. 문구를 고칠 때 이미지를 다시 만들지 않아도 되고, 다른 채널에 같은 글을 옮겨 쓰기도 쉬워집니다.

치수는 문장으로 풀지 말고 표로 넣습니다. 가로줄은 옵션, 세로줄은 치수 항목입니다. 어디를 어떻게 잰 숫자인지 표 아래에 한 줄 적어 두면 같은 답을 반복해서 쓰는 시간이 줄어듭니다. 배송과 교환은 결정을 마친 뒤 보는 정보라 맨 아래가 제자리입니다.

모바일에서 길어질 때

같은 구성이 모바일에서는 세로로 몇 배 길어집니다. 다섯 가지를 미리 정해 두면 길이가 늘어도 순서가 그대로 남습니다.

• 소제목을 답 형태로 답니다 — '소재' 대신 '무엇으로 만들었나'
• 섹션 사이 여백을 한 화면 높이의 10% 정도 둡니다
• 이미지 한 컷이 세로 2화면을 넘으면 두 컷으로 자릅니다
• 표는 세로줄 4개까지만 둡니다. 그보다 많으면 표를 둘로 나눕니다
• 이미지 가로 픽셀은 쓰는 판매 페이지의 관리 화면에 적힌 권장 값에 맞춥니다

5일 일정표

3명에게 보여 주기

제품을 모르는 사람 3명에게 휴대폰으로 보여 줍니다. 1명당 5분입니다. 30초 동안만 보게 한 뒤 화면을 덮고 묻습니다.

1. 이게 무엇을 하는 물건인가요
2. 크기가 어느 정도로 보이나요
3. 지금 궁금한데 안 나온 게 있나요
4. 끝까지 내려본 뒤 — 어디쯤에서 지루했나요

1번과 2번이 막히면 맨 위 한 화면을 고칩니다. 3번에서 나온 항목은 그 질문이 생긴 위치 바로 아래로 옮깁니다. 4번에서 3명이 같은 지점을 말하면 그 구간을 절반 길이로 줄입니다. 세 사람의 답이 갈리면 문구가 아니라 순서를 다시 잡습니다.

오늘 할 일

빈 문서를 열고 다섯 개의 질문을 한 줄씩 적으십시오. 각 줄 아래에 지금 가진 사진과 문구를 붙여 넣으면, 비어 있는 줄이 그대로 이번에 찍을 컷 목록이 됩니다.

이어서 읽기 — 상세페이지 AI, 문구·이미지를 AI로 만들 때 사람이 볼 곳 · 상세페이지 템플릿, 배포처 비교와 10칸 양식