시맨틱 태그

✏️ 시맨틱 태그

시맨틱 태그의 역할은 개발자와 브라우저에게 의미를 제공
태그명은 이 요소가 가진 목적이나 역할은 무엇인가를 나타냄
대부분의 시맨틱 태그는 컨테이너 태그와 같이 특별한 스타일을 제공하지 않음

🔎시맨틱 태그의 이점

1. 검색 엔진은 시맨틱 태그(태그명)를 중요한 단서로 본다.
2. 시각 장애가 있는 사용자가 화면 판독기로 페이지 탐색 시 참조된다.
3. 코드의 가독성을 향상시킨다.
4. 컨테이너 남용을 방지하여 코드 작성이 용이하다.

대표적인 시맨틱 태그들

• <article> : 독립적인 콘텐츠
• <aside> : 별도의 콘텐츠
• <details> : 추가적인 상세한 정보
• <figcaption> : figure의 자막
• <figure> : 설명이 붙는 독립 콘텐츠
• <footer> : 맺음말
• <header> : 머릿말
• <main> :주된 콘텐츠
• <nav> : 네비게이션 링크
• <section> : 콘텐츠의 한 섹션(절)
• <summary> : detail의 헤더
• <time> : 강조할 시간