본문 바로가기

벌새::Computer & IT

디딤돌의 재미있는 주석과 메타 태그(Meta Tag)

반응형
온라인 학습 관련 사이트 디딤돌 메인 페이지의 소스를 우연히 확인하던 중 재미있는 주석을 발견하였습니다.


Head 부분에 메타 태그(Meta Tag)를 입력하면서 특정 항목에 대해 어떤 용도로 입력을 하였는지 주석을 달아 두었습니다.

일반적인 딱딱한 주석이 아닌 온라인 상에서 사용하는 변형된 문자로...

사실 중요한 것은 주석이 아니라 메타 태그에 대해 간단하게 해석해 보도록 하겠습니다.

메타 태그란, 일반적으로 웹문서(Htm, Html)가 담고 있는 내용에 대한 정보를 설명하는 태그를 의미합니다. 최종적인 목표는 검색 엔진에서 해당 페이지의 내용을 반영할 수 있도록 키워드를 입력할 수 있는 기능을 제공하고 있습니다.
[메타 태그의 기본 형태]

<meta 속성="값" content="내용" />​

특히 국내의 경우 영어권이 아닌 관계로 검색 엔진에서 한국어 웹 사이트임을 감안하여 다음과 같은 메타 태그를 추가하는 것이 일반적입니다. 이런 메타 태그는 반드시 Head 영역 안에 추가를 해야 합니다.
<meta http-equiv="content-type" content="text/html; charset=euc-kr" />​

특정 웹 사이트를 방문하였을 경우 한글이 깨지는 현상이 발생하는 경우 위와 같은 메타 태그를 추가하게 되면 자동으로 해당 언어로 인코딩을 하여 정상적으로 확인할 수 있습니다.

디딤돌 사이트에서 구글(Google) 때문에 추가한 항목은 다음과 같은 경우입니다.
<meta name="verify-v1" content="특정 값" />​

해당 메타 태그는 구글 사이트맵(Sitemap)에 의해 사용되는 인증 요소 중의 하나입니다. 즉, 구글 사이트맵을 제출할 경우 검색에 반영될 수 있도록 하기 위한 인증값을 메타 태그에 포함하는 것입니다.

반대로 특정 사이트의 운영자가 검색엔진의 로봇이 자신의 정보를 검색하지 못하게 하기 위해서는 다음과 같은 메타 태그를 입력하여 검색을 피할 수 있습니다.
<meta name="robots" content="noindex, nofollow" />
마지막으로 특정 사이트의 주소가 변경이 되거나 다른 사이트로 방문자를 자동으로 연결시킬 경우에는 다음과 같은 메타 태그를 이용하실 수 있습니다.
<meta http-equiv="refresh" content="시간(초);url=이동 주소" />​

즉, 일정 시간이 지나면 입력된 이동 주소로 자동으로 refresh를 시켜서 방문자를 원하는 사이트로 이동을 시키는 방식입니다. 해당 태그의 경우에는 악의적으로 사용되는 경우를 많이 볼 수 있어서 사용자 입장에서 원치않는 사이트로 납치를 당하는 경우에 많이 사용되는 것 같습니다.

특정 페이지의 소스를 확인하면서 해당 소스에 포함된 메타 태그가 의미하는 것을 간단하게 살펴보았습니다.
반응형