반응형
nav
- 모든 내비게이션이 아닌 페이지 주요 내비게이션 링크들만 선언하는 것이 좋음
- footer안에서 nav 사용은 불필요
- 사이트 전반전인 이동을 위한 내비게이션과 페이지 전체를 이동하는 내비게이션을 각각 기술할 수 있음
section
- 문서나 어플리케이션의 내용을 주제별로 섹션을 구분하는 요소
- h1~h6의 헤딩태그를 사용할 수 있으나 h2~h6 태그 사용을 권장
article
- 문서내의 독립적인 글을 표시하여 블로그 글이나 뉴스 본문이 해당됨
- article 요소 안에 article 요소가 들어갈 경우 안쪽의 article요소는 밖에 article 요소의 내용과 관련이 있는 내용이라는 것을 의미
- 블로그의 글과 사용자가 작성한 댓글이 있을 경우 하나의 댓글을 안쪽으로 기술하고, 전체 블로그 글은 바깥은 article로 기술 할 수 있음
- <article> 내부에 <section> 태그를 포함할 수 있고, 반대로 <section> 내부에 <article>를 포함가능
- 접근성을 위해 반드시 heading 태그를 포함
aside
- 문서의 주 내용이 아닌 관련성이 낮은 내용들을 표시
- 본문과 직접적인 연관이 없는 관련 사이트 링크나 광고, nav 요소의 그룹 등
hgroup
- 섹션의 제목을 나타냄
- 섹션의 제목이 여러 단계를 가지고 있을 때 이를 hgroup 요소로 기술할 수 있음
- 문서의 구조를 나타날 때는 hgroup 안에 있는 가장 높은 레벨의 헤딩을 사용하고, 나머지 요소들은 문서의 구소에서는 나타나지 않음
header
- 소개나 내비게이션 기능들의 묶음을 나타냄
- heading 태그가 반드시 포함될 필요는 없음
- 목차, 검색창, 로고 등을 포함할 수 있음
- 섹션으로 간주되지 않으며, 문서 구조상 새로운 섹션이 생성되지 않음
footer
- 저자나 저작권 정보 등을 포함
- 저자나 편집자의 연락처 정보는 address 요소로 표현
- 섹션으로 간주되지 않으며, 문서 구조상 새로운 섹션이 생성되지 않음
main
- 문서 또는 애플리케이션 body 요소의 메인 콘텐츠에 해당됨
- 문서의 유일한 내용이어야 함
- 사이드바, 검색 링크, 저작권 정보, 로고, 검색 등 반복되는 컨텐츠에는 포함할 수 없음
- 검색폼이 페이지의 주요 기능인 경우에는 사용 가능
- main 요소는 섹션 요소가 아니며, 2개 이상의 요소가 보이면 안되므로 나머지는 hidden 처리
- main은 섹션 요소들을 포함할 수 있으나, article, section, aside, nav 요소는 main 요소를 자식으로 포함할 수 없음
- main 내부에는 header, footer 요소를 직접적으로 포함하지 않는다.
figure
- 그래픽이나 비디오를 위한 캡션 표시
- 사진, 일러스트, 다이어그램, 코드 등이 해당 됨
- 캡션표시 : figcaption 태그 사용
video, audio
- 비디오와 오디오 컨텐츠 요소를 태그
- 스크립트로 제어가 가능하도록 스크립트 API가 제공
embed
- 플러그인 컨텐츠를 넣을 때 사용
mark
- 중요한 텍스트를 나타내는 태그
progress
- 작업의 진행상태를 나타내는 태그
meter
- 분량이나 수량을 나타내는 태그
time
- 시간을 나타내는 태그
ruby, rt, rp
- 언어에 음을 다는 것과 같은 표기에 사용
canvas
- 그래픽이나 게임과 같은 이미지 구현에 사용하는 태그
command
- 사용자가 행할 수 있는 명령 기능을 나타내는 태그
details
- 추가적인 정보나 기능을 나타내는 태그
- 요약,제목, 캡션에 대한 정보 : summary 태그 사용
datalist
- 미리 정의된 옵션의 묶음 나타내는 태그
- input의 list, datalist의 id로 서로 연결
keygen
- 서버에 공개키를 보내고 로컬의 키 저장소에 개인키를 저장하는 데 사용하는 태그
output
- 서식이나 스크립트를 통해 생성된 결과물을 나타내는 태그
반응형