Semantic Web, Semantic Tag

Semantic Web

Data를 의미와 관련성을 나타내는 structured information으로 convert해 컴퓨터가 더 쉽게 처리할 수 있도록 하는 목적을 갖는 발상이다. 이를 통해 Web이 거대한 분산형 데이터베이스(distributed database)로 구축된다. 참고 링크

Sementic Web은 문서와 문서, app과 app 사이를 연결하는 게 아니라 문서의 근간이 되는 information들이 서로 연결되어 있는 Web of Data를 뜻한다. 참고 링크

 

cf. 정보를 연결하는 방식은 인터넷에 있는 수많은 문서들이 하이퍼링크로 연결된 Web 1.0 - Web of Documents, 그리고 data가 application단위로 나뉘어 있는 Web 2.0 - Application Silos를 거쳐 Web 3.0 - Connect Data에 도달했다. 참고 링크

Semantic Tag

Sementic Web을 구현하기 위한 tool. tag itself로도 content에 대한 정보를 제공한다. form, table, 그리고 article 등이 있다. 참고 링크

컴퓨터가 content에 대한 정보를 파악하기 쉽도록 하여 SEO(검색엔진 최적화) 적합성과 blind friendly한 접근성을 갖춘다.

cf. Non-semantic tag에는 div, span, 그리고 p 등이 있다.

---

img tag vs background-image attribute in div tag

양쪽 다 이미지를 넣는 방법이다.

 

차이점

img tag는 alt attribute를 사용하여 해당 이미지가 어떤 건지 설명해줄 수 있는, semantic tag의 일종이다.

div tag에 들어가는 background-image는 non-semantic tag이다. 이미지만 나타낸다.

 

img tag를 사용하기 좋은 경우

1. 이미지의 의미를 넣을 때. alt attribute를 사용.

2. SEO 관점에서 이미지가 무게를 가질 때

 

background-image를 사용하기 좋은 경우

1. 이미지 위에 텍스트를 쉽게 넣고 싶을 때

2. image sprites(참고 링크)를 통해 속도를 향상시키고 싶을 때