시맨틱이란?

시맨틱 태그에 앞서 시맨틱이란게 무엇인지부터 알아보았다.

코드 조각의 의미를 나타낸다. 예) 이 HTML 엘리먼트가 가진 목적이나 역할이 무엇일까?

시멘틱 태그란?

위에서 설명한 시맨틱의 특성을 가지고 만들어진 태그를 말한다.
article, footer, header, section, .. 등이 있다.

 <div id=”footer” /> 

보다 footer이 가독성이 좋고 검색엔진에도 좋다.

장점

의미론적인 마크업을 사용하면 아래와 같은 이점이 있다.(시맨틱 태그)

• 검색 엔진은 의미론적 마크업 을 페이지의 검색 랭킹에 영향을 줄 수 있는 중요한 키워드로 간주합니다 (SEO)
• 시각 장애가 있는 사용자가 화면 판독기로 페이지를 탐색할 때 의미론적 마크업을 푯말로 사용할 수 있습니다.
• 의미없고 클래스 이름이 붙여져있거나 그렇지 않은 끊임없는 div 들을 탐색하는 것보다, 의미있는 코드 블록을 찾는 것이 훨씬 쉽습니다.
• 개발자에게 태그 안에 채워질 데이터 유형을 제안합니다.
• 의미있는 이름짓기(Semantic naming)는 적절한 사용자 정의 요소 / 구성 요소의 이름짓기(namimg)를 반영합니다.