메타태그(meta tag), 메타데이터(meta data)란 무엇일까?

0. 들어가기

우리는 궁금한 것을 검색할 때 구글 검색창을 자주 이용한다.

구글 검색 : 티스토리 인라인 코드

그리고 보통 맨 위에 뜨는 사이트부터 클릭해 사이트에 접속하게 된다. 그리고 1페이지 몇 개만 눌러보게 되고 2페이지 이후를 보는 일은 거의 없다.

사이트를 운영하는 사람은 구글 검색에서 상위 노출하는 것이 굉장히 중요하게 된다.

예를들어 호텔 사이트에서는 예비 고객층에게 사이트를 노출시키기 위해 부단히 노력하고 있을 것이다.

강남 호텔 검색 : 부킹닷컴-호텔스닷컴-익스피디아-트립어드바이저-...순이다

어떻게 상위에 노출될 수 있을까? 기본적으로 구글의 검색엔진 최적화(SEO)에서 높은 점수를 받아야 상위에 랭크될 수 있다.

이에 대해서는 SEO 기본 가이드 문서가 따로 존재한다.

구글에서 제공하는 SEO 가이드

최신 정보, 지역 뉴스, 신경망 시스템 등 많은 것이 영향을 주지만 중요하게 영향을 주는 것 중 하나는 메타태그이다.

메타태그가 메타 데이터를 담게 되는데, 이것들이 뭔지 알아보자.

 

1. 메타 데이터(metadata)

메타데이터란 데이터를 설명하는 데이터이다.

여기서 설명이란, 그 데이터에 대한 정보를 담고 있다는 뜻이다. 예를 들어 문서의 저자, 생성일, 수정일, 문서 제목, 키워드, 카테고리 등등을 담고 있다. 해당 문서를 설명하거나 분류하는데 사용되는 데이터이다.

카카오톡 대화창 : 유튜브 링크

우리가 카카오톡에 링크를 보내면 대부분의 사이트의 경우, 이미지, url, 제목 등이 같이 부가적으로 붙여 전달된다. 또는 구글 검색을 하면 사이트로 이동하지도 않았는데 구글에서 이미 주요 내용, 이미지까지 크게 나오는 경우가 있다. 이는 메타데이터를 이용한 것이다.

 

2. 메타 태그(meta tag)

메타 태그(Meta tag)는 HTML 문서의 헤더 부분에 삽입되는 특별한 태그로서, 웹 페이지의 메타데이터를 정의하는데 사용된다.

앞에서 봤던 메타데이터가 메타 태그로 들어간다.

다시 말하자면 사용자가 보는 콘텐츠와는 직접적으로 관련이 없지만, 웹 브라우저나 검색 엔진 등이 해당 정보를 활용하여 페이지를 표시(크롤링)하거나 인덱싱하는 데 사용된다.

 

다음 영화 : 엘리멘탈

유행했던 영화인 엘리멘탈에 대한 다음 영화의 페이지이다.

head 안에서 메타 태그를 통해 메타데이터인 title, image등의 정보를 담고 있는것을 볼 수 있다.

 

우리가 사용하는 <meta charset="utf-8">도 메타데이터로서 이것이 UTF-8로 인코딩되었구나. UTF-8 방식으로 읽어야 겠구나를 알려주게 된다.

이 정보가 전달되지 않는다면 디폴트로 설정돼있는 방식으로 화면에 표시되기 때문에 UTF-8 방식의 브라우저가 아닌 경우 화면이 깨질 수 있다.

 

 

---

참고 https://developers.google.com/search/docs/fundamentals/seo-starter-guide?hl=ko 

SEO 기본 가이드: 기본사항 | Google 검색 센터  |  문서  |  Google for Developers