sementic web과 sementic tag

좋은 코드란 무엇일까?

웹 브라우저에 완벽한 결과를 렌더링 하는 코드,
가독성이 좋은 코드,
효율적으로 만든 코드 등등

좋은 코드를 갖추게 하는 것으로서 여러 조건들을 나열할 수 있겠지만,
'sementic web'이라는 개념을 빼놓을 수 없을 것이다.

코드는 사람이 치는 것이며, 결국 사람이 이해해야한다.
가독성이 좋은 코드란 코드 행간의 의미를 잘 드러내는 것일 수 있다.
그런데 웹페이지의 정보를 수집하는 기계 또한 이 행간의 의미를 읽는다고 한다.
우리는 구글이라는 거대한 검색엔진이 존재하는 세상에 살고 있는데, 이런 구글같은 검색엔진도 행간의 의미를 읽어 키워드의 중요도를 판별한다고 한다.

그렇다면 검색엔진은 어떻게 그것들을 파악할 수 있을까?

*이미지 출처 :https://poiemaweb.com/html5-semantic-web

위의 렌더링된 "hello" 텍스트 두개에는 차이가 없지만, 코드로 봤을때 위의 "hello"는 아무런 의미가 없다. 단지 사이즈6을 가진 텍스트로서 기능한다.
그렇지만 h1 태그로 감싸진 "hello"는 header중 가장 중요한 키워드라는 의미를 갖는다. 데이터를 모으는 검색엔진은 이러한 태그로 감싸진 내용들을 더 중요하다고 판단한다.

개발자는 이처럼, 단순히 사람 사이의 가독성을 넘어서 검색엔진에도 노출이 잘 되도록 코드를 작성해야 한다.

이러한 의미를 가진 태그를 'sementic tag'라고 하며 form, table, img 등이 있다.

그리고 이러한 태그를 적절하게 사용하여 웹 페이지를 의미있는 데이터들의 집합으로 구성하려는 발상을 'sementic web'이라고 한다.

html태그를 작성할 때 적재적소에 'sementic tag'를 사용하여 'sementic web'을 지향하자!