Semantic HTML
Semantic HTML
시맨틱 HTML은 페이지에 의미를 부여하는 것을 말함
현대표준, 웹사이트의 SEO(검색 엔진 최적화)가 향상되고 사람들이 웹사이트에 액세스할 수 있게함. (검색했을 때 상위에 랭크됨)
Sectioning Elements = 단원
단원의 주제는 곧 제목이다.
따라서 아래의 sectioning elements들은 heading태그를 반드시 써야한다.
section
article
nav
aside
기본구조 : header/main/footer (논리적으로 완결된 집합체에 의미를 더 정확히 해줌) - not sectioning elements
header : 문서의 도입부 또는 한 section의 도입부에 사용 / 뉘앙스를 나타낼 때 언제든지 사용가능
main : 본문에 있어 핵심이 되는 부분을 묶는다.
ㄴmain은 sectioning elements가 아니기 때문에 heading 태그를 적을 필요가 없다.
ㄴmain은 html문서에 단 한 번만 들어갈 수 있다.
ㄴmain은 다른 sectioning 안에 쓸 수 없다.
footer : 문서의 하단부 또는 section의 하단부에 div보다 의미적으로 더 정확한 뉘앙스를 나타낸다.
section : 논리적으로 완결된 집합체를 덩어리로 나눌 때는 section이 div보다 의미적으로 더 정확한 뉘앙스를 나타낸다.
nav : 문서 페이지 간의 이동을 포함하는 메뉴
article : 기사, 블로그, 댓글 등 자체적으로 이해되는 콘텐츠(정보)로서 완결성이 있는 경우
aside : 주요한 내용과 관련이 있지만 필수적이지는 않은 정보
figure : 모든 유형의 미디어를 캡슐화
figcaption : 미디어를 설명하는 글(figure에 종속)
audio/video/embed : 미디어 파일 넣기
embed : 외부 데이터와 연결
ㄴcontrols
ㄴsrc