semantic web, semantic tag
우선 시맨틱 웹은 '의미론적인 웹’이란 뜻이다.
우리는 검색을 할 때 브라우저의 검색엔진이 더 잘 이해하게 검색을 해 양질의 검색 결과를 얻으려 한다.
그렇다면 검색엔진은 어떻게 더 관련성이 높은 사이트들을 우리에게 보여줄까?
semantic web
html 문서 작성시 태그 하나하나 마다 의미하는 바가 달라서 검색엔진도 이를 의미론적으로 받아들여 검색결과에 반영한다.
그래서 우리는 항상 의미에 맞게 알맞는 태그를 적재적소에 사용해야 한다.
또한 구글 seo(검색 엔진 최적화)가이드에선 검색엔진에 잘 노출 되려고 노력하기 보단 html코드를 의미론적으로 작성하는 것이 가장 좋은 seo라고 한다.
검색엔진에 노출 되려고 너무 많은 노력을 하다보면 스팸으로 간주되 검색결과에 노출이 되지 않을 수도 있으니 html 코드를 의미론적으로 작성하는데 초점을 맞춰야 할거 같다.
semantic tag
검색엔진에게 좀 더 노출이 되려면 semantic tag 잘 사용해야 한다.
검색엔진이 html문서를 읽을 때 우리가 좀 더 잘 이해시켜 주기 위해 “여기는 본문, 네비게이터, 광고야!” 라고 알려주면 검색엔진이 이해하기 더 쉬울 것이다.
이러한 역할을 semantic tag가 수행을 하는데 몇가지 자주 사용하는 태그를 소개하겠다.
아래 링크를 통해 좀 더 자세한 설명과 semantic tag들을 만날 수 있다.
<img>, backGround-img 차이
문서에 이미지를 추가하는 방법중에 <img> 태그와 backGround-img 속성이 있다.
의미론적으로 생각한다면 <img> 태그가 좋을 것이다.
컨텐츠 이해에 있어 이미지가 필요하다면 <img> 태그를 사용하는 것이 좋다.
이유는 img태그엔 alt라는 속성이 있는데 이는 이미지가 뜨지 않을 때 alt 텍스트가 대신해서 출력된다.
단지 이러한 이유 때문에 작성하는 것은 아니다. 이미지 검색시 alt속성이 영향을 줄 수 있다.
또한 웹 접근성을 위해 이러한 작은 노력들이 필요하다.
그렇다면 언제 backGround-img를 사용하는 것이 좋을까?
<img>태그와 달리 단지 디자인 목적이라면 backGround-img가 좋을 것이다.
