[WEB] semantic web & semantic tag
Semantic Web이란?
의미론적 웹, 컴퓨터가 정보와 자원의 뜻을 이해하고 논리적 추론까지 할 수 있는 지능형 웹이다
라고 말해봤자 나도 모르고 시맨틱 웹이 뭔지 몰라서 여기까지 온 당신도 모른다
그래서 여러 영상과 블로그들을 돌아다녀본 결과 정확한 개념은 아니더라도
예시 정도는 들어볼 수 있겠다
고양이가 가지고 있는 특성에 대해 보자
귀여움, 영역동물, 사족보행, 높은 곳을 좋아함, 애교가 많음, 고양이과, 반려동물 등등 많을 것이다
A = 귀엽고 영역동물이고 높은 곳을 좋아하는 동물
B = 고양이
A가 B를 설명한다는 것은 인간에겐 쉽다 인간은 추론할 수 있기 때문에
하지만 컴퓨터의 경우는 그저 귀엽고 영역동물이고 높은 곳을 좋아한다는 특성(메타데이터)만을 알리고 있다
다시 말해 A의 요소가 뭘 의미하고 있는지 명확하게 나타내지 않는다
하지만 B의 A 의 특성을 모두 내포하고 있고 작성자가 뭘 설명하려 하는지 명확하게 알 수 있다
우리 더 쉽게 이해할 수 있도록 Semantic tag를 통해 설명해보자
Non-semantic tag를 사용한 아래의 html 구성을 보자
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<body>
<div>
<h1>A</h1>
</div>
<div>
<div>
<h1>B</h1>
<p>C</p>
</div>
<div>
<h1>D</h1>
<p>E</p>
</div>
</div>
<div>
<span>F</span>
</div>
</body>
|
cs |
별도의 class 나 id가 없다면 도대체 각각의 div span p 태그들이 뭘 뜻하는지 알 수가 없다
이런 태그들을 Non-semantic tag 라고 한다
그럼 아래의 예제를 보자
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<body>
<header>
<h1>A</h1>
</header>
<section>
<article>
<h1>B</h1>
<p>C</h1>
</article>
<article>
<h1>D</h1>
<p>E</p>
</article>
</section>
<footer>
<address>F</address>
</footer>
</body>
|
cs |
HTML5의 semantic tag를 이용한 구성이다
우리는 header section article foorter 등의 태그들을 통해 각각이 웹페이지에서 어떠한 의미를 가지고 있는지 알 수 있다
이런 tag들을 semantic tag라고 한다