시멘틱 웹이란
시멘틱 웹은 '의미론적인 웹'이라는 뜻으로, 현재의 인터넷과 같은 분산환경에서 리소스에 대한 정보와 자원 사이의 관계=의미 정보를 기계가 처리할 수 있는 온톨로지 형태로 표현하고, 이를 자동화된 기계(컴퓨터)가 처리하도록 하는 프레임워크이자 기술이다. (온톨로지: 온톨로지란 사람들이 세상에 대하여 보고 듣고 느끼고 생각하는 것에 대하여 서로 간의 토론을 통하여 합의를 이룬 바를, 개념적이고 컴퓨터에서 다룰 수 있는 형태로 표현한 모델로, 개념의 타입이나 사용상의 제약조건들을 '명시적'으로 표현한 기술이다.)
시멘틱 태그란
시멘틱 태그는 단순한 표현하는 것이 아니라 웹페이지에 의미를 도입하는 태그이다. 예를 들어 p태그는 텍스트가 단락임을 의미해주고 있다. 사람과 브라우저가 단락을 표시하고 있음을 알고 있기 때문에 의미론적이고 표현적이라고 할 수 있다.
HTML5 이전에는 각 기본적인 태그(div나 span과 같은)에 id와 class를 붙여 구역을 나누고 스타일을 지정했다.
의미가 없는 태그에 이름을 붙이고 임의로 구역을 나눈 것이다.
HTML5에서는 시맨틱태그를 사용하여 코드의 가독성을 높이고 명확하게 표현함으로써 의미를 부여해줬다.
결론
위의 설명을 토대로 1.image태그와 2.background-image 속성의 차이점을 말해보자면 1.image태그의 경우는 리소스에 대한 정보와 자원사이의 관계 정보를 기계가 이해할 수 있는 형태로 브라우저가 인식할 수 있는 의미있는 상태이며 2.background-image속성은 의미가 없는 태그에 속성만 부여해 꾸며줬다는 차이가 있다.
image태그를 쓴다면 에러가 났을 경우 'alt' 대안 속성도 사용할 수 있기 때문에 이미지가 사용자에게 컨텐츠 이해에 도움을 준다고 생각하면 image태그를 그렇지 않으면 background image를 쓰면 될 것 같다
