/ 기획 & 디자인

전환되는 랜딩페이지 구조 — 방문자를 행동까지 데려가는 흐름

방문자는 사이트에 와서 위에서 아래로 스크롤하며 “여기가 믿을 만한가, 행동할까”를 판단합니다. 그 흐름에 맞춰 정보를 배치하면 자연스럽게 문의·예약까지 이어져요. 예쁜 섹션을 나열하는 게 아니라, 설득의 순서로 쌓는 게 핵심입니다.

업종별 기대치는 업종별 디자인 패턴, 문구 작성은 카피라이팅에서 다룹니다. 이 글은 섹션 순서·구조입니다.

방문자의 3가지 질문

스크롤하며 방문자는 순서대로 묻습니다. 랜딩 구조는 이 순서에 답하는 거예요.

1. "여기 내가 찾던 곳 맞아?"   → Hero
2. "그래서 뭐가 좋은데?"        → 가치 제안
3. "믿을 만해?"                → 사회적 증거
4. "그럼 어떻게 하지?"          → CTA

표준 섹션 순서

순서섹션역할
1Hero3초 안에 “무엇/누구/차별점” 답 + 1차 CTA
2가치 제안핵심 이점 3가지
3서비스·진료 안내무엇을 제공하는지 구체적으로
4사회적 증거후기·실적·인증 (신뢰)
5자주 묻는 질문망설임·반론 해소
6최종 CTA행동 유도 + 연락처

💡 업종·목적에 따라 가감하되, Hero → 신뢰 → 행동의 큰 뼈대는 유지합니다.

1. Hero — 첫 화면이 전부

방문자의 절반은 Hero만 보고 떠납니다. 여기서 결판나요.

  • 헤드라인: 무엇을·누구에게·어떤 차별점으로 (3초 안에)
  • 서브 헤드라인: 한 줄 보충
  • 1차 CTA: 가장 중요한 행동 버튼 1개
  • 시각: 핵심을 보여주는 이미지 (분위기용 X)
❌ "환영합니다" + 풍경 사진
✅ "안산에서 야간·주말 진료하는 이비인후과"
   + "평일 밤 9시까지" + [예약하기] + 진료실 사진

→ 카피 공식은 카피라이팅 참고.

2. 가치 제안 — 왜 우리인가

방문자가 얻는 이점 3가지를 기능이 아닌 결과로.

✅ "야간 진료 — 퇴근 후에도"
✅ "한 곳에서 — 코·귀·목 모두"
✅ "빠른 예약 — 대기 없이"
  • 3개가 기억하기 좋음 (너무 많으면 안 남음)
  • 각각 짧은 제목 + 한 줄 설명 + 아이콘

3. 사회적 증거 — 신뢰의 핵심

사람은 남들의 선택을 보고 안심합니다. 이 섹션이 전환을 크게 좌우해요.

  • 후기: 실명·사진·구체적 내용일수록 강함
  • 실적 수치: “월 1,200명”, “재방문율 85%”
  • 인증·자격·수상: 있는 그대로
  • 로고 월(거래처·언론): B2B에 효과

증거는 구체적일수록 믿깁니다. “많은 분이 만족” < “3,000건 진료, 평점 4.8”

4. CTA 배치 — 한 번만으로 부족

CTA는 Hero에 1번, 중간에 1번, 마지막에 1번 — 스크롤 흐름에 반복합니다.

  • 행동 1개로 통일 (“예약하기”면 끝까지 “예약하기”)
  • 모바일은 하단 고정 버튼(전화·예약)도 효과적
  • 문구는 구체적으로 (UX 라이팅)

시선 흐름과 맞추기

랜딩은 보통 Z 패턴(좌상 로고 → 우상 메뉴/CTA → 본문 → 하단 CTA)으로 시선이 흐릅니다. 중요 요소를 그 자리에 두세요. (시각 위계 참고)

모바일 우선

소개형 사이트 방문의 다수가 모바일입니다.

  • 세로 스크롤로 자연스럽게 쌓기
  • Hero 헤드라인이 모바일에서 잘리지 않게
  • CTA는 엄지로 누르기 좋은 크기·위치
  • 하단 고정 전화/예약 바 고려

랜딩 구조 체크리스트

  • Hero가 3초 안에 핵심을 답하는가
  • Hero에 1차 CTA가 있는가
  • 가치 제안이 3가지로 압축됐는가
  • 사회적 증거(후기·수치·인증)가 있는가
  • CTA가 흐름에 2~3회 반복되는가
  • FAQ로 망설임을 해소하는가
  • 모바일에서 흐름이 자연스러운가
  • 행동(CTA)이 하나로 통일됐는가

⚠️ 자주 하는 실수

  • Hero가 분위기용: 멋진 사진 + “환영합니다” → 정보 0
  • 가치 제안 과다: 이점 8개 나열 → 아무것도 안 남음
  • 사회적 증거 없음: 자기 자랑만 → 신뢰 안 감
  • CTA 1번뿐: 스크롤 끝까지 갔는데 행동 버튼이 없음
  • CTA 종류 혼란: 예약·전화·상담·문의가 제각각 → 결정 마비
  • 데스크탑만 보고 디자인: 모바일에서 흐름 깨짐

❓ FAQ

Q. 모든 사이트가 이 순서를 따라야 하나요? A. 큰 뼈대(Hero → 가치 → 신뢰 → 행동)는 대부분 유효합니다. 업종·목적에 따라 섹션을 가감하되, “방문자의 3가지 질문에 순서대로 답한다”는 원리는 같아요.

Q. 한 페이지(원페이지)가 좋나요, 여러 페이지가 좋나요? A. 소개형·단일 목적이면 원페이지 랜딩이 전환에 유리합니다. 정보가 많거나 여러 서비스면 페이지를 나누되, 첫 화면(홈)은 랜딩 구조로 만드세요.

Q. 후기가 없는데요? A. 초기엔 실적 수치·인증·자격·전후 사례로 대체합니다. 후기는 운영하며 모으되, 고객 자료 준비 단계에서 신뢰 요소를 미리 챙기세요.

Q. CTA를 너무 많이 넣으면 거슬리지 않나요? A. 같은 행동을 흐름 중간중간 반복하는 건 자연스럽습니다. 문제는 다른 종류의 CTA가 섞일 때예요. 하나로 통일하면 반복돼도 거슬리지 않습니다.


관련 가이드

작성·운영 — 언웹스 가이드센터. 실무에서 검증한 내용을 정리하고 정기적으로 업데이트합니다. 가이드센터 소개 →