HTML5 에 새롭게 추가된 섹션 요소

섹션 요소란

HTML4에서는 문서의 구조 작성시 주로 div에 id나 class를 사용하여 아웃라인을 만들어왔습니다.

그러나 HTML5에서 새롭게 추가된 여러 요소 중에서도 기존의 마크업에 커다란 영향을 줄 수 있는 요소들이 몇가지가 있는데 그중에서 아웃라인과 관련된 요소가 '섹션 요소'입니다.

섹션 요소는 구체적으로는 section이나 article이라는 요소를 가리키는 것으로, 웹 애플리케이션의 구조를 좀 더 논리적이고 명확하게 기술하기 위한 기본 요소가 됩니다.

"섹션 요소"는 문서나 어플리케이션의 일종의 구획을 나타내는 요소이며 문서의 구조를 나타내기 위해 h1, h2, h3, h4, h5, h6 요소들과 article같은 문서 내 독립적인 요소와 같이 사용될 수 있습니다.

단, CSS 스타일링이나 Javascript의 동작을 위해 묶음화가 필요할 때는 section을 활용하는 것이 아니라 문서 구조상 특별한 의미가 없는 div 요소를 사용해야 합니다.

HTML5 문서는 각기 다른 섹션들로 구성된 문서입니다..

HTML5 에 새롭게 추가된 섹션 요소

• section / 각 목록 아이템(list item)을 담고 있습니다.
• article / article에 대한 문자 정보를 담고 있습니다.(블로그나 뉴스, 포럼의 글영역)
• nav / nav에 대한 문자 정보를 담고 있습니다.(네비게이션 바 의 영역표시)
• aside / aside에 대한 문자 정보를 담고 있습니다.(메인컨텐츠의 단어 등을 정의)