지난번 강좌에서는 노프레임의 구조에 대해서 다소 길게 알아 보았습니다.
이제 본격적으로 노프레임 홈페이지를 만들어 보도록 하겠습니다.
이번 강좌에서는 이미지를 제공하여 저도 같은 이미지로 설명합니다.

상단에 링크되어 있는 img.alz 파일을 다운 받아서 이미지라는 풀더를 만든 후 압축을 푸시기 바랍니다.
압축을 푸시면 에디터플러스 평가판과 함께 배경패턴으로 쓰일 back.gif와
여기서 사용할 이미지들이 들어 있을 것입니다.
그 이미지로 저와 여러분이 같은 조건에서 같은 형태의 노프레임을 실제로 만들것 입니다.
저역시 처음에 의문을 가졌던,
다양한 형태의 구조를 어떻게 노프레임에 적용 시키는지를 함께 알아가기 위하여
여러가지 구조를 만들어 볼것입니다.
제공된 이미지는 단순한 그림파일인 jpg이지만 구조를 확실하게 아신다면
그 자리에 메뉴가 들어 있는 플래시나 다른 파일도 쉽게 넣으실 수 있을 것입니다.
그림을 통해 head와 index, tail 대해 알아 보겠습니다.
head와 index, tail이라는 이름은 그누보드에서 쓰는 일종의 위치에 대한 일반적인 명칭일 뿐이므로
이름은 어떻게 바꾸셔도 전혀 상관 없습니다.
참고로
실제 홈페이지를 만드실 때는 구성도를 작성하셔서
각 위치에 들어갈 파일의 이름과 내용을 일목 요연하게 정리하시면
보다 체계적이고 편리한 작업이 될수 있습니다.
그림을 보겠습니다.


위와 같은 표 구조로 만들려는 홈페이지가 있을 때
헤드와 인덱스 테일을 어떻게 나눌 것인지 먼저 머리 속으로 그려 보세요.
여러분이 원하시는 어떤 형태로든지 가능하며 인덱스 화면에 다시 표를 더 넣을 수도 있습니다.
그리고 그누보드로 만드는 노프레임 홈페이지는 기본적으로
Index.php에 head.php 그리고 tail.php를 불러 오는 형태를 취합니다.
이제 위의 그림과 같은 구조를 직접 만들어서
head.php와 index.php 그리고 tail.php로 나누어 보겠습니다.
프로그램은 나모나 드림위버 등의 에디터 프로그램이나
윈도우의 메모장 또는 에디터플러스 등을 이용합니다.
여기서는 일반적으로 많이 쓰는 나모로 테이블을 만들고
에디터 플러스를 이용하여 php로 저장하는 방법을 쓰겠습니다.
나모로 php를 저장하면 자동으로 테그를 닫아 버리기 때문에
에디터 플러스를 이용하여 저장할 것입니다.
에디터 플러스 평가판은 이미지와 함께 제공하여 드렸습니다.
이제 시작합니다.
테그를 전혀 모르셔도 제가 하는대로 따라만 오시면 됩니다.

1. 위의 그림과 같은 구조를 아래처럼 head0.php index0.php tail0.php로 나누어 보겠습니다.
흔히들 일자로만 php를 나누어야 한다고들 잘 못알고 있지만
head는 기역자 형태로 index나 tail은 니은자 형태로도 나눌 수 있습니다.
그림을 보겠습니다.


위의 그림처럼 head0.php index0.php tail0.php파일을 만들어서 저장해보겠습니다.
파일이름에 0을 붙인것은 head / index / tail로 하면
그누에서 제공하는 초기 관리페이지가 바뀌기 때문입니다.
FTP프로그램을 이용하여 head.php index.php tail.php의 이름을 바꿔 놓고
관리페이지로 들어갈 때 그 파일을 불러 오는 것도 좋은 방법입니다.
이제 제공된 이미지폴더-1번구조 폴더의 그림을 가져와서 표를 직접 만들고
분리하여 저장하여 보겠습니다.
이 구조는 메인 화면 첫페이지로 많이들 쓰입니다.

한숨자고 일어나서 새벽잠이 달아나 버린 상태에서 올리다가 보니
벌써 아침입니다.

이번 강좌를 마무리 하기 전에 복습하는 의미에서
우리가 함께 만들 세가지 형태의 홈페이지 모양과 구조를 미리 보여 드립니다.
여기까지 잘 따라 오신 분이라면 아마도 그림만 보셔도 어떻게 만들어야 할지
감을 잡으실 수 있을 것입니다.

첫번째 형태
메인화면 첫페이지에 많이 쓰이는 형태입니다.


위의 형태를 아래의 구조로 나눕니다.


두번째 형태
게시판이 아닌 직접 디자인한 컨텐츠 페이지에 쓰일 심플한 표준형입니다.


위의 형태를 아래의 구조로 나눕니다.


세번째 형태
보다 복잡하고 스패셜한 형태입니다.
복잡해 보이지만 전혀 어렵지 않습니다.
보다 세련된 형태의 홈페이지 구성에 쓸수 있습니다.


위의 형태를 아래의 구조로 나눕니다.


어떻게 도움이 좀 되시나 모르겠군요.
잠시 쉬었다가 계속 올리도록 하겠습니다.
수고 하셨습니다.