꾸준2

시맨틱 태그란??

의미를 가지는 태그(태그의 이름을 보고 어떠한 내용이 사용될지 유추할 수 있음)

시맨틱 태그 종류

<header> : 화면 상단에 위치하여 제목, 로고 등을 만들 때 쓰임

<nav> : header 밑에 위치하여 메뉴를 만들 때 쓰임

<section> : 해당 주제 내용을 포함하는 공간으로 쓰임(ex - html 카테고리)

<article> : 해당 주제의 세부적인 내용을 설명할 때 쓰임(ex - html 카테고리 제목, 내용)

<aside> : 사이드 메뉴, 광고 등으로 쓰임

<footer> : 화면 하단에 위치하여 회사소개, 저작권 등으로 쓰임

시맨틱 태그 사용하는 이유

- 코드의 내용이 길어져서 특정 영역(header, article, aside 등등)을 찾을때 수월하다

- 모든 영역을 div태그로 사용하는 것보다 시맨틱 태그를 사용했을때 가독성이 좋다

	// 시맨틱 태그 x
    <div>header</div>
    <div>nav</div>
    <div>section</div>
    <div>article</div>
    <div>aside</div>
    <div>footer</div>

	// 시맨틱 태그 O
    <header>header</header>
    <nav>nav</nav>
    <section>section</section>
    <article>article</article>
    <aside>aside</aside>
    <footer>footer</footer>