Play Ground

시맨틱 마크업 본문

Programming/HTML

시맨틱 마크업

haeru 2013. 2. 26. 16:21

현재 웹상에서는 방대한 정보와 필요한 정보를 추출, 해석, 가공하는 방법이 없기 때문에 불필요한 정보가 검색된다.

시맨틱 마크업은 2001년 팀 버너스리 등에 의해 정립화된 것으로 컴퓨터가 처리할 수 있게 온톨로지 형태로 표현한 것으로 검색로봇이 의미를 잘 가져갈 수 있도록 홈페이지를 구조적으로 마크업 하는 방법이다.

HTML태그를 이용해 내용이 담고있는 의미가 무엇인지 파악하며 마크업해야 시맨틱한 웹을 만들 수 있다.

RSS가 대표적인 예이다.


   * 온톨로지 형태 : 사람들이 세상에 대해 보고 듣고 느낀 것을 서로 간의 토론을 통해 합의를 이룬 것


ex))


<h1>테스트 1</h1>

<p>테스트 1-1</p>

<p>테스트 1-2</p>

<p>테스트 1-3</p>

위의 마크업은 시맨틱하지 못한 마크업이다.

시각장애인을 위한 스크린리더에서 제목과 내용의 의미를 제대로 파악하지 못하게 된다.


<h1>테스트1</h1>

<ul>

<li>테스트1-1</li>

<li>테스트1-2</li>

<li>테스트1-3</li>

</ul>

위의 마크업이 시맨틱 한 마크업이다.

스크린리더에서의 의미파악 뿐만 아니라 시각적인 효과도 준다.

'Programming > HTML' 카테고리의 다른 글

Image Replacement(IR기법)  (0) 2013.03.26
href=# 대안법  (0) 2013.03.12
웹 표준과 웹 접근성  (0) 2013.02.26
시맨틱한 마크업을 위한 HTML5요소  (0) 2013.02.26
[HTML5] 새로운 요소  (0) 2013.02.24