친애하는 애니크님을 위해 홈페이지 강좌를 간단하게 끄적이기로 했습니다.
초보를 위해 쉽게 풀어 쓴 강좌로, 야매적인 용어와 뭐 이것저것이 포함될 수도 있습니다.



(1)홈페이지의 개념

홈페이지를 만드는 방법을 크게보면 원프레임과 복수프레임의 두가지 방식이 있습니다.
원프레임은 페이지 하나에 모든 내용이 다 표시되는 방식이고, 복수프레임은 페이지를 물리적으로 나누어서, 예를들어 두개로 나눴으면 좌/우에 다른 화면을 보여주는 홈페이지구현방식입니다. 덧붙이자면 아이프레임은 복수프레임 홈페이지의 개념입니다.

장단점을 말하자면,
원프레임홈페이지는 오류가 적습니다. 다만 소스가 한부분이라도 틀릴경우 전체페이지가 깨져버리는 현상이 발생하기 때문에 구현방법이 까다롭습니다.
복수프레임홈페이지는 수정이 용이하고 만드는 방법이 간편합니다. 디자인만 있으면 만드는데 10분도 안걸립니다. 하지만 복수프레임으로 홈페이지는 각각의 프레임에 출력되는 내용간의 충돌이 일어나기 때문에 제로보드같은 웹프로그램을 이용할 경우 충돌로 인해 로그인이 먹통이 되거나 하는 등의 오류가 나기도 합니다. 
일단은 안정적인 원프레임 홈페이지 구현방법을 서술하려합니다.


일단 제 블로그를 예로 들어볼까요. 

대부분의 홈페이지는 사실상 <표>로 이루어집니다. 
기본적으로 큰 표(테이블)가 있고, 그 안에 행x열 을 나누거나 병합해서 홈페이지의 뼈대를 만듭니다.

제 홈페이지를 예로들어 표로 나눈다면 아래와 같은 모양이 됩니다.

조금 더 상세하게 설명을 들어가면,

가로3 x 세로4칸의 커다란 표가 중심이 되는 홈페이지가 됩니다.
표를 구성하는 기본 소스는 다음과 같습니다.
      표 : <TABLE> - 내용을 입력하고 </TABLE>로 닫아주어야 합니다.
      행 : <TR>  - 내용을 입력하고 </TR>로 닫아주어야 합니다. 
      열(셀) : <TD>  - 내용을 입력하고 </TD>로 닫아주어야 합니다. 
            가로로 합친다 : (TD옵션)colspan="합칠 셀의 갯수"
            세로로 합친다 :  (TD옵션) rowspan="합칠 셀의 갯수" 
이 다섯가지만 알면 홈페이지 만들 수 있습니다.

그럼 소스는 아래와 같습니다.

<TABLE> ///표가 시작됨.
 <TR> ///첫번째 행 시작.
  <TD colspan="2"> 1 </TD> ///첫번째 행의 첫번째 칸을 가로로 한칸 합치고 사이에 1을 입력함.
 </TR> ///첫번째 행 끝남.
 <TR> ///두번째 행 시작. 
  <TD> 2 </TD> ///두번째 행의 첫번째 칸 사이에 2를 입력함.  
  <TD> 3 </TD> ///두번째 행의 두번째 칸 사이에 3를 입력함. 
 </TR> ///두번째 행 끝남. 
 <TR> ///세번째 행 시작. 
  <TD> 4 </TD> ///세번째 행의 첫번째 칸 사이에 4를 입력함.  
  <TD rowspan="2"> 5 </TD>  ///세번째 행의 두번째 칸을 세로로 한칸 합치고 사이에 5를 입력함. 
 </TR>  ///세번째 행 끝남. 
 <TR> ///네번째 행 시작. 
  <TD> 6 </TD> ///위에서 합쳐진 칸을 제외하고 첫번째 칸 사이에 6을 입력함. (중요:rowsan소스로 병합된 셀이 같은 행에 있을 경우, 병합된 셀을 제외한 셀들만 작성하여야한다.)
 </TR>  ///네번째 행 끝남. 
</TABLE> ///표가 끝남. 

뭐 이정도입니다. 소스만 쓰여있는거 암만봐도 모르기때문에 색깔있는 글씨로 주석 달았습니다.
홈페이지에 사용되는 표의 개념중 반드시 알아두어야 할 것은 다음과 같습니다.

1. 칸(셀)을 합칠 수 있지만 쪼갤수는 없다.
2. 셀 안에 표를 넣을 수 있다.
3. 병합은 왼쪽에서 오른쪽 / 위에서 아래 셀만 가능하다. 

이것만 알면 일단 표 개념은 땡.