Semantic Tag는 왜 사용하는 것일까?

Semantic Tag란?

-> 의미가 있는 태그라는 뜻으로 사용된다.

Semantic Tag를 사용하는 이유

1. 유지 보수성

우리가 예전에 HTML을 작성했던 방법은 그냥 div 태그를 이용해서 class를 붙여서 사용했는데, 그렇게 하면은 다른 개발자들이 코드를 이해하기가 어려워져서 유지보수하기가 어려워진다.
그런데 Semantic Tag를 이용하면 태그에 자체적으로 의미가 부여되기 때문에 다른 개발자들이 코드를 이해하기가 더 쉬워지게 되서 유지보수하기가 편해진다.

2. 웹 접근성

시각장애가 있는 사용자가 스크린 리더를 사용하여 페이지를 탐색할 때 도움이 된다.

3. 검색엔진 최적화 (SEO)

검색엔진은 태그를 기반으로 페이지 내 검색 키워드의 우선순위를 판단한다. 따라서 시맨틱 태그를 활용하면 사용자가 특정 키워드를 검색했을 때 나의 웹 사이트가 검색창에 노출될 확률이 높아진다.

시맨틱 태그를 잘 활용하기 위해서

이 컨텐츠가 이 페이지에서 어떤 역할인지 고민해 보는것이다.

시맨틱 태그의 종류

header: 헤더를 의미한다
nav: 내비게이션을 의미한다
aside: 사이드에 위치하는 공간을 의미한다
section:본문의 여러 내용(article)을 포함하는 공간을 의미한다
article:분문의 주내용이 들어가는 공간을 의미한다
footer: 푸터를 의미한다

자세한 내용