samantic tag (시멘틱 태그)

html5 시멘틱태그

시멘틱 태그 ( samactic tag )는

태그 자체의 이름으로도 특정기능을 설명할 수 있는 태그로 코드를 입려하는 작성자가 직관적으로 태그의 기능을 알 수 있는 장점도 있지만 브라우저 엔진 및 검색엔진이 해당 태그를 인지하여 브라우저의 기능을 향상 시키는 역할도 한다.

 

대표적인 시멘틱 태그 종류

header - ​헤더를 의미

nav - ​내비게이션을 의미

aside - ​사이드에 위치하는 공간을 의미

section - ​여러 중심 내용을 감싸는 공간을 의미

article - ​글자가 많이 들어가는 부분을 의미

footer - ​푸터를 의미

아래 링크에서 더 많은 시멘틱 태그를 확인 하실 수 있습니다. https://www.w3schools.com/tags/default.asp 

HTML Reference

 

시멘틱 태그의 발생 :

HTML5 이전까지는 시맨틱 태그라는 것이 없었다. 그 때의 대부분의 태그는 ​div​ 태그로 감싸져 있었고, 개발자의 입장에서는 코드로 사이트 전체 구조를 한눈에 파악하기 힘들었으며, 검색 엔진은 사이트의 의미를 정확히 파악하지 못해 검색 결과값의 정확도가 떨어졌다. 그렇게 나온 대안이 ​시맨틱 웹 (Semantic Web)​이고, 그에 따라서 HTML5에서 ​시맨틱 태그 (Semantic tag)​라는 것이 나온 것이다.