시맨틱 태그란 ?
시맨틱(semantic)이라는 '의미의', '의미론적인'라는 뜻을 가진 태그이다.
영역을 디자인적으로 묶는 div
문장이나 단어를 디자인적으로 꾸미는 span
등 디자인 태그를 남발하지 않고 의미 있는 태그를 사용하기 위해 등장 한 태그이다.
시맨틱 태그를 사용해야 하는 이유
다른 작업자가 코드를 보더라도 어떤 영역인지 한 눈에 파악하기 쉬움으로 가독성과 유지보수에 용이해진다.
HTML 파일 만으로도 각 영역을 쉽게 나누고 파악 할 수 있기 때문에
시각장애인들이 이용하는 스크린 리더기를 잘 활용 할 수 있어서 접근성이 높아진다.
검색엔진을 통해 검색을 수행 할 때 HTML 태그를 분석함에 있어서 정확도가 높아진다.
예를 들어, 검색 로봇이 article 태그를 통해 독립적인 영역으로 인식 하고
section 태그를 통해 본문과 관련성이 있는 영역으로 인식한다.
시맨틱 태그를 통한 마크업은 seo(검색엔진 최적화) 점수가 높게 평가되어 상위에 노출 되는 효과를 기대 할 수 있다.
시맨틱 태그의 종류
화이팅