html 시멘틱 태그 semantic tag 종류

 

 

시멘틱 태그에 대해서 정리를 하겠습니다. 간단하게 적습니다.

 

 

<header> : 머리말에 해당합니다. 주로 웹페이지의 상단에 있습니다.

로고나 메뉴 등을 넣는 공간입니다.

 

<nav> : 링크 등의 메뉴 영역입니다. 링크와 메뉴를 그룹화를 할 때 사용합니다.

모든 링크와 메뉴를 일일이 nav 태그에 넣을 필요는 없습니다.

 

<figure> : 동영상, 사진, 멀티미디어를 넣는 영역입니다. 메인 페이지의 이미지 슬라이드 부분

 

<main> : 웹 문서의 본문, 중요한 콘텐츠를 그룹화할 때 사용

 

<aside> : 본문과 연관성이 적은 외부 영역, 광고의 팝업창 바로가기를 만들 때 사용

 

<section> : 특정 영역의 그룹화, 연관성이 있는 콘텐츠를 그룹화 할 때 사용합니다.

신문에서 기사 제목 여러개를 section 태그 안에 담아서 사용합니다.

 

<article> : 개별 콘텐츠를 담는 영역입니다. 개별 글이나 기사를 지정합니다.

글과 기사와 게시물의 미리 보기, 섬네일, 제목, 본문 등을 지정합니다.

 

<footer> : 꼬리말 영역, 기업 소개 페이지라면 주소 / 연락처 / 약관 / 메뉴등을 넣습니다.