HTML Semantic Tag란?

Semantic이라는 단어가 의미의, 의미론적인이라는 뜻이 담겨 있다.
여기서 생각했을 때 Semantic Tag는 의미가 담긴 태그라는 것을 유추해볼 수 있다.

1. 시맨틱 태그(Semantic Tag)

시맨틱 태그(Semantic Tag)는 포함된 요소의 특정 의미를 정의하고 목적을 갖는 태그이다 기능 자체는 div태그와 똑같지만 div라는 이름 대신에 역할을 담당하는 이름이 붙어 웹사이트의 구조를 파악하기 쉽도록 도와준다.

2. 시맨틱 태그(Semantic Tag)의 장점

1) SEO 향상

SEO(Search Engine Optimization)는 웹사이트가 검색 결과에 더 잘 보이도록 최적화하는 과정이며, 검색 랭크 개선이라고도 한다.
시맨틱 태그(Semantic Tag)를 사용한다면 관련 키워드와 문구에 대해 웹페이지를 최적화하는 데 도움이 되고, 이를 통해서 검색결과 상에서 웹사이트 노출 순위를 높일 수 있다.

2) 코드 가독성 향상
div태그로 코드의 요소들이 감싸져 있으면 어느부분이 어떤 내용을 담당하는지 파악하는데 오래 걸리는데, 시맨틱 태그(Semantic Tag)를 이용하게 되면 코드의 어떤 부분이 main이고 header인지 쉽게 파악할 수 있다.

3) 스크린 리더
시각 장애인이 스크린 리더로 페이지를 탐색하게 될 때, 스크린 리더가 특정 시맨틱 태그를 만나게 되면 효과를 발생시켜 페이지를 읽는것에 대한 도움을 시맨틱 태그가 줄 수 있다.