#Semantic Web이란?
- Semantic: 의미론적인
시맨틱 웹(Semantic Web)은 1998년 웹의 창시자인 팀 버너스 리에 의해 처음 제안되어 현재까지 개발되고 있다. 직역하면 '의미론적인 웹'이라는 뜻이다. 단어 자체만 봐서는 정확한 의미를 가늠하기가 어렵다. 시맨틱 웹을 보다 분명하게 이해하기 위해서는 먼저 기존의 웹에 대해 짚고 넘어가는 것이 필요하다.
1. 기존의 웹(Web)
-
기존의 웹은 어떤 언어로 이루어져 있는가?
기존의 웹은 사람이 직접 원하는 정보를 검색하여 눈으로 보고 이해할 수 있는 자연어, 즉 시각정보에 대한 언어 위주로 이루어져 있다. 정보와 정보 사이에 관련성이나 의미가 존재하지 않는다는 뜻이다.
예를 들어, <운동>과 <수영>이라는 두 개의 정보가 함께 있어도 그들이 가지고 있는 관계성에 대하여 자연스레 이해하는 사람과 달리 컴퓨터는 아무런 인지를 하지 못한다.
여기서 기존 웹의 문제점이 발생한다. 검색 엔진을 통해 무엇인가 찾고자 할때, 기존 웹은 내가 입력한 키워드가 들어간 웹페이지를 수십, 수백개를 보여준다. 물론 과거에 비하여 정확도에 따라 순차적으로 제시하는 등 개선된 부분이 있지만 여전히 불필요한 정보를 제대로 걸러내지 못한다. 이 문제를 해결하기 위해 제시된 것이 '시맨틱 웹'이다.
- 자연어 위주의 구성으로 인한 컴퓨터의 몰이해
- 관계성과 의미의 부재
- 불필요한 정보의 범람
2. 시맨틱 웹(Semantic Web)
기존의 웹이 사람이 읽고 이해하기에 편리하게 구성되어 있었다면, 이 글에서 다루고자 하는 시맨틱 웹(Semantic Web)은 컴퓨터가 이해할 수 있는 형태의 언어로 이루어지며 정보에 의미와 관계성을 부여함으로서 컴퓨터가 사람을 대신해 정보를 읽고, 이해하고, 그들 사이의 의미를 파악하여 자체적으로 처리할 수 있는 웹, 기계들끼리 의사소통이 가능한 지능형 웹을 의미한다.
위에서 예를 들었던 <운동>과 <수영>을 두고 비교해보자면, 시맨틱 웹에서는 둘 사이를 연결하는 의미 혹은 관계성을 이해할 수 있는 언어로 바꾸어주는 방법을 통해 수영이 운동의 한 종류라는 관계성에 대하여 이해한다.
즉 시맨틱 웹에서는 웹페이지가 단지 무의미한 데이터의 집합이 아니라 데이터 각각이 유의미하고 유기적인 관계를 맺고 있는 데이터베이스로 존재한다. 이렇게 되면 컴퓨터가 의미에 따라 정보를 추론하여 사용자에게 제공하는 것이 가능해진다.
- 컴퓨터가 이해 가능한 언어 형태
- 관계성과 의미의 존재
- 적합성이 높은 정보 제공
3. 시맨틱 태그(Semantic Tag)
- HTML: 구조와 내용
- CSS: 표현
- JS: 동작
시맨틱 태그는 시맨틱 웹에서 컨텐츠가 어떻게 '표현' 되는지 보다 '내용에 맞는' 적절한 태그로 HTML을 구현하기 위한 요소이다.내용과 표현을 분리하여 각각의 태그가 의미를 가지고 그 의미를 명확하게 전달하는 태그라고 볼 수 있다.
기존 웹에서 주로 사용되던 non-semantic tag(div, span등)는 그 안에 담긴 content에 대해 아무것도 나타내지 않는다. 내용과 태그는 어떤 관련도 없다는 뜻이기도 하다.
그런 반면 semantic tag(header, nav, aricle 등)는 실질적인 의미를 가지고 있어 content에 대한 설명을 내포하고 있다. 내용과 밀접한 관련성을 가지고 있어 브라우저, 검색엔지, 개발자 모두에게 명확한 의미를 전달하는 것이 가능하다.
위의 그림의 좌측은 non-semantic tag, div 태그로 구성되어 있어 각 태그에 class를 부여하고 있다. section별로 의미를 가지고 있는 게 아니라 형태를 유지하기 위한 수단으로 태그를 사용하고 있는 것이다.
반면 우측은 semantic tag로 이루어져있는데 각 태그마다 가지고 있는 이름이 다르고 그들이 의미하는 바가 분명해 검색엔진, 컴퓨터가 이해할 수 있다.
시맨틱 태그와 기존 태그의 가장 큰 차이점은 '의미의 명확한 전달'이다.
시맨틱 태그가 가지는 장점
- 높은 접근성
- SEO(Search Engine Optimization)
- 수정의 용이성
- 코드 가독성의 증가
- 쉬운 유지보수
4. Semantic Tag의 사용
그렇다면 언제 semantic tag를 사용하고 언제 non-semantic tag를 사용할까?
img태그와 div태그에 backgroung-image 속성을 추가하여 사용하는 것을 비교하여 알아보자.
- img태그 사용
- img태그는 시맨틱 태그이기 때문에 높은 접근성과 SEO를 갖고 있다.
- img태그에는 alt속성이 존재한다. 이 alt에 입력되는 문자는 메타 정보가 되어 검색엔진이 인식할 수 있다.
- 그렇기 때문에 태그 자체로 정보를 가지게 된다.
- 효과적인 노출을 통해 사용자에게 정보를 전달하고 싶다면 img태그를 사용하는 것이 좋다.
- div태그에 background-image 속성 사용
- div태그는 논 시맨틱 태그로 아무 의미가 없다.
- 그렇기 때문에 유의미한 정보가 존재하지 않는다.
- 검색엔진에 노출되지 않는다.
- 의미나 내용, 정보가 아닌 단순한 장식을 위해서라면 div태그에 background-image를 사용하는 것이 좋다.
따라서 semantic tag와 non-semantic tag를 구분하여 사용하는 것은 유의미한 정보를 담을 것인지, 검색엔진에 노출이 필요한지의 여부에 따라 판단해야 한다.
