상세페이지
첫 화면부터 마지막 망설임까지 구매 흐름을 읽습니다
상세페이지는 구매를 미루는 이유부터 봅니다. 첫 화면부터 구매 버튼까지 정보 흐름을 점검합니다.
공개 글
상세페이지 글
첫 화면, 가격, 옵션, 후기, FAQ와 구매 행동을 검증 가능한 기준으로 점검합니다.

상품명이 두 줄에서 잘릴 때: 모델과 구성 차이를 먼저 남기기
긴 공통 수식어 뒤에서 모델이 잘리는 카드 이름을 고치고, 모델·구성·전체 이름과 상세 자료의 관계를 비교합니다.
글 읽기
앞면·뒷면·상세 사진을 고를 때: 상품 갤러리 이름과 현재 장면
같은 상품의 보기 방향과 판매 옵션을 분리하고, 앞면·뒷면·상세 버튼의 이름·상태·설명을 함께 바꾸는 갤러리 예제입니다.
글 읽기
편집 원본과 미리보기를 혼동하지 않게: 디지털 자료의 파일 목록
직접 만든 CSV·HTML·안내·버전 파일로 편집 원본과 미리보기의 역할, 열 순서, 구분자와 배포 버전을 대조합니다.
글 읽기
색상 동그라미만으로 고르게 하지 않기: 이름·선택·품절 표시
상품 색상 견본에 공개 이름과 라디오 선택 상태를 연결하고, 키보드 초점·품절·실제 제품 색의 차이를 구분합니다.
글 읽기
재고 있음·예약 주문·입고 대기: 주문 버튼과 발송 예정일을 같은 상태로 맞추기
주문을 받을 수 있는지와 지금 발송할 수 있는지를 분리합니다. 재고·신상품 예약·재입고 주문·품절 상태를 비교하고 옵션 선택, 예정일 변경, 결제 직전 재확인의 문구를 가상 사례로 설명합니다.
글 읽기
세트 상품 사진에 보이는 것, 실제로 오는 것: 포함·별도 구매·촬영 소품 구분하기
세트 상품의 구성품을 품목과 수량으로 풀어 설명합니다. 기본·확장 세트와 촬영 소품의 경계를 나누고 옵션 변경, 2세트 주문, 사진·장바구니의 구성 불일치를 찾는 예제를 제공합니다.
글 읽기
상품 사양표의 cm·mm·g을 섞지 않게: 단위와 측정 기준 검수
상품 치수를 단위만 통일하면 놓치는 외경·내경·포장 기준의 차이를 다룹니다. 가상 트레이 사양을 mm와 g으로 정리하고 표시 정밀도·제작 편차·설치 여유를 구분하는 예제를 제공합니다.
글 읽기
하단 고정 구매 버튼이 본문을 가릴 때: 모바일 겹침 검수
하단 구매 바가 반품 안내와 키보드 초점을 덮는지 좌표로 확인합니다. 예시 높이 계산, 여백과 스크롤 여유의 차이, 긴 옵션명·쿠키 배너·가상 키보드 상태별 수정 기준을 설명합니다.
글 읽기
옵션을 바꾸면 사진도 바뀌어야 할까: 색상·구성 이미지 연결 검수
색상·구성 선택과 대표 사진, 대체 설명, 본문 사양을 연결하고 이미지 로딩 실패 때도 선택 정보를 유지하는 방법을 설명합니다.
글 읽기
상품 영상에 자막·대체 설명·재생 제어를 함께 넣는 법
상품 영상의 음성, 자막, 화면 속 행동을 나눠 정리하고 WebVTT 연결과 재생 제어를 점검하는 예제를 제공합니다.
글 읽기
외경·내경과 설치 여유 계산
상품의 외형 크기와 실제 넣을 수 있는 공간을 구분하고 단위·측정 방향·좌우 여유를 함께 표시합니다. 가상 트레이 폭 조건 계산으로 흔한 오해를 확인합니다.
글 읽기
이미지 역할에 맞는 대체텍스트
같은 상품 이미지도 정보 사진, 장식, 링크, 치수 도해로 쓰일 때 대체텍스트가 달라집니다. 역할 선택 예제와 문장 비교로 무엇을 남기고 줄일지 확인합니다.
글 읽기
배송·교환 결정 정보 배치
소형·대형과 배송 지역의 가상 운임 데이터를 사용해 현재 선택의 비용·미확정 항목·출고·정책 링크를 같은 상태로 보여주는 방법을 다룹니다.
글 읽기
구매 전 질문 분류법
치수·구성·배송·교환·주문 문제의 질문을 즉답·정책·개별 문의로 나누고, 관련 본문과 답변 경로를 연결합니다.
글 읽기
총비용이 보이는 가격 블록
자체 계산 예제로 상품가, 필수 추가비용, 배송비, 옵션 차이와 정책 링크를 한 가격 블록에 정리하고 합계·표시 순서·모바일 노출을 검증합니다.
글 읽기
후기 출처와 이해관계 표시
실제 후기인 척하는 예시를 만들지 않고 후기의 원문, 작성 시점, 사용 맥락, 제공·보상 관계를 기록해 상세페이지에 배치하는 절차를 정리합니다.
글 읽기
옵션 입력 방식 선택 기준
옵션 수를 임의로 줄이지 않고 단일선택, 복수선택, 긴 목록을 구분해 radio, checkbox, select를 선택하고 가격·구성·키보드 동작을 검증합니다.
글 읽기
혜택과 근거 연결표
혜택 문장과 가까운 위치에 대상·값·조건을 남기고, 치수표·구성 목록 등 해당 자료로 연결하는 배치를 비교합니다.
글 읽기
상세페이지 CTA 배치 기준
트레이의 치수·옵션·비용을 읽는 순서에 맞춰 CTA의 위치를 고릅니다. 자료 이동과 주문 행동, 재구매자의 빠른 경로를 구분합니다.
글 읽기
사용 장면부터 여는 첫 문장
같은 3구 케이블 홀더를 장면·구조·설치 조건으로 각각 시작해 보고, 진입 상황에 맞는 첫 문장과 보충 정보를 고릅니다.
글 읽기
모바일 문장 가독성 검수
모바일 상세페이지의 줄바꿈, 행간, 고정 높이, 버튼 간격과 이미지 순서를 자체 예제로 구성하고 320·390px 및 텍스트 확대 조건에서 검수합니다.
글 읽기
390px 첫 화면 정보 순서
치수와 구성이 중요한 트레이 예제로 제목·요약·그림·확인 링크의 역할을 나누고, 390px에서 정보가 쌓이는 순서를 비교합니다.
글 읽기상세페이지를 네 개의 블록으로 나눠 봅니다.
한 장의 긴 이미지를 통째로 평가하지 않습니다. 사용자가 화면을 내려가며 어떤 질문을 품는지, 그 질문에 대한 답이 어디서 나오는지를 기준으로 나눕니다.
제품명, 대표 혜택, 차별점, 가격 감각이 스크롤 전에 보이는지 확인합니다.
- 누구를 위한 제품인지
- 왜 지금 봐야 하는지
- 다음 행동이 보이는지
기능 나열이 아니라 사용자의 불편과 원하는 결과가 연결되는지 봅니다.
- 문제 제시
- 해결 장면
- 사용 후 변화
후기, 수치, 인증, 제작 과정이 의심이 생기는 위치에 놓였는지 확인합니다.
- 검증 가능한 근거
- 후기 맥락
- 과장 표현 제거
버튼 반복보다 구매 전 마지막 불안이 정리된 뒤 행동을 제안하는지 봅니다.
- 배송/교환
- 가격 부담
- 선택지 단순화
문장 길이, 이미지 간격, 고아문자, 버튼 크기가 작은 화면에서도 편한지 점검합니다.
- 한 줄 길이
- 스크롤 리듬
- 버튼 터치 영역
예쁘게 바꾸는 수정이 아니라 이탈 지점과 의심 지점을 줄이는 수정을 우선합니다.
- 삭제할 문장
- 앞으로 올릴 정보
- 뒤로 미룰 설명
읽는 순서는 구매 결정의 순서와 맞춥니다.
상세페이지를 읽을 때는 이 순서가 기준이 됩니다. 각 글과 사례 분석도 대상, 차이, 신뢰, 행동의 흐름 안에서 정리합니다.
대상이 흐리면 혜택도 흐립니다. 첫 문장과 대표 이미지가 사용자를 정확히 부르는지 봅니다.
기능보다 차이가 먼저 보이는지 확인합니다. 차이가 보이지 않으면 가격 비교로 흐릅니다.
후기와 증거는 많을수록 좋은 것이 아니라 의심이 생기는 지점에 있어야 합니다.
배송, 교환, 사용법, 옵션 선택의 마지막 불안을 줄인 뒤 구매 버튼이 놓이는지 봅니다.
현재 상세페이지를 빠르게 점검합니다.
아래 항목은 실무 검수용 기준입니다. 체크가 낮다면 디자인보다 정보 순서부터 다시 봐야 합니다.