1. Semantic Web
semantic : of, relating to, or arising from the different meanings of words or other symbols
Semantic Web의 목적은 기계로 하여금 인터넷의 데이터들의 의미를 파악할 수 있도록 하는 것이다. Web의 기본이 되는 html은 단순한 문서일 뿐이고, 컴퓨터는 html에 적힌 줄글들의 의미를 해석할 수 없다. html에 아무리 감명깊은 시를 써넣어도, 컴퓨터에게는 아무런 의미가 없는 글자들의 나열일 뿐이다. 하지만 semantic web의 경우, 컴퓨터는 각 html element들의 목적 및 역할을 분석 및 파악할 수 있다.
2. Semantic Tag
Semantic web을 가능하게 하기 위해 semantic tag가 필요하다. div나 span같은 non-semantic element들은 그 자체로 의미를 가지고 있지 않다. 반면 header, footer, nav와 같은 semantic element들은 각각 컴퓨터에게 이 element가 헤더고, 푸터고, 네비게이션이라는 것을 알려준다.
(Non-semantic 웹 예시)
(Semantic 웹 예시)
이 두 웹페이지는 사람이 봤을 때는 전혀 차이가 없다. 하지만 구글에 'I am the header'를 검색한다면, 두번째 semantic web이 검색 결과의 훨씬 상단에 위치할 것이다. 왜냐하면 전자의 경우 동 문장은 아무런 의미도 없고 어떠한 역할을 하지도 않지만, 후자의 경우 이것이 제목(헤더)의 역할을 한다는 것을 컴퓨터가 인지하기 때문이다.
3. img태그와 background-image
"사이트에 이미지를 넣는 방법은 두 가지가 있습니다. img 태그를 사용하는 것과 div 태그에 background-image 속성을 추가하는 것. 두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋은지 설명해보세요."
만약 동 이미지가 유의미하다면( = semantic 하다면, 웹페이지 내에서 특정한 역할을 수행하거나 목적을 가지고 있다면) img태그를 사용하는게 적합할 것이다. 반면 단순히 웹페이지를 디자인하기 위해 이미지를 삽입하는 경우에는 background-image 속성을 이용해 이미지를 추가하는 것이 적합하다. 이렇게 적절한 태그를 사용함으로써 semantic web을 만들 수 있다.
