온라인 강의 사이트 만들기에서 강의를 등록하고 결제를 연결한 뒤 마지막으로 남는 작업이 메인 페이지 구성입니다. 메인 페이지는 방문자가 처음 도착하는 화면이고, 여기서 강의 상세 페이지로 넘어가느냐 그냥 나가느냐가 갈립니다. 강의 목록과 소개 문구를 어떤 순서로 놓느냐에 따라 클릭율이 달라지는데, 정해진 배치 순서를 따르면 처음 만드는 사이트라도 기본 구조를 빠르게 잡을 수 있습니다.
메인 페이지에 있어야 하는 요소 세 가지
메인 페이지에 반드시 들어가야 하는 요소는 세 가지입니다.
- 소개 문구(히어로 영역) — 이 사이트가 무엇을 가르치는 곳인지 한눈에 보여주는 문장입니다. 방문자가 스크롤하기 전에 읽는 첫 텍스트이므로, 사이트 전체의 첫인상을 결정합니다.
- 강의 목록 — 현재 판매 중인 강의를 카드 형태로 보여줍니다. 썸네일, 제목, 가격이 한 카드에 들어갑니다.
- 행동 유도 요소 — 특정 강의 페이지로 바로 이동하는 버튼이나, 강의 목록 영역으로 스크롤을 유도하는 안내 문구입니다.
이 세 요소를 어떤 순서로 쌓느냐가 메인 페이지 배치의 핵심입니다. 하나라도 빠지면 방문자가 다음 행동을 찾지 못하고 이탈합니다.
배치 순서 — 소개 문구, 대표 강의, 전체 목록
첫 화면, 즉 스크롤 없이 보이는 영역에는 소개 문구를 넣습니다. 방문자가 도착한 직후 “여기가 어떤 곳인지”를 파악하는 데 걸리는 시간은 길어야 3초입니다. 소개 문구가 그 3초 안에 읽혀야 합니다.
소개 문구 바로 아래에는 대표 강의 1~3개를 배치합니다. 전체 목록을 한꺼번에 펼치지 않고, 가장 잘 팔리는 강의나 신규 방문자에게 먼저 보여주고 싶은 강의를 골라 올립니다. 대표 강의가 눈에 들어와야 “더 있나?” 하고 아래로 스크롤하게 됩니다.
대표 강의 아래에 전체 강의 목록을 둡니다. 강의가 다섯 개 이상이면 주제별로 묶어서 보여주는 편이 낫습니다. 주제 구분 없이 일렬로 나열하면 방문자가 자기에게 맞는 강의를 찾기 어렵습니다.
정리하면 위에서 아래로 이 순서입니다.
- 소개 문구 + 행동 유도 버튼
- 대표 강의 1~3개
- 전체 강의 목록(주제별 구분)
온라인 강의 사이트 만들기 — 소개 문구 작성 기준
소개 문구는 두 가지만 담으면 됩니다.
- 누구를 위한 사이트인지 — 대상을 한 줄로 적습니다. “초보자를 위한”, “현직 교사를 위한”처럼 읽는 사람이 자기 얘기라고 느끼게 합니다.
- 무엇을 배울 수 있는지 — 가르치는 주제를 구체적으로 적습니다. “다양한 강의”가 아니라 “수채화 기초부터 풍경화까지”, “엑셀 함수 실무 활용”처럼 범위가 보여야 합니다.
두 줄이면 충분합니다. 길게 쓸수록 읽히지 않습니다. 소개 문구 옆이나 바로 아래에 강의 목록으로 이동하는 버튼을 하나 두면 스크롤 없이도 다음 단계로 넘어갈 수 있습니다.
흔한 실수는 인사말로 시작하는 것입니다. “안녕하세요, 환영합니다”는 아무 정보가 없습니다. 방문자는 내가 누구인지보다 여기서 무엇을 얻을 수 있는지를 먼저 알고 싶어 합니다. 대상과 주제를 앞에 쓰고, 자기소개는 별도 페이지에 두는 것이 낫습니다.
강의 카드에 보여줄 정보
강의 목록의 각 카드에는 아래 정보가 들어가야 합니다.
- 썸네일 — 비율을 통일합니다. 가로형(16:9)이 가장 무난합니다. 비율이 섞이면 카드 높이가 들쭉날쭉해져 정돈되지 않은 인상을 줍니다.
- 강의 제목 — 한 줄에서 두 줄 사이가 적당합니다. 세 줄 이상 넘어가면 카드가 길어지므로 제목을 줄입니다.
- 가격 — 할인 전후 가격을 같이 보여줄 경우 할인 후 가격을 크게, 원래 가격을 취소선으로 작게 표시합니다.
- 수강 기간 — 무제한이면 “무제한 수강”, 기간 제한이면 “수강 기간 90일”처럼 카드에 직접 적어 둡니다. 상세 페이지에 가서야 기간을 알 수 있으면 클릭 전에 망설이게 됩니다.
카드에 정보가 너무 많아도 문제입니다. 커리큘럼 전체나 강사 약력까지 카드에 넣으면 시선이 분산됩니다. 썸네일, 제목, 가격, 수강 기간 네 가지면 충분하고, 나머지는 상세 페이지에서 확인하게 합니다.
강의 수에 따른 배치 조정
강의가 1~2개뿐이면 카드를 나열하는 것보다 각 강의를 섹션 단위로 크게 소개하는 편이 낫습니다. 카드 두 개만 달랑 있으면 사이트가 비어 보입니다. 강의 하나에 한 섹션을 할당하고, 커리큘럼 요약이나 수강 대상을 함께 적어 화면을 채웁니다.
강의가 열 개 이상이면 전부 한 줄로 늘어놓지 말고 카테고리별로 묶습니다. “기초 과정”, “심화 과정”, “특강”처럼 수강자가 단계를 구분할 수 있는 기준으로 나눕니다. 카테고리 이름을 소제목으로 쓰고 그 아래 해당 강의 카드를 배치하면, 방문자가 자기 수준에 맞는 영역부터 살펴볼 수 있습니다.
배치를 끝낸 뒤 점검 목록
메인 페이지 구성을 마치면 아래 항목을 하나씩 확인합니다.
- 모바일 화면 확인 — 방문자 절반 이상이 모바일로 들어옵니다. 소개 문구가 잘리지 않는지, 강의 카드가 한 줄에 하나씩 깔끔하게 쌓이는지 봅니다.
- 첫 화면에 소개 문구가 보이는지 — 스크롤 없이 소개 문구 전체가 노출되어야 합니다. 배경 이미지가 너무 크면 문구가 화면 아래로 밀립니다.
- 강의 카드 상단이 보이는지 — 소개 문구 영역이 화면 전체를 차지하면 강의 목록이 있다는 사실 자체를 모릅니다. 소개 문구 아래에 카드 상단이 살짝이라도 보여야 스크롤 동기가 생깁니다.
- 링크 작동 확인 — 강의 카드를 클릭하면 해당 강의 상세 페이지로 정확히 이동하는지, 버튼이 빈 링크로 남아 있지 않은지 하나씩 눌러 봅니다.
- 로그아웃 상태에서 확인 — 관리자 계정으로 로그인한 채 보면 일반 방문자와 다르게 보일 수 있습니다. 로그아웃하거나 시크릿 창에서 열어 확인합니다.
이 다섯 항목을 통과하면 메인 페이지 배치는 마무리입니다. 이후에는 방문자 반응을 보면서 대표 강의 순서를 바꾸거나 소개 문구를 다듬으면 됩니다.
런모아로 메인 페이지 강의 배치를 시작하는 방법
런모아에서는 페이지 에디터로 메인 페이지를 직접 구성할 수 있습니다. 소개 문구를 텍스트 블록으로 넣고 그 아래 강의 목록 블록을 배치하면, 등록해 둔 강의가 썸네일·제목·가격과 함께 카드 형태로 자동 표시됩니다. 강의를 추가하거나 순서를 바꾸면 메인 페이지 목록에도 바로 반영되므로, 별도 코딩 없이 위에서 정리한 배치 순서를 그대로 적용할 수 있습니다.
사이트 개설부터 메인 페이지 편집, 강의 등록과 결제 연결까지 한 곳에서 진행할 수 있으며, 런모아 강의 사이트 만들기 페이지에서 전체 과정과 제공 기능을 확인할 수 있습니다.
#온라인강의 #강의사이트 #강의판매 #메인페이지 #사이트만들기 #강의사이트제작 #1인창업 #퍼스널브랜딩 #런모아
