section요소는 내용적 흐름과 구조를 만들기 위해 내용을 나누는 용도입니다. 관련있는 내용을 section요소로 묶어 표시합니다.
보통 section요소는 제목을 포함하지만, 항상 그런 것은 아닙니다.
<section>
<h2>제목입니다.</h2>
<p>
내용부분입니다.
</p>
</section>
<!-- 제목을 section 밖에서 사용할 때 -->
<h2>제목입니다.</h2>
<section>
<p>
내용부분입니다.
</p>
</section>
article 요소
article요소는 독립적으로 구성된 글을 표시합니다. 본문과 별개로 구성되어 다른 영역에 영향을 주거나 받지 않고 독립적으로 배포되거나 재사용 할 수 있습니다.
게시판의 게시물, 블로그 포스트, 댓글, 위젯에 담긴 콘텐츠등이 article에 해당합니다.
<article>
<h2>기사 제목입니다.</h2>
<p>
기사 내용입니다.
</P>
</article>
:: section요소와 article요소를 보면 별다른 차이점이 없어보입니다. 실제로도 두 요소 간의 쓰임에 있어 큰 차이를 보이지는 않습니다. 대체로 section요소는 HTML문서의 전체적인 내용에 포함되며, article요소는 문서의 전체적인 내용과 별도의 독립적인 내용이 들어갈 때 사용한다고 생각하면 편합니다.
figure 요소와 figcaption 요소
책이나 신문에 포함되는 이미지 바로 아래에는 해당 이미지를 설명하는 캡션이 위치하게 됩니다.
HTML5에서는 위와 같은 목적을 위해서 figure요소와 figcaption요소를 제공하고 있습니다.
figure요소는 HTML문서에서 그래픽과 비디오 등의 독립적인 콘텐츠를 정의할 때 사용합니다.
figcaption요소는 위와 같은 figure요소를 위한 캡션을 정의할 때 사용합니다.
<figure>
<img src="이미지.png" alt="이미지 제목" />
<figcaption>이미지 설명을 위한 부분입니다.</figcaption>
</figure>
footer 요소
footer요소는 HTML문서나 섹션 부분에 대한 푸터를 정의합니다.
HTML문서의 푸터에는 일반적으로 사이트의 작성자, 저작권 정보, 연락처, 회사명 등을 명시합니다.
