시맨틱(Semantic) 태그

시맨틱 태그를 사용하는 이유 #

• 검색 엔진 최적화(SEO) : 시맨틱 마크업은 검색 랭킹에 중요한 영향을 준다.
• 웹 접근성 : 스크린 리더로 페이지를 탐색할 때, 시맨틱 마크업을 푯말로 사용할 수 있다.
• 개발 편의성 : 의미있는 이름을 탐색하는 것이 더 쉽다. 태그에 채워질 데이터 유형을 제안 받을 수 있다.

종류 #

• <article>
• <aside>
• <details>
• <figcaption>
• <figure>
• <footer>
• <header>
• <main> : 문서에 1개 이상 존재해서는 안된다.
• <mark>
• <nav>
• <section>
• <summary>
• <time>

Related #

• article vs section

References #

• Document and website structure - Web 개발 학습하기 | MDN (mozilla.org)
• How To Write Semantic HTML | Hacker Noon