PHP HomePage Builder - 홈페이지의 구조 알기

이 강좌가 처음인 분은 이전 강좌를 먼저 참고하기 바란다.

PHP text file 핸들링

홈페이지 제작은 비슷한 과정을 끊임없이 반복해야 하는 지루하고 고된 작업이다. 대부분 홈페이지 구조가 비슷하다 보니 홈페이지를 제작하는 사람들은 쳇바퀴 돌듯 매번 같은 일을 반복하고 반복하고 반복한다.

홈페이지 제작 시 웹 에디터를 사용하여 페이지 하나하나를 일일이 만들어 가는 경우, 작업량도 많을 뿐 아니라 수정이나 업그레이드가 필요한 경우 대부분 페이지들 다 수정해야 하는 불상사도 발생한다.

반복되는 작업은 그 횟수를 줄이고 싶고 수정이나 업그레이드가 발생할 경우 전체 웹페이지 수정없이 몇 군데 수정 만으로도 원하는 결과를 얻을 수 있으면 얼마나 좋을까.

웹사이트를 손쉽게 만들고 필요에 따라 쉽게 수정이나 업그레이드 하기 위해서는 웹사이트 전체를 쉽게 만들수 있는 Builder를 이용하면 된다. 물론 나모웹에디터나 드림위버가 있지만 그것들은 웹페이지를 편집하는 에디터이지 웝사이트 전체를 규격에 맞춰 생성하는빌더는 아니다.
 
빌더를 만들기 전 웹페이지 구성을 먼저 살펴보자. 웹사이트에서 메인페이지는 아래와 같은 구조를 가진다.

맨 위에는 대분류 메뉴들이 위치하고, 그 아래 1번 부분에는 사이트의 성격이나 특성을 잘 나타내주는 플래시나 이미지를 배치한다.

그 아래 2번 부분에는 베너나 공지사항, 게시판 최근 글 그리고 방문객들이 많이 찾는 메뉴 혹은 꼭 보여주고 싶은 주요 페이지 링크 이미지들로 구성되어 있다.

3번 항목은 CopyRight, 주소, 연락처 등이 들어가며 이는 웹사이트 어느 페이지나 같은 내용이 보여지는 게 보통이다.

아래 웹사이트 메인화면을 보면 위에서 언급한 내용 그대로 적용되었음을 알 수 있다. 이 형식은 몇몇 사이트에 한정된 것이 아니라 대부분 웹사이트가 이런 구조에서 크게 벗어나지 않는다.

그럼 상위 대분류의 메뉴를 클릭했을 때 변화를 보자.

기본적인 화면 구성은 아래 이미지와 비슷하며, 좌측에는 대분류 메뉴에 포함되는 소분류메뉴들이 가운데는 소분류메뉴를 선택했을시 보여주는 본문이 위치한다.

즉 1번의 대분류를 선택했을시 2번 부분에 대분류의 소분류메뉴가 나타나고 3번 부분에 현재 선택된 대분류의 이름이, 그리고 2번의 소분류를 클릭했을 때 4번 부분에 해당 소분류의 본분이 보인다.

5번 부분에는 해당 페이지에 맞는 이미지나 플래시를 보여주고, 맨 아래 6번 부분에는 늘 따라다니는 하단 알림이 위치한다.

아래 이미지는 위에서 2번째 이미지의 대학 웹사이트에서 대학소개를 선택했을 때 화면이다. 역시 위에서 언급한 내용과 구성이 같다. 다른 웹사이트 역시 약간씩 다르다 해도 이 틀에서 많이 벗어나지 않는다.

자 홈페이지 구조들이 위와 같이 비슷하다면 이를 만들기 위해 전체 페이지를 하나하나 일일이 만들 필요가 없다.

기본적이 뼈대를 만들고 페이지마다 같은 내용이 들어가는 부분은 PHP를 이용하여 함수로 만들거나 디자인하여 파일로 저장한 후 include 기능을 이용하여 필요한 페이지에서 불러오면 된다.

다음 포스트에서는 위 개념을 PHP를 이용하여 프로그래밍 해 보자