메타태그 설정하는 방법 — 검색 노출을 좌우하는 필수 태그 가이드
목차 8
핵심 요약
- 메타태그는 검색엔진과 SNS에 내 페이지 정보를 전달하는 HTML 코드 — 제대로 안 쓰면 클릭률이 반토막 납니다
- title 태그와 meta description이 가장 중요하고, OG 태그와 canonical도 반드시 챙겨야 합니다
- 설정 후에는 반드시 도구로 검증하세요 — 오타 하나가 검색 노출을 망칠 수 있습니다
메타태그를 제대로 안 쓰면 생기는 일
사이트를 열심히 만들었는데, 구글 검색결과에 내 페이지 제목이 이상하게 나오거나 설명이 엉뚱한 문장으로 표시된 적 있으시죠? 그게 바로 메타태그 문제입니다.
솔직히 말하면, 저희가 컨설팅하면서 가장 많이 보는 기초적인 실수가 메타태그 미설정입니다. 사이트 구조도 괜찮고 콘텐츠도 좋은데, 정작 검색결과에 보이는 제목과 설명이 엉망이니 클릭을 안 하는 거죠. Google 검색 센터 — 메타 디스크립션 가이드에서도 메타 디스크립션을 "사용자에게 이 페이지가 정확히 찾고 있는 것임을 설득하는 피치"라고 설명합니다. 그만큼 검색 클릭률에 직접적인 영향을 주는 요소입니다.
메타태그 설정은 어렵지 않습니다. 다만 "어떤 태그를 어떻게 써야 하는지" 정리된 가이드가 필요할 뿐이죠. 이 글에서 실무에서 바로 쓸 수 있는 메타태그 설정법을 단계별로 알려드리겠습니다.
SEO에서 진짜 중요한 메타태그 5가지
HTML에는 수십 가지 메타태그가 있지만, SEO 관점에서 실제로 중요한 건 5가지입니다. 나머지는 대부분 무시해도 됩니다.
| 메타태그 | 역할 | SEO 영향 |
|---|---|---|
| title 태그 | 검색결과 제목, 브라우저 탭 제목 | 직접 순위 요소 |
| meta description | 검색결과 설명 스니펫 | 클릭률(CTR) 영향 |
| OG 태그 | SNS 공유 시 미리보기 | 간접 (트래픽/공유) |
| canonical | 중복 페이지 원본 지정 | 중복 콘텐츠 방지 |
| viewport | 모바일 반응형 설정 | 모바일 친화성 필수 |
title 태그
title 태그는 검색결과에서 클릭 가능한 파란색 제목으로 표시됩니다. 검색엔진이 페이지 주제를 판단하는 가장 중요한 요소 중 하나이고, 실제로 순위에 직접 영향을 줍니다.
좋은 title 태그의 조건은 간단합니다. 핵심 키워드를 앞쪽에 넣고, 30~60자 이내로 작성하세요. 예를 들어 "메타태그 설정 방법 — SEO 필수 가이드"처럼요.
meta description
meta description은 검색결과에서 제목 아래에 표시되는 설명문입니다. 구글이 직접적인 순위 요소로 사용하지는 않지만, 잘 쓴 디스크립션은 클릭률을 크게 올려줍니다. 저희 팀 내부에서도 디스크립션만 수정했더니 CTR이 15~20% 오른 사례를 여러 번 봤습니다.
80~155자 사이로 작성하고, 페이지의 핵심 가치를 담으세요. "~하세요", "~확인해보세요" 같은 행동 유도 문구를 넣는 게 효과적입니다.
오픈그래프(OG) 태그
og:title, og:description, og:image — 이 세 가지는 카카오톡이나 페이스북에 링크를 공유할 때 미리보기로 표시됩니다. SEO 순위에 직접 영향은 없지만, 공유가 많이 될수록 트래픽이 늘어나니까 간접적으로는 꽤 중요합니다.
canonical 태그
같은 콘텐츠가 여러 URL로 접근 가능할 때(예: www 버전과 non-www 버전), canonical 태그로 "이게 원본이야"라고 검색엔진에 알려줍니다. 이걸 안 하면 검색엔진이 중복 콘텐츠로 판단해서 순위가 분산될 수 있습니다.
viewport 태그
모바일 반응형의 기본입니다. 이게 없으면 구글의 모바일 우선 색인에서 불이익을 받을 수 있어요. 사실 대부분의 프레임워크가 자동으로 넣어주지만, 간혹 빠져 있는 경우를 봅니다.
여러분 사이트의 메타태그가 제대로 설정되어 있는지 지금 바로 확인해보세요.
메타태그 분석기로 검사하기 →메타태그 설정하는 방법 — 단계별 실전 가이드
이제 실제로 HTML에 메타태그를 넣는 방법을 단계별로 살펴보겠습니다. 모든 메타태그는 HTML의 <head> 영역 안에 들어갑니다.
1단계: title 태그 작성하기
title 태그는 <title> 요소로 작성합니다. 모든 페이지에 고유한 제목을 넣는 게 핵심입니다.
<title>메타태그 설정하는 방법 — SEO 검색 노출 필수 가이드 | SEO월드</title>
TIP 핵심 키워드를 제목 앞쪽에 배치하세요. "SEO월드 | 메타태그 설정 방법"보다 "메타태그 설정 방법 | SEO월드"가 검색엔진에 더 유리합니다. Google 타이틀 링크 가이드에서도 서술적이고 간결한 제목을 권장합니다.
2단계: meta description 작성하기
meta description은 <meta> 태그의 content 속성에 작성합니다.
<meta name="description" content="메타태그 설정 방법을 단계별로 정리했습니다. title, description, OG 태그까지 실전 코드와 함께 확인하세요.">
실무에서는 이렇게 작성하면 됩니다. 페이지의 핵심 가치를 한 줄로 요약하고, 마지막에 행동을 유도하는 문구를 넣으세요.
3단계: OG 태그 설정하기
OG 태그는 <meta property="og:..."> 형식으로 추가합니다. 최소한 title, description, image 세 가지는 넣어야 합니다.
<meta property="og:title" content="메타태그 설정하는 방법 — 완벽 가이드">
<meta property="og:description" content="SEO 검색 노출을 위한 메타태그 설정 방법을 코드와 함께 정리했습니다.">
<meta property="og:image" content="https://example.com/og-image.jpg">
참고 og:image의 권장 크기는 1200x630 픽셀입니다. 이보다 작으면 SNS에서 미리보기가 잘리거나 흐릿하게 나올 수 있습니다.
4단계: canonical과 기타 태그 추가하기
canonical 태그와 viewport까지 추가하면 기본 메타태그 설정은 완료입니다.
<link rel="canonical" href="https://example.com/your-page">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="UTF-8">
실무에서 자주 보는 메타태그 실수 5가지
저희가 실제로 컨설팅하면서 가장 많이 본 메타태그 실수들입니다. 의외로 간단한 것들인데, 모르고 넘어가면 검색 노출에 꽤 큰 영향을 줍니다.
주의 모든 페이지에 동일한 title과 description을 복붙하는 건 가장 흔하면서도 치명적인 실수입니다. 구글은 이를 "도움이 되지 않는다"고 명시하고 있습니다.
1. 모든 페이지에 같은 title/description 사용 — 페이지마다 고유한 제목과 설명이 필요합니다. "홈페이지", "마이페이지"처럼 모호한 제목도 마찬가지입니다.
2. title 태그에 키워드 욱여넣기 — "메타태그 메타태그설정 메타태그방법 HTML메타태그"처럼 키워드를 나열하면 오히려 스팸으로 판단됩니다. 핵심 키워드 1개만 자연스럽게 넣으세요.
3. description이 너무 길거나 짧음 — 너무 짧으면 정보 부족, 너무 길면 잘립니다. 80~155자 사이가 적당합니다.
4. OG 태그 미설정 — SNS 공유 시 제목 없이 URL만 달랑 보이면 클릭률이 급격히 떨어집니다. 특히 og:image를 빼먹는 경우가 많습니다.
5. canonical 태그 오지정 — canonical을 다른 페이지로 잘못 가리키면, 검색엔진이 원본 페이지를 색인에서 제외할 수 있습니다. 실제로 이 실수로 트래픽이 절반으로 줄어든 사례를 본 적 있습니다.
- 모든 페이지에 고유한 title 태그가 있는가
- meta description이 80~155자 이내인가
- OG 태그(title, description, image)가 설정되어 있는가
- canonical 태그가 올바른 URL을 가리키는가
- viewport 태그가 포함되어 있는가
Next.js, WordPress 등 플랫폼별 메타태그 설정법
순수 HTML이 아니라 프레임워크나 CMS를 쓰고 있다면, 메타태그 설정 방법이 조금 다릅니다. 실무에서 가장 많이 쓰는 두 가지를 정리했습니다.
Next.js / React에서 메타태그 설정하기
Next.js App Router를 사용한다면 metadata 객체를 export하면 됩니다.
export const metadata = {
title: '메타태그 설정하는 방법',
description: '메타태그 설정 방법을 단계별로 정리한 가이드',
openGraph: { title: '...', description: '...', images: ['...'] },
}
페이지별로 다른 metadata를 export하면 자동으로 해당 페이지의 <head>에 반영됩니다. Pages Router를 쓴다면 next/head의 <Head> 컴포넌트를 사용하세요.
WordPress에서 메타태그 설정하기
WordPress는 Yoast SEO나 Rank Math 같은 플러그인을 사용하면 코딩 없이 설정할 수 있습니다. 글 편집 화면 하단에 SEO 제목과 메타 디스크립션 입력란이 나타납니다.
플러그인 없이 하려면 테마의 header.php 파일에서 <head> 영역을 직접 수정해야 하는데, 테마 업데이트 시 초기화될 수 있으니 자식 테마(child theme)를 만들어서 작업하는 걸 추천합니다.
어떤 플랫폼을 쓰든 핵심은 같습니다. 페이지마다 고유한 title, description, OG 태그를 설정하고, canonical이 올바른 URL을 가리키는지 확인하면 됩니다. 온페이지 SEO 최적화 가이드에서 메타태그를 포함한 전체 SEO 체크 포인트를 확인할 수 있습니다.
메타태그 설정 후 확인하는 방법
메타태그를 설정했으면 반드시 검증해야 합니다. 실무에서는 설정은 잘 해놓고 확인을 안 해서 오타가 그대로 나가는 경우가 꽤 많습니다.
가장 빠른 방법은 온페이지 SEO 분석 도구로 사이트 URL을 입력하는 겁니다. title, description, OG 태그가 제대로 들어가 있는지 한 번에 확인할 수 있습니다.
TIP 구글 서치콘솔의 'URL 검사' 기능으로 구글이 실제로 어떤 제목과 설명을 표시하는지 확인할 수 있습니다. 메타태그를 수정한 후 여기서 '색인 요청'을 하면 변경사항이 더 빨리 반영됩니다.
SNS 공유 미리보기는 카카오 디버거(developers.kakao.com)나 Facebook 공유 디버거로 확인하세요. OG 태그가 제대로 적용되는지 바로 볼 수 있습니다.
메타태그가 올바르게 설정되어 있는지 지금 바로 분석해보세요.
내 사이트 SEO 분석하기 →메타태그 체크리스트 — 발행 전 최종 점검
새 페이지를 만들거나 기존 페이지를 수정할 때, 발행 전에 아래 항목을 확인하세요. 저희 팀에서도 이 체크리스트를 매번 씁니다.
- title 태그: 핵심 키워드가 앞쪽에 있고, 30~60자 이내인가
- meta description: 페이지 핵심 가치가 담기고, 80~155자인가
- og:title, og:description, og:image가 모두 설정되었는가
- canonical 태그가 정확한 URL을 가리키는가
- viewport 태그가 포함되어 있는가
- charset이 UTF-8로 설정되어 있는가
- 모든 태그가 다른 페이지와 고유하게 다른가
메타태그는 한번 제대로 잡아놓으면 계속 효과를 발휘하는 기본 중의 기본입니다. 지금 당장 여러분 사이트의 메인 페이지부터 확인해보세요. 메타태그 분석기에 URL을 넣으면 30초 안에 현재 상태를 파악할 수 있습니다.
우리 사이트 메타태그, 제대로 되어 있을까? 무료로 확인해보세요.
메타태그 무료 분석하기 →자주 묻는 질문
메타태그를 설정하면 검색 순위가 바로 올라가나요?
meta description은 몇 글자가 적당한가요?
메타 키워드(meta keywords) 태그는 아직 필요한가요?
오픈그래프 태그는 SEO에 직접적인 영향이 있나요?
모든 페이지에 메타태그를 다르게 설정해야 하나요?
지금 시작하기 막막하다면, 무료 SEO 도구로 가볍게 진단부터
회원가입 없이 바로 쓰는 무료 도구들 — 키워드·백링크·온페이지 진단까지 한 번에 점검해볼 수 있습니다.
무료 도구 둘러보기이 글이 도움이 되었다면 공유해주세요
최혁명 · SEO 컨설턴트
검색엔진 최적화(SEO) 전문가. SEO월드를 운영하며 실전 SEO 가이드와 무료 분석 도구를 만들고 있습니다. 국내외 SEO 트렌드를 실무 관점에서 풀어내는 콘텐츠를 만듭니다.