[HTML] 시멘틱 태그(Semantic Tag)

검색엔진최적화(SEO) : 검색 엔진은 태그를 기반으로 페이지 내 검색 키워드의 우선순위를 판단한다. 따라서 의미없는 div 또는 span 과 같은 태그는 지양하고, 의미에 맞는 태그들을 사용하는 것이 좋다.
시각장애가 있는 사용자가 스크린 리더를 사용하여 웹 페이지를 탐색하는 데 도움이 되는 표지판으로 사용할 수 있다.
코드의 트리 구조를 쉽게 파악할 수 있으며, 가독성이 좋다.

태그명	설명
<header>	페이지의 제목과 같은 소개 내용 포함 ex) <heading> 태그, 로고, 아이콘, 저작권 정보, 검색 양식, 작성자 이름 등
<nav>	현재 문서 또는 다른 문서로의 링크를 제공하는 영역 ex) 메뉴, 목차 및 색인 등
<aside>	간접적으로 문서와 관련된 내용을 나타냄 ex) 사이드바, 콜아웃 상자
<section>	구체적인 시맨틱 태그가 없는 문서의 독립적인 영역을 나타내며 섹션에는 매우 소수의 예외를 제외하고 항상 제목이 있어야 한다.
<article>	독립적으로 배포하거나 재사용할 수 있는 자체 포함된 구성 ex) 게시물, 잡지 또는 신문 기사, 블로그 항목, 사용자가 제출한 댓글 등
<footer>	섹션의 작성자에 대한 정보, 저작권 데이터, 관련 문서에 대한 데이터
<em> <strong>	강조되는 텍스트에 사용 em -> 기울기체, strong -> 볼드체

참고

티스토리툴바