원페이지 사이트 구성 방법

  아임웹 연구소 소장 해준  |  2017 . 12 . 06

원페이지 사이트란?
인쇄물로 쳤을 때 웹사이트는 여러 페이지들로 구성된 '책'과 유사하다면, 원페이지(1 Page) 사이트는 오직 1개 페이지만으로 구성되기 때문에 '팜플릿' 또는 '브로셔'와 유사합니다.

원페이지 사이트는 주로 소품종 상품을 온라인에서 홍보/판매하거나, 특정 상품만을 집중적으로 홍보하고자 할 때 랜딩페이지로도 활용됩니다. 원페이지 사이트는 단순한 디자인 레이아웃과 짧고 굵은 정보로 구성되는 것이 특징이며, 페이지 상단 및 하단에는 방문자로 하여금 어떤 행동을 촉구하는 문장 또는 버튼(Call-To-Action)이 반드시 포함됩니다.



아임웹에서 원페이지 구성이란?
여러분께서 제작하신 여러 개의 메뉴들을 하나로 모아서 표시해주는 기능을 말합니다. [메뉴 관리]에서 필요하신 만큼 메뉴들을 생성해, 디자인한 뒤, [원페이지 구성] 기능을 활성화하면, 처음에는 따로 분류되어 있던 각 메뉴들이 하나의 메뉴로 합쳐집니다.

*아임웹 원페이지 구성 예시는 http://plipop.imweb.me 에서 확인하실 수 있습니다.
*해당 사이트는 샘플이며, 이미지는 http://unsplash.com의 저작권 프리 이미지가 사용되었습니다.



원페이지 구성 방법

1단계, 메뉴 생성 및 디자인하기
아래 그림처럼 필요하신 만큼 메뉴를 생성한 다음, 각 메뉴를 디자인합니다. 제 경우 총 5개(HOME, INTRO, SPACE, LOCATION, CONTACT)의 페이지를 만들어두었습니다.

메뉴를 추가 및 편집하는 방법은 메뉴 추가하기 가이드에서 알아보세요. :)






2단계, 공통 디자인 설정 열기
각 메뉴를 원페이지로 구성하려면 [공통 디자인 설정] 메뉴를 열어야 합니다. 아래 그림을 참조해 공통 디자인 설정 메뉴를 열어주세요.






3단계, 원페이지 구성 체크하기
공통 디자인 설정 패널이 열리면, 그림처럼 옵션 항목에서 [원페이지 구성]을 찾아 체크합니다.






4단계, 편집 내용 게시하기
[원페이지 구성]을 체크한 다음에는 꼭 [게시하기]를 클릭해주세요.






5단계, 원페이지 구성 확인하기
이것으로 원페이지 구성이 완료되었습니다. 참, 간단하죠?^^ 이제 내 사이트에 접속해서, 각 메뉴들이 모두 원페이지로 구성되었는지 확인해주세요. :)

각 메뉴에 디자인한 페이지와 상단메뉴의 메뉴들을 클릭하면, 하단 또는 상단으로 이동되어야 정상적으로 적용된 것입니다.






6단계, 특정 메뉴 원페이지 구성 해제하기
필요하신 경우 특정 메뉴는 원페이지 구성에서 빼는 것도 가능합니다. 제 경우 CONTACT 메뉴를 클릭하면, 별도의 페이지로 빠지도록 구성했습니다.




해준
배우고 익히고 나누는 | 해준씨 | 유용한 콘텐츠 마케팅 | 네이버 카페 '아임웹 연구소' 소장
jin@haejoon.com

아임웹 공식제휴사

아임웹은 페이팔, KG이니시스, 네이버페이, KCP 공식파트너입니다.