[html]<section>과 <article>의 차이

section태그와 article태그

section 태그는 섹션(부분, 구역, 영역) 들을 그룹화 해서 분리하는 역할을 한다.

article 태그는 문서 내에서 그룹화해서 분리하는 역할을 합니다.

section태그와 article태그의 차이

section태그는 주제별로 구분한 그룹이다.
-논리적으로 관계있는 요소 또는 문서를 분리할 때 사용한다.
-주로 다른 주제의 문서를 구분 짓기위해 사용 (주제별 영역들을 그룹화)

article태그는 내용이 독립적이고 section태그와 다르게 독립적으로 존재할 수 있으며 재사용 할 수 있다.
-즉 article이 좀 더 구체적이다.
-주로 블로그글, 포럼, 뉴스 기사 등을 article로 묶음

※ 논리적인 관계가 없는 요소들을 그룹화 할 경우에는 div태그를 사용한다.

section태그와 article태그 사용예시

section태그

<section>
   <h1>상품소개</h1>
   <ul>
      <li>상품1</li>
      <li>상품2</li>
      <li>상품3</li>
   </ul>
   <p>상품의 실제이미지와 다를 수 있습니다.</p>
</section>

article태그

<article>
   <h1>네이버 뉴스</h1>
   <ul>
      <li>기사1</li>
      <li>기사2</li>
      <li>기사3</li>
   </ul>
</article>

정리해보자면,
내용이 서로 관계가 있다면 section태그를 사용하고
내용이 독립적이고 스스로 설 수 있는 내용이면 article태그를 사용하고
의미적으로 관계가 없다면 div태그를 사용합니다.