[HTML] Content model

[HTML 콘텐츠 모델]

  HTML의 각 요소에는 요소의 예상 내용에 대한 설명인 콘텐츠 모델이 있다. 여기서, 콘텐츠 모델이란 해당 요소가 어떤 콘텐츠를 담고 있는지에 대한 포괄적 개념이라고 할 수 있다. 또한, HTML 요소에는 요소의 콘텐츠 모델에 설명된 요구 사항과 일치하는 콘텐츠가 있어야 한다.

["nothing" 콘텐츠 모델]

  요소 간 공백을 제외한 그 어떠한 콘텐츠도 포함하고 있지 않은 경우(이러한 경우를 텍스트 노드와 요소 노드가 모두 없다고 한다.)의 콘텐츠 모델을 "nothing" 콘텐츠 모델이라고 한다.

NOTE: 콘텐츠 모델이 "nothing"인 대부분의 HTML 요소는 편의상 void 요소(HTML 구문에 닫는 태그가 없는 요소 = 스스로 닫는 요소)이기도 하다. 하지만, 이들은 완전히 별개의 개념이다.

[콘텐츠의 종류]

  HTML의 각 요소는 유사한 특징을 가진 요소들의 집합인 카테고리 안에 속하지 않거나 하나 이상의 카테고리에 속한다. 콘텐츠 모델의 카테고리 종류는 다음과 같다.

• Metadata content
• Flow content
• Sectioning content
• Heading content
• Phrasing content
• Embedded content
• Interactive content

NOTE: 일부 요소들의 콘텐츠 모델은 콘텐츠 포함 관계에 따라 달라질 수 있다.

 

각 카테고리를 다음과 같이 도식화하여 나타낼 수 있다.

Content model Venn-diagram

위 콘텐츠 모델 벤-다이어그램을 통해 다음의 사항을 확인할 수 있다.

• Section, Heading, Phrasing, Embedded, Interactive 콘텐츠는 Flow 콘텐츠 모델 유형에 속한다.
• Metadata 콘텐츠 중 일부는 Flow 콘텐츠에 속하기도, 그렇지 않기도 하다.
• Metadata와 Interactive 콘텐츠 중 일부는 Phrasing 콘텐츠 모델 유형에 속한다.
• Embedded는 Phrasing 콘텐츠의 한 부분이자, 일부 Interactive 콘텐츠 모델 유형에 속한다.

  각 콘텐츠 모델의 카테고리 종류에 대한 자세한 설명은 이미 친절하게 되어 있는 자료가 많이 있다. 따라서, 아래에 해당 링크를 참고자료로 적어 놓았다.

  해당 자료를 살펴보며 주의할 점은 모든 요소를 외우기보다는 실제로 웹 문서를 작성함에 있어 사용하는 태그가 어떠한 콘텐츠 모델 유형에 속하는지 고려하는 수준이기만 하면 된다.

[참고자료]

(1) "콘텐츠 모델의 종류"

https://html.spec.whatwg.org/multipage/dom.html#kinds-of-content

HTML Standard

(2) "HTML 콘텐츠모델"

https://post.naver.com/viewer/postView.naver?volumeNo=12949118&memberNo=1378210&navigationType=push 

2. HTML 콘텐츠모델