시맨틱 태그?

개발자와 브라우저에게 엘리먼트의 의미를 설명하는 의미적 요소

• <div>, <span> -> 의미를 알 수 없음
• <form>, <table>, <article> -> 의미 파악 가능

시맨틱 태그의 종류

• <header>: 웹 페이지 머릿말(헤더)을 나타냅니다.
  • 로고, 사이트 제목, 메뉴 등
• <nav>: 네비게이션 메뉴를 정의합니다.
  • 웹 사이트의 주요 메뉴
• <main>: 웹 페이지의 주요 콘텐츠
  • 한 페이지에 하나의 <main> 요소만 사용해야 한다.
• <article>: 독립적인 콘텐츠 블록
  • 뉴스 기사, 블로그 게시물, 포럼 게시물 등
• <section>: 문서의 섹션을 나타내며 일반적으로 제목(<h1>, <h2>, 등)과 함께 사용된다.
• <aside>: 별도의 콘텐츠(부가 정보, 사이드바 등)
• <footer>: 웹 페이지의 바닥글(푸터)
  • 저작권 정보, 연락처 정보, 관련 링크 등
• <figure>와 <figcaption>: 이미지, 도표, 동영상 등과 그에 대한 캡션
• <time>: 날짜와 시간 정보
• <mark>: 텍스트에서 강조된 부분