사이트 빌더 시작하기
사이트 빌더는 제목·이미지·버튼 등의 요소를 추가하고 배치하여 웹페이지를 만드는 편집 도구입니다. 처음이라면 아래 순서대로 따라 해 주세요. 이 문서에서는 페이지 내용을 편집하고 실제 방문자 화면에 게시하는 과정부터 안내합니다.
안내
PC의 웹 브라우저를 기준으로 설명합니다. 캡처의 QA 페이지는 사용 방법을 보여주기 위한 테스트 페이지입니다. 실제 작업에서는 본인의 사이트와 페이지 이름을 선택해 주세요. 화면 확인 기준: 2026년 11월 3일.
시작하기 전에
- 편집할 사이트와 페이지를 준비합니다. 사이트가 여러 개라면 이름과 주소를 먼저 확인해 주세요.
- 제목·소개 문구·이미지·버튼을 눌렀을 때 이동할 주소를 준비합니다.
- 처음 연습할 때는 운영 중인 첫 화면 대신 별도의 연습용 페이지를 사용합니다.
먼저 알아두면 좋은 용어
용어 | 뜻 |
|---|---|
사이트 / 페이지 | 사이트는 여러 페이지의 묶음이고, 페이지는 각각의 주소로 여는 화면입니다. |
요소 / 블록 | 제목·이미지·버튼 등 화면을 구성하는 부품입니다. 여러 요소가 묶인 완성형 블록도 있습니다. |
캔버스 | 페이지 내용을 추가하고 배치하는 가운데 작업 영역입니다. |
인스펙터 | 선택한 요소의 내용·모양·간격 등을 설정하는 패널입니다. |
레이아웃 / 구조 | 레이아웃은 요소를 담는 영역, 구조는 부모·자식 관계와 순서를 보여주는 목록입니다. |
1단계. 빌더 화면 확인하기
편집할 페이지의 빌더를 열고, 왼쪽 위 페이지 선택란에 원하는 페이지 이름이 표시되는지 확인합니다.
2단계. 작은 페이지부터 만들어 보기
- 라이브러리에서 제목을 추가하고 페이지의 주제를 입력합니다.
- 텍스트로 소개 문장을 넣습니다.
- 이미지를 추가하여 사용할 사진을 선택합니다.
- 버튼을 추가하고 표시 문구와 이동 주소를 설정합니다.
- 요소를 선택하여 글자 크기·정렬·여백을 조절합니다.
아래 목차의 세부 사용법에서 각 조작과 확인 방법을 차례로 안내합니다.
3단계. 화면 크기별로 확인하기
위쪽 데스크톱 → 태블릿 → 모바일을 차례로 선택합니다. 제목이 잘리거나 이미지가 찌그러지지 않는지, 버튼을 누르기 편한지 확인합니다. 편집기 미리보기와 실제 기기 화면이 다를 수 있으므로 게시 후 실제 주소에서도 확인해 주세요.
4단계. 저장한 뒤 게시하기
작업 | 확인할 내용 |
|---|---|
저장 | 편집 내용을 보관합니다. 저장만으로 방문자 화면에 배포되는 것은 아닙니다. |
게시 | 저장한 내용을 방문자가 보는 화면에 배포합니다. 배포 상태와 실제 주소를 함께 확인합니다. |
활성화 | 사이트가 방문자에게 접근 가능한 상태인지 설정합니다. 게시 완료와 활성화 여부는 각각 확인해야 합니다. |
처음 사용할 때의 완료 기준
- 다시 빌더를 열어도 작성한 내용이 남아 있습니다.
- 배포 내역에서 완료 상태를 확인했습니다.
- 실제 페이지 주소에서 최신 제목·이미지·버튼이 보입니다.
- PC와 모바일에서 링크와 화면 배치를 확인했습니다.
잘되지 않을 때
저장했는데 실제 화면이 그대로라면 게시 여부를 확인합니다. 게시 완료 직후에는 반영에 시간이 걸릴 수 있으니 실제 주소를 새로고침해 확인해 주세요. 오류가 반복되면 같은 작업을 계속 누르지 말고 화면의 안내와 발생 시점을 기록합니다.