Would you like to view Search OS in English?View in English
용어집
SEO

메타 태그

메타 태그는 HTML 문서의 <head> 영역에 들어가 페이지에 대한 메타데이터(문자 인코딩, 설명, 뷰포트, 크롤링 규칙 등)를 검색엔진과 브라우저에 전달하는 <meta> 태그들의 총칭입니다. 메타 디스크립션·메타 로봇 태그 등은 모두 메타 태그의 한 종류입니다.

  • 메타 태그는 HTML 안에서 페이지 메타데이터를 제공하는 태그의 총칭으로, 메타 디스크립션이나 메타 로봇 태그는 그 하위 종류입니다.
  • 메타 태그는 charset(인코딩 선언), http-equiv(HTTP 헤더 대체), name+content(문서 수준 메타데이터)의 세 가지 방식으로 정보를 전달합니다.
  • Google이 인식하는 메타 태그에는 description, robots/googlebot, viewport, google-site-verification 등이 있습니다.
  • og: 계열은 Open Graph 프로토콜 메타 태그로, 소셜 미디어 공유 시 미리보기 카드를 구성합니다.
  • 메타 태그 자체가 검색 순위를 직접 끌어올리지는 않지만, 색인·스니펫·모바일 렌더링·공유 표현을 제어하는 핵심 신호입니다.

메타 태그란?

메타 태그는 HTML 페이지의 <head> 영역에 위치해 페이지에 대한 부가 정보를 검색엔진과 브라우저 같은 클라이언트에 전달하는 <meta> 태그의 총칭입니다. 화면에 직접 보이지는 않지만, 문서의 문자 인코딩, 페이지 요약, 모바일 화면 렌더링 방식, 크롤러에 대한 색인 지시 등 페이지의 메타데이터를 정의합니다.

여기서 중요한 점은 메타 태그가 상위 개념이라는 것입니다. 흔히 SEO에서 언급되는 메타 디스크립션이나 메타 로봇 태그는 별개의 개념이 아니라 메타 태그의 한 종류입니다. 즉 <meta name="description">, <meta name="robots"> 모두 메타 태그라는 큰 범주 안에 속합니다.

메타데이터 전달 방식

MDN 문서에 따르면 <meta> 요소는 다음 방식으로 메타데이터를 제공합니다. 어떤 속성을 쓰느냐에 따라 역할이 달라집니다.

  • charset — 문서의 문자 인코딩을 선언합니다. HTML5에서는 utf-8이 유일하게 유효한 값이며, 문서 첫 1024바이트 안에 위치해야 합니다.
  • http-equiv — HTTP 응답 헤더를 모방하는 프래그마 지시어로 동작합니다(예: refresh).
  • name + content — 페이지 전체에 적용되는 이름-값 쌍의 문서 수준 메타데이터를 정의합니다(예: description, viewport, robots).
  • itemprop — 마이크로데이터를 위한 사용자 정의 메타데이터를 제공하며, name·http-equiv·charset과 함께 쓸 수 없습니다.

주요 메타 태그

아래는 실무에서 자주 쓰이고 Google이 공식적으로 인식하는 주요 메타 태그입니다(출처: Google Search Central, MDN).

메타 태그역할
charset문서 문자 인코딩 선언(HTML5는 utf-8 고정)
name="description"페이지 요약 제공. 검색 결과 스니펫에 표시될 수 있음
name="robots" / name="googlebot"색인·크롤링 동작 제어. robots는 모든 검색엔진, googlebot은 Google 전용
name="viewport"모바일 화면 렌더링 방식 지정. 모바일 친화성 신호
name="google-site-verification"Search Console 사이트 소유권 확인
name="notranslate"검색 결과에서 페이지 번역본 제공 차단
property="og:*"Open Graph 프로토콜. 소셜 공유 미리보기 구성

코드 예시

일반적인 페이지 <head>에 들어가는 메타 태그 구성입니다.

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="페이지를 한두 문장으로 요약한 설명입니다.">
  <meta name="robots" content="index, follow">

  <!-- Open Graph (소셜 공유 미리보기) -->
  <meta property="og:title" content="페이지 제목">
  <meta property="og:description" content="공유 시 보일 설명">
  <meta property="og:image" content="https://example.com/preview.jpg">
  <meta property="og:url" content="https://example.com/page">
</head>

SEO 관련성과 근거

메타 태그가 검색 순위를 직접 끌어올리는 마법은 아닙니다. 실제로 Google은 name="keywords" 메타 태그를 순위 산정에 사용하지 않는다고 오래전부터 밝혀 왔습니다. 다만 메타 태그는 검색 노출과 사용자 경험을 좌우하는 핵심 제어 신호입니다.

  • 스니펫 제어: description은 검색 결과에 표시되는 요약문의 후보가 되며, 클릭률(CTR)에 영향을 줍니다.
  • 색인 제어: robots 메타 태그로 페이지 단위 색인·노출 방식을 세밀하게 지시할 수 있습니다.
  • 모바일 친화성: viewport는 모바일 렌더링 방식을 Google에 알리는 신호입니다.
  • 공유 표현: Open Graph 메타 태그(og:title, og:image 등)는 ogp.me 표준으로, 소셜 플랫폼 크롤러가 미리보기 카드를 생성하는 근거가 됩니다.

실행 체크리스트

  • 모든 페이지에 charset="utf-8"viewport를 포함했는지 확인합니다.
  • 페이지마다 고유하고 적절한 길이의 description을 작성합니다.
  • 색인에서 제외할 페이지는 robots 메타 태그의 noindex로 명시합니다.
  • 소셜 공유가 중요한 페이지에는 og:title·og:description·og:image·og:url을 설정합니다.
  • 순위에 무의미한 keywords 메타 태그에 시간을 쏟지 않습니다.

참고·출처

관련 용어