article과 section

article

내용이 독립적이고 따로 떼어져도 흐름이 깨지지 않는 내용일 때 사용
독립적으로 구분되거나 재사용 가능한 영역을 설정. (매거진/신문 기사, 블로그 등)

• 일반적으로 <h1>~<h6>를 포함하여 식별.
• 작성일자와 시간을 <time>의 datetime 속성으로 작성.

* article > section

<article>
	<h1>민초</h1>
	<section>민초단</section>
	<section>반민초단</section>
</article>

 

section

각 section의 내용이 연관성(논리적으로 관계있는 문서) 있을 때 사용

• 일반적으로 <h1>~<h6>를 포함하여 식별.

* section > article

<section>
	<h1>경제</h1>
	<article>경제뉴스1</article>
	<article>경제뉴스2</article>
</section>

 

쉽게 풀어내면 article은 독립적인 콘텐츠이다.

예를 들어 블로그 글을 볼 수 있다. 그래서 블로그에는 여러 개의 글이 있지만 그 글들은 연관성이 있든 없든 상관이 없다. 어제는 경제라는 주제에 대해 쓸 수 있고 오늘은 개발에 대한 글을 포스팅하듯 연관성이 있어야 할 필요는 없지만 블로그 글 자체만으로 독립적이며 그 형태가 계속 재사용이 가능할 때 article을 사용한다.

section은 서로 관계있는 문서를 분리할 때 사용한다.

나는 이 예시를 포트폴리오에서 봤다
포트폴리오에서 크게 home, about, skills에 대한 내용을 각각 담고 있지만 그 전체는 하나의 포트폴리오로 모두 관계가 있는 한 페이지다
이럴 때 각 페이지마다 section으로 나눠줄 수 있다.