의미론적인 웹(Semantic Markup)

시멘틱 마크업이란 말 그대로 HTML요소들이 가지고있는 의미대로 표현하는것을 말한다,

예를들어 데이터를 정리하고 나타낼 때 쓰는 테이블을 레이아웃 요소로 사용해서 시각적인 요소를 표현한다면 의미론적인 마크업에서 벗어나게 된다. 

 

시멘틱 마크업은 매우 중요하다!

언어라는 것이 상호간의 소통을 위해 존재하는 것이며 문서는 정보를 내포한다는 기본적인 의미를 보았을 때에도 의미를 잘 표현하는 코딩이 중요하다는 것이다.

 

의미론적인 웹 코딩을 하면 좋은점!

1. 시각장애인이나 웹 이용에 불편을 겪는 사용자들에게 정확한 정보를 제공하고 편의성을 높일 수 있다.

2. 검색엔진최적화 라는 기능을 사용해 훨씬 더 빠르게 정확한 정보를 사용자가 찾을 수 있게 한다.

3. 개발시 중첩되는 의미가 생기지 않으므로 효율적으로 관리할 수 있다.

 

HTML5에 추가된 의미론적 마크업을 위한 태그들

 

Tag Description

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