예시 · 내 서비스를 소개하는 웹사이트

섹션을 얹어가며 한 페이지 완성하기 (가상 시나리오)

수업에서는 “무엇을 먼저 보여줄지” 순서를 정하는 일부터 시작합니다. 아래 버튼으로 섹션을 하나씩 추가해보세요.

미리보기 화면 크기

오후의 도마

아직 아무 섹션도 없습니다. 위의 “다음 섹션 추가”를 눌러 한 줄씩 쌓아보세요.

첫 화면

주문 하나에 하나씩, 결을 보고 깎습니다. (가상의 소개 문구)

제작 문의하기

무엇을 하는지

처음 오신 분이 3초 안에 파악할 수 있게, 하는 일을 덩어리로 나눕니다.

주문 제작크기와 나무를 골라 맞춤 제작

수리 · 관리쓰던 도마 기름칠과 손질

원데이 클래스직접 깎아보는 두 시간

작업 보여주기

말보다 사진이 빠릅니다. 결과물 몇 개만 골라 배치합니다.

월넛 사각 도마주문 제작 · 가상 예시

체리목 빵 도마주문 제작 · 가상 예시

손잡이 트레이주문 제작 · 가상 예시

문의 받기

페이지 끝에서 연락처를 받습니다. 실제 수업에서는 이 폼이 메일이나 시트로 연결됩니다.

이름 연락처

원하시는 크기와 나무 문의 보내기

같은 페이지를 데스크톱과 모바일에서 번갈아 보세요. 카드가 세 칸에서 한 줄로 접히고 메뉴가 버튼으로 바뀌는 것이 “반응형”입니다. 미리보기 안의 문구와 이미지 자리는 모두 설명용 가짜 값입니다.

누구에게 무엇을 말할지 정하고, 섹션 순서를 짜고, 카피와 화면을 만들고, 주소가 나오는 곳까지 배포합니다.

링크 하나로 공유할 수 있는 내 소개 페이지와, 내용을 스스로 고쳐 넣는 방법이 정리된 문서가 남습니다.

소개하고 싶은 일이나 서비스가 있다면, 첫 화면 한 줄부터 같이 정리해봐요.