[HTML] article/section/div tag 사용하기

 

article

콘텐츠의 독립적인 부분! 쉽게 이야기하면 article 태그의 부분을 떼어다가 다른 문서에 사용해도 그 역할과 의미를 가질 수 있는 블록을 의미한다. 언제든 다른 콘텐츠에 가져다가 쓸 수 있다. 

 

section

서로 연관된 콘텐츠 덩어리라고 생각하면 된다. 논리적으로 연관된 콘텐츠들을 분리할 때 사용한다. article 안에 section 태그가 사용된다. 자식 태그로 h1~6를 사용한다. 

 

div

이전까지는 section과 article 태그 사용 없이 전부  div 태그를 사용했다. div 태그는 해당 블록이 독립적으로 의미가 없고 단순히 구분 짓기 위해 사용된다. 하지만  html5 에선 header, aside, nav, footer, main 등의 각자 자리에 맞는 시멘틱 태그들이 사용되면서 div 태그의 사용은 지양한다. 

 

사용된 태그가 완성된 화면의 외형에는 영향을 주지 않으나 그 안을 들여다 보았을 때에는 용도에 맞게 잘 구분되어있어야 한다!