벨로그를 작성하기에 앞서, 난 Semantic Web의 뜻을 명확하게 알지 못해 구글링을 통해 각 개념을 한번 찾아봤다.
Semantic Web
"시맨틱 웹(Semantic Web)은 '의미론적인 웹'이라는 뜻으로,현재의 인터넷과 같은 분산환경에서 리소스(웹 문서, 각종 화일, 서비스 등)에 대한 정보와 자원 사이의 관계-의미 정보(Semanteme)를 기계(컴퓨터)가 처리할 수 있는 온톨로지 형태로 표현하고, 이를 자동화된 기계(컴퓨터)가 처리하도록 하는 프레임워크이자 기술이다. 웹의 창시자인 팀 버너스리가 1998년 제안했고 현재 W3C에 의해 표준화 작업이 진행 중이다." - 위키백과
헷갈리는 단어
-온톨로지
사람들이 세상에 대하여 보고 듣고 느끼고 생각하는 것에 대하여 서로 간의 토론을 통하여 합의를 이룬 바를, 개념적이고 컴퓨터에서 다룰 수 있는 형태로 표현한 모델로, 개념의 타입이나 사용상의 제약조건들을 명시적으로 정의한 기술. "의미론적 웹" 이라는 뜻을 갖고 있다.
-의미론적 웹
기존의 HTML로 작성된 문서는 컴퓨터의 해석보다는 사람의 시각적인 정보수용에 초점을 두었는데 시맨틱 웹은 컴퓨터의 해석 즉, 의미에 초점을 두었다.
이해하기 어렵지만 위의 내용으로 간략하게 요약해보자면, 시멘틱 웹이란 1세대 웹보다 훨씬 진화된 기술이다. 컴퓨터가 정보자원의 뜻을 해석하고, 기계들끼리 서로 정보를 주고 받으면서 자체적으로 필요한 일을 처리하여 사용자가 필요로 하는 정보를 검색하고, 검색된 정보에서 지식을 추론할 수 있는 기능을 제공한다. 컴퓨터는 원래 단순 정보전달의 매개체였다. 하지만, 시멘틱 웹으로 인해 현재의 컴퓨터는 정보를 이해할 수 있기에, 직접 분석하여 자료를 만들어 데이터베이스를 구축할 수 있다.
Semantic Tags
이해를 돕기 위해 아래의 이미지를 구글링 했다.
코딩을 모른다 할지라도 오른쪽의 프레임이 훨씬 깔끔해 보인다. 그 이유는 semantic tag가 사용됐기 때문이다. semantic tag는 HTML5부터 적용됐다.
위의 이미지를 통해 semantic tag이 뭔지 대충 추론해볼 수 있다. html4에선 div태그에 id = "header" 속성을 부여했다. 하지만 html5에선 header는 이미 정해져있다. 코드의 가독성이 훨씬 좋아졌다.
질문
"사이트에 이미지를 넣는 방법은 두 가지가 있습니다. img 태그를 사용하는 것과 img 태그에 background-image 속성을 추가하는 것. 두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋은지 설명해보세요."
img태그 사용
코드를 출력하면, 만약 이미지가 제대로 연결만 돼있다면 이미지가 그대로 출력된다. 하지만, 이미지가 깨졌다면 alt속성을 통해 그 이미지의 기본적인 설명을 할 수 있다.
<img src = "링크" alt = "설명">만약 부여된 링크가 올바르지 않다면, 설명이 대신 출력되기에 수정할때 어느부분을 봐야될지 알게된다.
background-image 사용
만약 background-image를 사용했을때 이미지 에러가 나면 아무것도 나타나지 않는다. alt속성이 없기 때문이다.
img태그를 사용하면 "이미지"라는 의미를 가진 semantic element가 되지만, background-image는 div태그를 사용했기에 아무런 의미를 가지지 않는다.
