No.1 Semantic Web과 Semantic Tag

Jetom·2021년 8월 30일
0

html

목록 보기
1/1
post-thumbnail

🥳 드뎌 오프라인으로 위코드에 와서 열심히 OT도 듣고...(?) 사전 스터디원분들 식사조분들과 수다도 열심히 떨고 재밌게 하루를 보낸것같당~


Semantic Web(시맨틱 웹)

컴퓨터가 사람을 대신하여 정보를 읽고, 이해하고 가공하여 새로운 정보를 만들어 낼 수 있도록 이해하기 쉬운 의미를 가진 차세대 지능형 웹.

https://namu.wiki/w/%EC%8B%9C%EB%A7%A8%ED%8B%B1%20%EC%9B%B9

우선 Semantic Web(시맨틱 웹)의 개념을 찾아봤을 땐 위와 같이 나온다. 너무 추상적으로 나와서 다시 한번 열심히 구글링하니, 아래와 같은 내용을 찾을 수 있었다.

시맨틱 요소로 구성되어 있는 웹페이지는 검색엔진에 보다 의미론적으로 문서 정보를 전달할 수 있고 검색엔진 또한 시맨틱 요소를 이용하여 보다 효과적인 크롤링과 인덱싱이 가능해졌다. 즉, 시맨틱 태그란 브라우저, 검색엔진, 개발자 모두에게 콘텐츠의 의미를 명확히 설명하는 역할을 한다. 시맨틱 태그에 의해 컴퓨터가 HTML 요소의 의미를 보다 명확히 해석하고 그 데이터를 활용할 수 있는 시맨틱 웹이 실현될 수 있다.

https://poiemaweb.com/html5-semantic-web

한마디로 컴퓨터도 알아보기 쉽고, 사용자도 알아보기 쉽게 만드는것이 시맨틱 웹이란 소리같다.(효과적인 크롤링이라고 하니...😅)

시맨틱 웹에 대해서 엄청나게 뭘 더 얘기하기보단 지금 단계에선 이정도만 알고 넘어가면 될것같은 느낌 👀

html

위의 설명에보면 html이라고 나와있는데, 그렇다면 html은 무엇일까? html은 (Hypertext Markup Language) 말 그대로 마크업을 하는 언어이다. 여기서 또 마크업 언어란 무엇일까? 라는 생각이 드는데..(🙄 그렇다고해줍시다..) 아래의 설명을 참고하자

마크업 언어(markup 言語, markup language)는 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어의 한 가지이다.

https://ko.wikipedia.org/wiki/%EB%A7%88%ED%81%AC%EC%97%85_%EC%96%B8%EC%96%B4

쉽게 말해 h1~6 태그, img 태그 등등 쓰는 순간부터 html을 쓸 수 있는 사람이 되는것이다!(이제 자랑하면된다..)

Semantic Tag(시맨틱 태그)

HTML5 시맨틱 태그는 요소의 목적을 정의합니다. 시맨틱 마크업을 사용하면 브라우저가 콘텐츠를 표시하는 대신 콘텐츠의 의미를 이해하도록 돕습니다.

https://www.bitdegree.org/learn/html5-semantic-tags#the-origins-of-html5-semantic-tags

시맨틱 태그는 예를들어 "이곳은 header(헤더 = 머릿말)구나, section(섹션 = 구역)이구나!" 라고 한눈에 볼 수 있는 태그이다. 시맨틱 태그를 쓰기전엔 div class="header" 같이 div를 남발해서 시맨틱 태그인 '척' 넣어줬는데, html5에서는 새롭게 추가되어 쓸 수 있게되었다. 아래 사진은 시맨틱 태그를 어떤 영역에 쓰는지 간단하게 나타내었다.

다음은 html5에서 추가된 시맨틱 태그들이다.

tagDescription
header헤더를 의미한다
nav내비게이션을 의미한다
aside사이드에 위치하는 공간을 의미한다
section본문의 여러 내용(article)을 포함하는 공간을 의미한다
article분문의 주내용이 들어가는 공간을 의미한다
footer푸터를 의미한다

https://poiemaweb.com/html5-semantic-web

👉 img 태그와 background-image의 차이

위에서 본것을 토대로 img 태그는 html에서 마크업으로 쓰이며, background-image는 css에서 쓰이는 속성이다.
즉 html에서 img 태그로 쓸것인지 css에서 bakcgorund 속성으로 줄지의 차이라 보면된다.


vscode로 시맨틱 태그는 맨날 치면서 정작 시맨틱 웹은 몰랐던 과거의 나를 반성한다..😏 그래도 지금이라도 안게 어디냐고 생각하면서.... 이만 마친다...ㅎㅎ...

profile
사람이 좋은 인간 리트리버 신혜리입니다🐶

0개의 댓글