코딩 공부/web & Java
[HTML] section과 article
현장
2022. 9. 17. 13:40
section
HTML 문서의 독립적인 구획을 나타내며, 더 적합한 의미를 가진 요소가 없을 때 사용 (하나의 문서가 여러개의 <article>을 가질 수 있음)
<section></section>
사용방법
- 각각의 section을 식별할 수단이 필요하다. 주로 제목(<h1> ~ <h6>) 요소를 section의 자식으로 포함하는 방법을 사용
- 요소의 컨텐츠를 따로 구분해야 할 필요가 있으면 article 요소를 고려
- section 요소를 일반 컨테이너로 사용하면 안 된다. 특히 단순히 스타일링이 목적이라면 div 요소를 사용하는 것이 좋다. 대게 문서 요약에 해당 구획이 논리적으로 나타나야 하면 section 이 좋은 선택이다.
article
문서, 페이지, 애플리케이션, 또는 사이트 안에서 독립적으로 구분해 배포하거나 재사용할 수 있는 구획을 나타냄
<article></article>
사용방법
- 각각의 article을 식별할 수단이 필요하다. 주로 제목(<h1> ~ <h6>)요소를 article의 자식으로 포함하는 방법을 사용
- article 요소가 중첩되어 있을 때, 안쪽에 있는 요소는 바깥쪽에 있는 요소와 관련된 글을 나타냄
- article 요소의 작성 일자와 시간은 time 요소의 datatime 속성을 이용하여 설명할 수 있다.