의미론적 웹(Semantic Web)은 의미를 중심으로 웹페이지를 구성하는 프레임워크 및 기술을 의미합니다. 여기서 의미란 컴퓨터(브라우저)가 이해할 수 있는 의미를 뜻합니다.
컴퓨터가 이해할 수 있는 의미란 무엇일까요? 먼저, 간단한 HTML 문서를 하나 살펴보도록 하겠습니다.
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>HTML Document</title>
</head>
<body>
<h1>제목</h1>
<p>내용</p>
</body>
</html>이는 HTML 태그를 적절히 사용하여 의미론적으로 구성된 문서라 할 수 있습니다. 몇 가지만 살펴보겠습니다. 상단에 선언된 <!DOCTYPE html>은 해당 문서가 작성된 HTML 버전을 알려줍니다. <head> 태그 내의 <meta charset="UTF-8">은 문자열의 인코딩 방식을 알려줍니다. <body> 내의 <h1>태그는 이후의 텍스트가 제목에 해당한다는 것을 알려줍니다. 바로, 컴퓨터에게 말입니다!
이처럼 HTML 문서는 각 콘텐츠에 맞는 태그를 사용함으로써 문서를 의미론적으로 HTML 문서를 구성할 수 있습니다. 이를 통해 컴퓨터(브라우저)는 문서 내 콘텐츠의 역할을 보다 명확하게 파악할 수 있습니다.
이제 조금 다른 경우를 살펴보도록 하겠습니다.
See the Pen Semantic Web Comparison by 11292021 (@11292021) on CodePen.
<p> 태그의 글자 크기를 키우고 굵은 글꼴을 적용하여 <h1> 태그를 사용한 것과 시각적으로 동일한 효과를 냈습니다. 우리에게 동일한 결과물처럼 보일 수 있지만, 컴퓨터는 이를 태그를 따라 제목이 아니라 문단으로 해석할 것입니다.
따라서 해당 콘텐츠가 제목임을 알려주려면 <h1> 태그를 사용하며 의미론적으로 명시해주어야 합니다. 이제 컴퓨터는 제목과 내용을 보다 분명하게 구분하고, 검색 엔진 등에서 이를 찾는 사용자에게 효율적으로 콘텐츠를 제시해줄 수 있습니다.
정리하자면 의미론적 웹은 컴퓨터가 이해할 수 있는 방식으로 의미를 구분하는 웹 및 이를 구성하는 기술이라 할 수 있습니다. 웹페이지 문서 작성에 가장 많이 사용되는 언어는 HTML이며, HTML은 태그를 사용하여 이러한 의미론적 웹페이지를 구성합니다. 따라서 웹페이지를 의미론적으로 구성하기 위해서는 각 콘텐츠에 알맞는 태그를 사용하는 것이 중요합니다.
'Web | Internet' 카테고리의 다른 글
| 웹소켓 WebSocket 사용 방법 정리 (0) | 2022.04.06 |
|---|---|
| 쿠키, 세션, 캐시의 차이점 정리 (0) | 2022.03.08 |
| HTTP 상태 코드 의미 정리 (0) | 2022.02.09 |
