지금 읽는 곳퍼스트뷰가 답해야 하는 세 가지 질문은 무엇인가목차
S2 › 이커머스 운영·수익성 관리 › 과목 211 › 레슨 04
상세페이지 첫 화면(퍼스트뷰)에 반드시 들어가야 할 3가지 요소
첫 화면에 무엇을 넣을지보다, 무엇을 빼야 세 가지가 들어가는지가 실제 작업입니다.
핵심요약
- 퍼스트뷰에 넣어야 할 세 가지는 무엇인지, 왜 여기서 사야 하는지, 지금 무엇을 누르면 되는지다
- 폴드 경계를 픽셀 수치로 고정하는 공식 표준은 없으므로 실기기 프리뷰로 직접 확인해야 한다
- 국내 온라인쇼핑 거래액의 대부분이 모바일에서 발생하므로 퍼스트뷰 설계 기준은 모바일이다
- 가격·배송비·혜택 조건은 첫 화면에 쓰는 순간 표시광고법상 실증 책임이 따라붙는다
- 첫 화면 아래에 콘텐츠가 더 있다는 신호를 주지 않으면 가짜 바닥 현상으로 이탈이 생긴다
퍼스트뷰가 답해야 하는 세 가지 질문은 무엇인가
첫 화면은 디자인 영역이 아니라 응답 영역입니다. 방문자가 스크롤을 시작할지 뒤로가기를 누를지 결정하는 구간이므로, 그 짧은 시간에 세 가지 질문에 답해야 합니다. 이게 무엇인가, 왜 하필 여기서 사야 하나, 지금 무엇을 누르면 되나입니다.
첫째는 상품 정체입니다. 대표 이미지와 상품명이 담당하는데, 이미지가 분위기 컷 한 장뿐이면 정체가 전달되지 않는 경우가 많습니다. 둘째는 구매 이유입니다. 가격, 구성, 배송 조건, 차별점 중 이 상품에서 가장 강한 하나를 골라 문장으로 박습니다. 셋째는 행동 지시입니다. 폴드 위에 최소 하나의 구매 버튼을 두는 배치가 일반적으로 권장됩니다.
첫 화면의 범위를 어떻게 확정하나
폴드는 스크롤 없이 화면에 보이는 경계선을 뜻합니다. 여기서 자주 나오는 질문이 그 경계가 몇 픽셀이냐는 것인데, 이를 고정 수치로 정하는 국내외 공식 표준은 없습니다. 기기와 해상도, 브라우저 주소창 높이에 따라 첫 화면 영역이 달라지기 때문입니다.
그래서 실무에서는 수치 대신 확인 절차를 씁니다. 최근 한 달 트래픽 기준으로 방문이 가장 많은 기기 상위 3종을 뽑고, 그 해상도에서 상세페이지를 열어 첫 화면에 무엇까지 들어오는지 캡처합니다. 국가데이터처 온라인쇼핑동향조사 기준으로 온라인쇼핑 거래액 중 모바일 비중이 2026년 초 기준 75에서 78퍼센트 구간에 있는 만큼, 기준 화면은 데스크톱이 아니라 모바일로 잡는 것이 맞습니다.
세 요소가 안 들어갈 때 무엇부터 빼야 하나
현실의 상세페이지 첫 화면은 이미 꽉 차 있습니다. 배너, 쿠폰 팝업, 앱 설치 유도, 상단 고정 공지, 브랜드 스토리 문구가 자리를 나눠 갖고 있는 경우가 흔합니다. 이때 판단 기준은 그 요소가 앞의 세 질문 중 하나라도 답하는가입니다.
답하지 않는 요소는 폴드 아래로 내립니다. 특히 화면을 덮는 쿠폰 팝업은 첫 화면 전체를 가리므로 세 요소를 모두 무력화합니다. 닫기 버튼이 작거나 위치가 애매하면 이탈 원인 자체가 되기도 합니다. 쿠폰을 알리고 싶다면 팝업 대신 가격 옆 한 줄 표기로 옮기는 편이 안전합니다.
첫 화면에 쓴 문구에 어떤 책임이 따라붙나
첫 화면 문구는 가장 눈에 잘 띄는 광고 문구이기도 합니다. 표시·광고의 공정화에 관한 법률 제3조는 거짓·과장, 기만적, 부당비교, 비방 광고를 금지하고, 같은 법 제5조는 광고에서 제시한 주장에 대해 광고주에게 실증 자료를 준비·제출할 입증책임을 지웁니다.
특히 조심할 표현이 최상급입니다. 국내 1위, 최고, 유일 같은 배타적 표현은 공인기관 인증이나 제3자 통계 같은 객관적 근거 없이는 쓸 수 없습니다. 판매량 1위 같은 문구를 쓴다면 어느 채널의 어느 기간 집계인지 근거를 보관하고, 가능하면 문구 자체에 그 범위를 병기하는 편이 안전합니다.
가격과 배송 조건은 첫 화면에서 어디까지 밝혀야 하나
첫 화면에서 가격을 보여 주고 배송비는 결제 단계에서야 드러나는 구조는 이탈을 만드는 대표적인 구성입니다. 해외 조사기관 Baymard Institute 집계에서도 배송비와 세금 같은 추가 비용 과다가 결제 이탈 사유 상위에 올라 있습니다. 이 수치는 특정 해외 조사기관의 설문 집계라 국내 공식 표준은 아니지만, 추가 비용이 뒤늦게 등장할 때 이탈이 생긴다는 구조 자체는 국내 자사몰에서도 그대로 관찰됩니다.
법적으로도 정보를 뒤로 숨기는 구성은 위험합니다. 공정거래위원회는 가격을 단계별로 나눠 보여 주는 순차 공개 가격 책정을 다크패턴 세부 유형으로 분류했고, 이 유형을 포함한 여섯 가지가 전자상거래법에 명시돼 2025년 2월 14일부터 시행됐습니다. 첫 화면에 최종 부담액을 예측할 수 있는 정보를 함께 두는 편이 전환과 준법 양쪽에서 유리합니다.
아래에 내용이 더 있다는 신호를 어떻게 주나
세 요소를 잘 배치하고도 이탈이 나는 경우가 있습니다. 섹션 배경 경계가 화면 하단과 우연히 겹쳐 방문자가 여기가 끝이라고 착각하는 가짜 바닥 현상입니다. 이 착각이 생기면 아래에 있는 리뷰나 상세 스펙을 아예 못 보고 나갑니다.
방지책은 단순합니다. 첫 화면 하단에 다음 섹션의 일부가 살짝 걸치도록 배치해 잘린 콘텐츠를 노출합니다. 배경색이 바뀌는 지점을 화면 경계와 어긋나게 두는 것만으로도 대부분 해결됩니다. 실기기 캡처를 놓고 하단이 깔끔하게 끊겨 보이면 오히려 위험 신호로 읽는 습관을 들이는 편이 좋습니다.