정보처리, 컴퓨터활용능력, 사무자동화, 재경관리사 등 국가공인 자격증 강의를 제공하는 온라인 교육 플랫폼의 홈페이지를 리뉴얼한 사례입니다. 강의 수와 강사진이 늘면서 기존 구조로는 콘텐츠를 정리해 보여주기 어려운 상태였고, 모바일 이용자에게도 같은 수준의 탐색 환경을 제공하는 것이 과제였습니다. 시험 일정과 강의 구성이 시즌마다 바뀌는 사이트인 만큼, 완성보다 운영이 이어지는 구조를 함께 고려했습니다.
메뉴 구조와 탐색 흐름
계열별 분류와 전체강의 경로 병렬 구성
강의 메뉴는 정보처리·보안, 사무자동화, 컴활·워드, ITQ·GTQ, 재경·회계관리 다섯 계열로 나뉩니다. 각 계열 아래 세부 자격증으로 바로 진입하는 드롭다운(Dropdown) 구조와, 전체강의 버튼에서 모든 강의를 한눈에 보는 경로를 함께 뒀습니다. 목적이 분명한 이용자와 아직 강의를 결정하지 못한 이용자를 모두 수용하는 방식입니다.
모바일 내비게이션 처리
PC 상단에 노출되는 로그인, 회원가입, 내강의실, 공지사항, 1:1상담 링크는 모바일에서 햄버거 메뉴 안으로 접힙니다. 화면 폭이 좁아질수록 핵심 탐색 구조만 남기고 나머지는 감추는 방식입니다.
메인 화면 구성
콘텐츠 배치 순서
메인은 배너 영역을 상단에 두고, 추천 강의, 패키지 상품, 수강후기 슬라이드, 대표 강사진, 필수 교재, 공지사항·학습질문 순으로 배치했습니다. 처음 방문한 이용자가 강의를 고르기 전에 후기와 강사 정보를 확인하고, 교재와 공지사항까지 한 페이지 안에서 흐름대로 읽히도록 순서를 잡은 것입니다.
강의 카드와 수강 조건 표시
추천 강의와 패키지 상품은 슬라이드(Slider) 형태로 처리했습니다. 강의 썸네일, 강사명, 가격, 할인 여부를 카드 형태로 보여주고, 재수강 할인이나 연장·휴강 지원 같은 수강 조건은 배지(Badge) 형태로 표시했습니다. 수강 조건 배지는 강의 등록 화면에서 항목을 선택하는 방식으로 처리되어, 시즌별로 조건이 바뀌더라도 강의 상세 정보만 수정하면 목록과 메인 화면에 동시에 반영됩니다.
수강후기 자동 연동과 퀵메뉴
수강후기 영역은 게시판과 연동되어 최신 후기가 자동으로 반영됩니다. 합격 후기와 시험 후기가 함께 노출되어 결과와 과정을 모두 확인할 수 있는 구조입니다. 하단 퀵메뉴에는 무료강좌 안내, 응시자격 서류제출, 시험일정, 원격지원을 아이콘과 함께 배치해 수험생이 자주 찾는 경로를 한곳에 모았습니다.
반응형 웹 처리
기존 사이트는 PC 기준으로만 구성되어 모바일에서 가로 스크롤이 생기거나 버튼이 겹치는 문제가 있었습니다. 화면 폭에 따라 레이아웃이 자동으로 조정되는 반응형 구조(Responsive Web Design)로 전면 재구성했습니다. 강의 카드 목록은 모바일 1열에서 PC 4열까지 자동으로 전환됩니다. 강사 소개, 교재 목록, 수강후기 슬라이드도 같은 방식으로 처리했습니다.
SEO 구조 설계
페이지별 역할 분리
계열 카테고리 페이지, 세부 자격증 목록 페이지, 개별 강의 페이지가 검색 결과에서 서로 겹치지 않도록 자격증명, 과정 유형, 강사 이름을 기준으로 제목 체계를 정리했습니다. 각 페이지의 메타 제목(title)과 설명(description)은 따로 작성했고, 대표 URL(canonical)도 명확히 지정했습니다.
구조화 데이터와 분석 도구 연동
사이트 기본 정보는 검색 엔진이 기관 정보로 인식하도록 구조화 데이터(Schema.org - Organization)를 적용했습니다. 공식 블로그, SNS 채널 연결 정보도 포함해 동일한 운영 주체로 연결되도록 처리했습니다. Google Search Console과 네이버 서치어드바이저 인증을 완료했고, Google Analytics를 연동해 유입 경로와 강의 페이지별 방문 현황을 확인할 수 있습니다. 강의 분류, 강사 정보, 수강후기가 각각 분리된 구조 안에서 하나의 흐름으로 연결되도록 정보를 배치한 것이 이 사이트 SEO 작업의 핵심입니다.
관리자 기능과 운영 구조
코드 없이 직접 다루는 운영 환경
메인 배너, 추천 강의, 패키지 상품, 공지사항은 관리자 페이지에서 직접 등록하고 수정합니다. 개발자에게 요청하지 않아도 운영 담당자가 텍스트와 이미지를 교체하고 노출 순서를 조정할 수 있습니다.
시즌 운영을 고려한 구조
수강후기는 이용자가 등록한 게시물이 사이트에 자동 노출되고, 관리자는 노출 여부만 조정합니다. 공지사항과 학습질문 게시판도 같은 방식으로 운영됩니다. 시험 일정이 바뀌거나 새 강의가 추가될 때 해당 항목만 수정하면 전체 화면에 반영됩니다. 시즌이 바뀌어도 구조를 손댈 필요 없이 내용만 갱신하면 되는 체계입니다.
