이미지를 넣는 두가지 방식을 다루면서 시맨틱 웹(Semantic Web)과 시맨틱 태그(Semantic Tags) 개념을 알 수 있다.

시맨틱 웹(Semantic Web) 은 html 상의 정보를 오직 사람만 이해할 수 있는 형태로 작성하는 것을 넘어서 컴퓨터도 이해할 수 있도록 엄밀한 형식을 갖춰 만든 웹을 의미한다. 이렇게 할 경우 단순한 키워드 검색을 넘어서 상호 관련된 정보를 검색할 수 있게 된다. 웹 전체가 하나의 유기적인 데이터 베이스처럼 사용될 수 있을 것이다. 검색엔진의 봇과 같은 컴퓨터는 마크업만으로 의미를 인지 할 수 있어야 하므로 용도에 맞게 태그를 사용해야 할 것이다.시맨틱 태그(Semantic Tags)는 개발자, 브라우저, 에이전트 모두에게 콘텐츠의 의미를 잘 설명 할 수 있다.

예를 들어서

Hello

처럼 썼을 경우가 Hello 으로 썼을 때보다 컴퓨터가 사용 목적을 이해하는데 우수하다. 우리 눈으로 봤을때는 차이가 없다. 아래 예제처럼 div 를 써서 header 를 id 로 넣어주는것 보다는 태그를 써서 제목을 만드는게 검색엔진의 봇이 목적을 이해하는데 낫다.

```html
<font size="6"><b><strong>Hello</strong></b></font>
<h1>Hello</h1>

<div id="header"> 내용 </div>
<header> 내용 </header>
```

따라서 img 를 웹 페이지에 넣을 때 태그를 썼을 때 시맨틱 웹에 공헌할 수 있을 것이다. div 의 background-img 에 넣을 경우 컴퓨터가 그 목적을 짐작하기 어렵다.

사례출처: poiemaweb 블로그