HTML 5 는 HTML 보다 훨씬 더 Sementic 한 Web을 구성

HTML 5 이전의 HTML 문서는 <div>, <p>, <h1>, <h2>... Tag 와 같은 Block Level Element 와 <img>, <input>, <i>, <b> Tag 와 같은

Inline Element 로 구분되어지는 Tag 들로 구성되어 두 종류의 Tag 들을 적절히 사용하여 표현하였다.
그리고 이러한 Tag 들은 Tree 형태의 계층구조를 이루어 문서의 OutLine 을 구성하고 그 구조를 따라

Contents 에 접근할 수 있다.(JavaScript 나 CSS 에서 특정 Element 에 접근하는 방식을 떠올린다면 이해가 쉬우리라...)

HTML 5 문서 또한 다르지 않다.
하지만 HTML 5 는 "Contents Model" 이라는 새로운 개념을 추가하여 문서의 Outline 을 잡고

Contents 를 구성하게 된다.
HTML 5 는 기존의 Tag 에 한마디로 HTML 5 는 구성에 중점을 둔 구조라고 할 수 있겠다.
따라서 기존 DOM Tree 계층구조에서의 Contents 접근이 아닌 구성에 따라서 접근이 가능하게 되었다.

(<Header>, <Footer>, <article> Tag 를 떠올려 보라.

DOM Tree 를 따라갈 필요없이 곧바로 Contents 에 접근이 가능하다.

-<Header>, <Footer>, <article> 과 같은 Tag 를 아직 모르시는 분께 죄송... 하지만

곧바로 다음에서 다루겠다. 일단은 그런게 있구나 식으로만이라도...>)
이런 이유로 HTML 5 의 Element들은 추가되었고, 기존의 HTML 보다 훨씬 더 Sementic 한 Web을 구성 할 수 있게 되었다는데에 집중해야 할 것이다.

HTML 5 의 각 Tag(Element)가 갖는 역할과 의미를 확실히 이해하여

Content Model 에 적합한 HTML 문서를 작성할 수 있도록 한층 더 많은 생각을 해야할 것이다.

 

 

직장을 다니면서 투잡(알바/부업)으로 월급 많큼 수익을 얻고 싶으시다면  

아래 접속하셔서 상담받아 보실 수 있습니다. (믿음의 재택부업회사)