May's Tryouts

Semantic Web/Tag란 무엇이며,
왜 웹 개발 과정에서 중요하게 여겨질까?

1. Semantic Web/Tag란?

Front-end web 개발 현장에서 쓰이는 용어로,

번역하면 의미론적 웹/태그라고 풀이된다.

의미론은

어떤 언어 표현의 의미를 연구하는 것이니,

웹과 태그가

전체 맥락 안에서 가지는 '의미'에 주목해보면,

Semantic Web/Tag는
어떤 의도와 뜻을 가진 웹/태그라고 이해된다.

2. Semantic Web/Tag가 중요한 이유

어떤 의도와 뜻을 가진 태그로 이루어진
어떤 의도와 뜻을 가진 웹은 가치있는 정보이기 때문이다.

가치... 좋지...

근데 왜 별안간 웹 개발에서 가치 타령일까??

       " 웹 = 정보 "       

웹은 근본적으로 '인터넷을 통해 주고받는 정보의 집합'이다.

정보로써 기능이 발휘되어야

비로소 웹이라고 부를 수 있는 것이다.

사람이나 컴퓨터가

내가 만든 웹을 딱 맞닥뜨렸는데

무슨 의도를 가진 웹인지,

각 영역은 어떤 뜻을 지니는지,

도대체 확인하기 힘들다?

삐빕-

그거슨 이해하기 어려운 정보.

= '모르는 걸 알게해주는' 정보의 근본적 역할을 수행하지 못함.

= 활용하기 힘듦.

= 쓸모 없음.

= 웹이라 하기 부끄러움.

= 호...애써 만든 내 웹이 가치가 없다니....

가 되면 너무 슬프니까!

웹 개발에서 Semantic Web/Tag라는 개념이

중요하게 다뤄지는 듯하다.

3. Semantic Web/Tag 예시

의미론적 웹을 만드는 의미론적 태그는 다음과 같다.

출처 - https://opentutorials.org/module/1892/10954

예를들어,

위 태그들로

이렇게 영역마다 의도와 역할이 살아있는 구조물을 구성하면,

의미론적 웹이 완성....되지 않는다.

전체 맥락 안에서

각 요소의 태그가 적절하게 붙어야

의미론적 웹이 완성된다.

쓸데없이 언급해서 tmi인 웹을 만들거나,

중요한데 대충 짚고 넘어가는 불친절한 웹은

의미론적 웹이 아니라는 말이다.

단순한 예를들어,

같은 고양이 사진을 A웹, B웹에서 동일하게 썼다고 해보자.

A웹은 고양이를 설명하는 페이지이고,

B웹은 어려운 개발용어를 설명하는 페이지이다.

내용상

A웹에서 고양이 사진은 설명 자료로,

B웹에서 고양이 사진은 기분 전환 짤로 쓰였다.

의미론적 웹을 만드려면,

A웹에서 고양이 사진은 HTML <img>태그를 걸고,

B웹에서 고양이 사진은 CSS background-image 속성으로 추가하는 것이 좋다.

물론 고양이 사진은 언제나 핵심이라서 늘 <main>태그를 달아줘야한다..(?)

미래의 나야.. 나 잘 배운 거 맞지.......?

끗.