작성자 티로그몰
작성일Updated on: 2026-06-22 14:54:42

title, description, OG 태그를 제대로 쓰는 방법

홈페이지를 제작한 뒤 검색엔진 최적화를 점검하다 보면 가장 먼저 확인하게 되는 항목이 title, meta description, Open Graph 태그입니다. 모두 페이지의 제목이나 설명을 전달하는 태그처럼 보이지만 실제 사용되는 위치와 목적은 서로 다릅니다.

title과 description은 검색결과에서 사용자가 페이지 내용을 판단하도록 돕는 기본 정보이고, OG 태그는 카카오톡·네이버 블로그·페이스북 등에서 주소를 공유할 때 보이는 미리보기 정보를 구성하는 데 주로 사용됩니다.

태그만 넣는다고 검색 순위가 자동으로 올라가지는 않습니다. 하지만 페이지마다 정확하고 고유하게 작성하면 검색엔진이 문서 주제를 이해하기 쉬워지고, 검색결과와 공유 화면에서 사용자의 클릭을 유도하는 데 도움이 됩니다.

핵심 답변

title은 페이지의 대표 제목, description은 검색결과에 활용될 수 있는 요약문, OG 태그는 공유 미리보기용 제목·설명·이미지 정보입니다. 세 항목은 서로 비슷하게 작성하되 각 페이지의 실제 콘텐츠와 일치하도록 개별 설정해야 합니다.

이 글에서 확인할 내용
title·description·OG 태그의 역할 차이, 검색결과에 그대로 나오지 않는 이유, 좋은 문구를 작성하는 기준, 자주 발생하는 실수, 그누보드 상세페이지에 적용하는 코드와 최종 점검 방법을 순서대로 정리합니다.

title, description, OG 태그는 어디에 사용될까요?

title

페이지의 대표 제목

브라우저 탭과 검색결과의 제목 후보로 사용됩니다. 각 페이지의 핵심 주제를 가장 분명하게 표현해야 합니다.

description

페이지 내용을 요약하는 설명문

검색결과의 설명문 후보로 활용됩니다. 해당 페이지에서 무엇을 확인할 수 있는지 짧고 구체적으로 알려줍니다.

Open Graph

공유 미리보기 정보

주소를 메신저나 SNS에 공유했을 때 제목, 설명, 대표 이미지를 전달하는 메타 정보입니다.

검색결과와 공유 화면은 비슷해 보여도 참고하는 태그와 노출 목적이 다릅니다.

구분	주요 역할	주요 노출 위치	작성 핵심
title	페이지 대표 제목 전달	브라우저 탭, 검색결과 제목 후보	페이지별 고유성, 핵심 주제, 간결성
meta description	페이지 내용 요약	검색결과 설명문 후보	1~2문장, 실제 내용 요약, 클릭 전 기대 정보
og:title	공유용 제목 전달	메신저·SNS 링크 미리보기	공유 화면에서도 의미가 통하는 제목
og:description	공유용 설명 전달	메신저·SNS 링크 미리보기	핵심 내용과 사용자가 얻는 정보 요약
og:image	공유 대표 이미지 전달	카카오톡·SNS·일부 검색 미리보기	절대주소, 공개 접근 가능, 페이지 주제와 일치

검색결과에 태그 내용이 그대로 나오지 않는 이유

title과 description을 정확하게 입력했는데도 구글이나 네이버 검색결과에서 다른 문구가 보일 수 있습니다. 검색엔진은 태그를 무조건 그대로 출력하는 것이 아니라 검색어, 본문 내용, 대표 제목, 링크 문구 등 여러 정보를 종합해 사용자에게 더 적합하다고 판단한 제목과 설명을 자동으로 선택할 수 있기 때문입니다.

따라서 태그를 작성할 때는 “검색결과에 반드시 이 문장이 그대로 나온다”는 생각보다, 검색엔진과 사용자에게 페이지의 핵심 정보를 일관되게 전달한다는 관점이 필요합니다.

HTML title

페이지에서 설정한 대표 제목입니다.

본문 H1과 주요 내용

실제 화면에 보이는 제목과 문서 내용입니다.

검색엔진의 자동 선택

검색어와 문서의 관련성을 고려해 최종 제목과 설명문이 결정될 수 있습니다.

중요: title, H1, og:title이 서로 전혀 다른 내용을 말하면 검색엔진과 사용자 모두 페이지의 주제를 혼동할 수 있습니다. 문장을 완전히 똑같이 맞출 필요는 없지만 핵심 주제와 표현 방향은 일관되게 유지하는 것이 좋습니다.

title 태그를 제대로 작성하는 방법

title은 검색결과에서 사용자가 가장 먼저 보는 정보입니다. 페이지 내용을 정확하게 설명하면서도 다른 페이지와 구분되는 제목을 작성해야 합니다.

1. 페이지마다 고유한 제목을 작성합니다

회사소개, 제품소개, 블로그 글, 문의 페이지에 동일한 title을 사용하면 검색엔진이 각 페이지의 차이를 이해하기 어렵습니다. 현재 페이지의 주제에 맞는 제목을 각각 설정해야 합니다.

2. 중요한 주제를 제목 앞부분에 배치합니다

브랜드명보다 사용자가 찾는 핵심 주제를 먼저 보여주는 편이 내용을 파악하기 쉽습니다. 브랜드명은 구분 기호와 함께 뒤쪽에 간결하게 넣을 수 있습니다.

좋은 예시
<title>그누보드 홈페이지 SEO 기본 세팅 방법 | 티로그몰</title>

피해야 할 예시
<title>SEO, SEO 최적화, 검색노출, 홈페이지 SEO, 그누보드 SEO</title>

3. 실제 본문 제목과 일치시킵니다

title은 “검색 노출 방법”인데 본문은 회사소개만 있는 식으로 내용이 다르면 신뢰도가 떨어집니다. 화면에 보이는 H1과 본문의 핵심 내용이 title과 같은 주제를 설명해야 합니다.

4. 무리하게 길거나 반복적인 문구를 피합니다

title 자체에 고정된 글자 수 제한은 없지만 검색결과에서는 기기와 화면 폭에 따라 일부가 생략될 수 있습니다. 핵심 주제를 한 번 명확하게 표현하고 키워드를 여러 형태로 반복하지 않는 것이 좋습니다.

고유성, 정확성, 간결성, 본문과의 일치 여부를 함께 확인해야 합니다.

meta description을 제대로 작성하는 방법

description은 페이지 내용을 짧게 소개하는 문장입니다. 검색 순위를 직접 올리는 문구로 생각하기보다, 검색결과를 본 사용자가 이 페이지에서 무엇을 확인할 수 있는지 판단하게 만드는 안내문으로 작성하는 것이 좋습니다.

1. 페이지의 핵심 내용을 1~2문장으로 요약합니다

제목을 그대로 반복하지 말고, 페이지에서 제공하는 정보와 사용자가 얻을 수 있는 내용을 추가로 설명합니다.

<meta name="description" content="그누보드 홈페이지의 title, meta description, OG 태그 역할과 작성 기준, 적용 코드, 중복 태그 점검 방법을 실무 예시로 정리했습니다.">

2. 모든 페이지에 같은 설명을 넣지 않습니다

사이트 전체에 회사 소개 문장 하나를 반복 적용하면 제품 페이지와 블로그 글의 차이가 사라집니다. 메인 페이지는 사이트 전체를 설명하고, 상세페이지는 해당 콘텐츠만 요약해야 합니다.

3. 키워드 목록이 아니라 자연스러운 문장으로 작성합니다

“홈페이지, 홈페이지제작, SEO, 검색노출, 부산홈페이지”처럼 단어만 나열하면 사용자가 내용을 이해하기 어렵습니다. 검색하려는 사람의 질문에 답하는 문장 형태가 더 적합합니다.

4. 검색결과에서 바뀔 수 있다는 점을 고려합니다

검색엔진은 검색어와 본문 문맥에 따라 description 대신 본문 일부를 설명문으로 사용할 수 있습니다. 그렇더라도 정확한 description을 제공하면 페이지 내용을 해석하는 기본 신호가 됩니다.

OG 태그는 검색 태그가 아니라 공유 미리보기 설정입니다

Open Graph 태그는 웹페이지 주소를 메신저나 SNS에 공유할 때 제목, 설명, 이미지, 대표 URL을 전달하기 위한 메타 정보입니다. 검색엔진에서도 참고 정보로 활용될 수 있지만 기본 목적은 공유 화면을 풍부하게 구성하는 것입니다.

OG 태그를 설정하면 링크만 전달해도 제목·설명·대표 이미지가 함께 표시될 수 있습니다.

기본적으로 설정할 OG 태그

<meta property="og:title" content="title, description, OG 태그를 제대로 쓰는 방법">
<meta property="og:description" content="검색결과와 링크 공유 화면에 사용되는 메타태그의 차이와 작성 방법을 확인해 보세요.">
<meta property="og:image" content="https://www.example.com/img/meta-tag-guide.webp">
<meta property="og:url" content="https://www.example.com/meta-tag-guide.php">
<meta property="og:type" content="article">
<meta property="og:image:alt" content="title description OG 태그 설정 안내 이미지">

og:image 작성 시 확인할 점

상대경로가 아니라 https://부터 시작하는 절대주소를 사용합니다.
로그인 없이 외부에서 접근할 수 있는 공개 이미지여야 합니다.
너무 작은 이미지보다 가로형 대표 이미지를 준비하는 것이 좋습니다.
페이지의 실제 주제와 관련된 이미지를 사용합니다.
이미지를 교체한 뒤에도 기존 미리보기가 남으면 해당 서비스의 캐시 갱신 시간이 필요할 수 있습니다.

title과 og:title은 같아야 할까요?

같게 작성해도 문제없습니다. 다만 검색결과용 title에 브랜드명을 포함했다면 og:title은 공유 화면에서 더 자연스럽게 보이도록 핵심 제목만 사용할 수 있습니다. 중요한 것은 두 문구가 같은 페이지 주제를 설명해야 한다는 점입니다.

그누보드 상세페이지에 적용하는 코드 예시

그누보드 테마에서는 공통 head.php가 title을 출력하는 경우가 많습니다. 이때 상세페이지 파일 안에 별도의 <title> 태그를 직접 추가하면 title이 두 번 출력될 수 있으므로, 현재 테마 구조에 맞춰 $g5["title"]과 $config['cf_add_meta']를 사용하는 방식이 안전합니다.

<?php
include('./_common.php');

$g5["title"] = 'title, description, OG 태그를 제대로 쓰는 방법';

$config['cf_add_meta'] = '
<meta name="description" content="페이지 내용을 요약한 고유한 설명문">

<meta property="og:title" content="공유 화면에 표시할 제목">
<meta property="og:description" content="공유 화면에 표시할 설명">
<meta property="og:image" content="https://도메인.com/이미지경로/대표이미지.webp">
<meta property="og:url" content="https://도메인.com/현재페이지.php">
<meta property="og:type" content="article">

<link rel="canonical" href="https://도메인.com/현재페이지.php">';

include_once(G5_PATH . '/head.php');
?>

적용 순서

_common.php를 먼저 불러옵니다. 그누보드 경로와 설정값을 사용할 수 있게 합니다.
head.php보다 앞에서 $g5["title"]을 설정합니다. 공통 헤더가 현재 페이지 제목을 출력할 수 있도록 합니다.
description과 OG 태그를 cf_add_meta에 넣습니다. 공통 head 영역 안에 메타 정보가 출력되도록 합니다.
마지막에 head.php를 불러옵니다. 순서가 바뀌면 설정값이 반영되지 않을 수 있습니다.

테마별 확인 필요: 사용 중인 그누보드 테마가 $config['cf_add_meta']를 실제 head.php에서 출력하는지 먼저 확인해야 합니다. 테마에서 별도의 SEO 플러그인이나 메타태그 출력 기능을 사용 중이라면 같은 태그가 중복 생성되지 않도록 한쪽만 사용하세요.

자주 발생하는 잘못된 설정

1. 모든 페이지의 title과 description이 동일한 경우

사이트 전체가 같은 문서처럼 보일 수 있습니다. 게시글 제목, 제품명, 진료과목 등 페이지별 핵심 정보를 이용해 동적으로 생성해야 합니다.

2. title 태그가 두 개 이상 출력되는 경우

상세페이지에서 직접 title을 넣고 공통 head.php에서도 title을 출력하면 중복될 수 있습니다. 브라우저 개발자 도구나 페이지 소스 보기에서 head 영역을 확인해야 합니다.

3. description을 키워드로만 채운 경우

사용자에게 의미 있는 설명이 되지 못하고 스팸성 문구처럼 보일 수 있습니다. 자연스러운 문장으로 페이지의 실제 내용을 요약해야 합니다.

4. og:image에 상대경로를 사용한 경우

일부 공유 서비스가 이미지를 찾지 못할 수 있습니다. 반드시 도메인을 포함한 절대주소를 입력하는 것이 좋습니다.

5. 테스트 도메인 주소가 남아 있는 경우

개발 주소의 og:url, canonical, og:image가 운영 사이트에 남으면 검색엔진과 공유 서비스가 잘못된 주소를 참조할 수 있습니다. 정식 오픈 전에 운영 도메인으로 일괄 교체해야 합니다.

6. 본문과 전혀 다른 홍보 문구를 넣는 경우

태그의 제목과 설명은 실제 페이지 내용을 정확하게 반영해야 합니다. 과장된 문구나 관련 없는 인기 키워드를 넣는 방식은 피해야 합니다.

페이지 소스에서 최종 확인하는 방법

수정한 뒤에는 관리자 화면만 확인하지 말고 실제 웹페이지의 HTML 소스에서 태그가 정상적으로 한 번씩 출력되는지 확인해야 합니다.

브라우저에서 수정한 상세페이지를 엽니다.
마우스 오른쪽 버튼을 눌러 페이지 소스 보기를 선택합니다.
검색 기능으로 <title>, name="description", property="og:를 찾습니다.
각 태그가 head 안에 있으며 중복 출력되지 않는지 확인합니다.
og:image와 og:url을 새 창에서 열어 실제로 접근되는지 확인합니다.
네이버 서치어드바이저와 구글 서치콘솔에서 재수집 후 반영 상태를 확인합니다.

<head>
  <title>페이지별 고유 제목</title>
  <meta name="description" content="페이지별 고유 설명">
  <meta property="og:title" content="공유용 제목">
  <meta property="og:description" content="공유용 설명">
  <meta property="og:image" content="https://도메인.com/img/대표이미지.webp">
  <meta property="og:url" content="https://도메인.com/현재페이지.php">
</head>

최종 점검 체크리스트

모든 주요 페이지에 title이 하나씩 존재하나요?
각 페이지의 title이 서로 다르고 실제 콘텐츠를 설명하나요?
title에 같은 키워드가 반복되거나 과도한 홍보 문구가 들어가 있지 않나요?
description이 제목 복사가 아닌 1~2문장의 고유한 요약문인가요?
title, H1, og:title이 같은 핵심 주제를 설명하고 있나요?
og:image가 HTTPS 절대주소이며 외부에서 정상적으로 열리나요?
og:url과 canonical이 실제 운영 페이지의 대표 주소와 일치하나요?
테마나 플러그인으로 인해 title·description·OG 태그가 중복 출력되지 않나요?
수정 후 검색엔진과 공유 서비스의 캐시가 갱신될 시간을 고려했나요?

결론: 태그를 많이 넣는 것보다 정확하게 맞추는 것이 중요합니다

title, description, OG 태그는 모두 페이지를 소개하는 정보이지만 사용 목적은 다릅니다. title과 description은 검색결과에서 페이지를 이해하도록 돕고, OG 태그는 링크를 공유할 때 제목·설명·이미지를 전달합니다.

검색 노출을 위해 키워드를 많이 넣는 것보다 페이지별로 고유하고 정확한 제목과 설명을 작성하고, 실제 본문과 같은 주제를 유지하는 것이 더 중요합니다. 특히 그누보드처럼 공통 head.php를 사용하는 홈페이지에서는 태그의 내용뿐 아니라 출력 순서와 중복 여부까지 함께 확인해야 합니다.

홈페이지를 새로 제작하거나 기존 사이트를 리뉴얼했다면 메인 페이지만 점검하지 말고 회사소개, 제품, 게시글, 문의 페이지 등 주요 URL의 title·description·OG 태그가 각각 올바르게 적용되어 있는지 확인해 보세요.

참고한 공식 가이드
Google Search Central의 title link·meta description 가이드, 네이버 서치어드바이저의 콘텐츠 마크업·검색노출 제목 및 설명문 안내, Open Graph Protocol의 기본 메타데이터 규격을 기준으로 작성했습니다.

그누보드 홈페이지의 메타태그를 페이지별로 점검하세요

티로그몰은 그누보드 테마 적용뿐 아니라 검색결과와 링크 공유 화면에서 페이지 정보가 정확하게 전달될 수 있도록 기본 SEO 구조를 함께 확인합니다.

페이지별 title·description 설정
OG 제목·설명·대표 이미지 적용
canonical과 운영 도메인 점검
공통 head.php와 중복 태그 확인

SEO 최적화 글 목록으로 돌아가기