Open Graph 메타 태그 완전 가이드: 소셜 링크 미리보기의 모든 것
Open Graph 메타 태그는 HTML 페이지의 <head>에 넣는 <meta property="og:…"> 태그입니다. 누군가 여러분의 링크를 Facebook, LinkedIn, Slack, Discord, WhatsApp을 비롯한 대부분의 플랫폼에서 공유할 때 표시되는 제목, 설명, 이미지를 이 태그가 제어합니다. 한 번만 정의해 두면 거의 모든 네트워크가 밋밋한 URL 대신 풍부한 미리보기를 렌더링합니다. X(Twitter)는 자체 Twitter Card 태그를 읽지만, 해당하는 태그가 없으면 Open Graph 태그로 폴백하므로, 잘 구성한 태그 한 세트만으로 링크가 도달할 수 있는 거의 모든 곳을 커버합니다.
이 프로토콜 하나로 링크는 헤드라인과 요약과 1200×630 이미지를 갖춘 미리보기가 되고, 없으면 아무도 클릭하지 않는 맨 URL로 남습니다.
이 가이드는 소셜 공유를 위한 메타 태그 전체를 하나씩 살펴봅니다. 필수 Open Graph 태그 네 개, og:image 크기 규칙, Twitter Card 폴백, 각 플랫폼이 미리보기를 렌더링하고 캐싱하는 방식, 공유를 텅 비게 만드는 실수들, 그리고 배포 후 결과를 디버깅하는 방법까지 다룹니다.
Open Graph 메타 태그란?
Open Graph는 원래 Facebook에서 만들어져 ogp.me에 문서화된 개방형 프로토콜로, 모든 웹 페이지가 자신을 풍부한 객체로 설명할 수 있게 해줍니다. 플랫폼은 여러분의 링크가 무엇에 관한 것인지 추측하는 대신, 몇 개의 태그를 읽어 미리보기 카드로 바꿉니다.
문법은 property 속성과 content 값을 가진 평범한 HTML 메타 태그이며, 문서의 <head> 안에 넣습니다.
<meta property="og:title" content="How Open Graph Tags Work">property 속성에 주목하세요. SEO를 위한 고전적인 HTML 메타 태그(meta description, robots, viewport)는 name을 사용합니다. Open Graph는 property를, 그리고 Twitter Card는 다시 name을 사용합니다. property="og:title"을 기대하는 크롤러는 name="og:title"을 읽지 않습니다.
링크를 카드로 바꾸는 거의 모든 플랫폼이 Open Graph를 읽습니다. Facebook, LinkedIn, Slack, Discord, WhatsApp, Pinterest, Telegram 모두 이 프로토콜을 사용합니다. X는 대표적인 예외입니다. X는 자체 twitter:* 태그를 선호하지만 찾지 못한 항목은 og:* 태그로 폴백하므로, 굳이 중복해서 쓸 필요가 거의 없습니다.
Open Graph는 고전적인 SEO 메타 태그를 대체하는 것이 아니라 그 옆에 나란히 자리합니다. <title>과 canonical 링크는 여전히 검색을 좌우하고, meta description은 여전히 검색 스니펫을 다듬습니다. Open Graph 태그는 순위에 관여하지 않고 소셜 카드를 담당합니다. 완성된 <head>는 대개 이 세 종류를 모두 함께 담고 있습니다.
이런 태그를 손으로 쓰는 일은 반복적이고 미묘하게 틀리기 쉽습니다. Open Graph 메타 태그 생성기는 짧은 양식만으로 블록 전체를 생성하고, 실시간으로 미리보기를 보여주며, 까다로운 세부사항(속성 이름, 절대 URL, 이미지 크기)을 일관되게 유지해 주므로 여러분이 일일이 기억할 필요가 없습니다.
실제로 필요한 핵심 Open Graph 태그
Open Graph는 수십 개의 속성을 정의하지만, 제대로 된 공유에는 몇 개면 충분합니다. 필수 네 개로 시작하고, 설명을 하나 더하고, 대부분의 페이지에서는 거기서 멈추면 됩니다.
필수 태그 네 개: og:title, og:type, og:image, og:url
프로토콜상 네 개의 태그가 필수입니다. 하나라도 빠지면 플랫폼은 카드를 아예 표시하지 않거나 엉성한 추측으로 채웁니다.
<meta property="og:title" content="How Open Graph Tags Work">
<meta property="og:type" content="website">
<meta property="og:image" content="https://example.com/og/cover.png">
<meta property="og:url" content="https://example.com/open-graph-guide">og:title은 카드에 굵게 표시되는 헤드라인입니다. og:type은 객체를 분류합니다(자세한 내용은 아래에서 다룹니다). og:image는 미리보기 그림이며 반드시 절대 HTTPS URL이어야 합니다. og:url은 페이지의 표준(canonical) 주소로, 플랫폼은 이를 이용해 공유를 중복 제거하고 참여 지표를 하나로 모읍니다.
og:description, 그리고 SEO meta description과 다른 점
og:description은 공유 카드에서 제목 아래에 인쇄되는 짧은 요약입니다.
<meta property="og:description" content="A practical guide to og:title, og:image and Twitter Card tags.">이것은 SEO용 <meta name="description">와는 다른 태그이며, 다른 독자를 대상으로 합니다. meta description은 Google 검색 결과 페이지에서 클릭을 두고 경쟁하며 대략 155자를 기준으로 측정됩니다. Open Graph 설명은 소셜 카드에서 읽히는데, 이곳은 공간이 더 빠듯해 첫 문장이 무게를 감당합니다. og:description을 빼면 대부분의 플랫폼이 meta description으로 폴백하므로, 종종 생략해도 됩니다. 소셜용 후킹 문구가 검색 스니펫과 달라야 할 때만 전용으로 하나 작성하세요.
og:type과 그것이 열어주는 것
og:type은 여러분의 페이지가 어떤 종류의 것인지 플랫폼에 알려줍니다. 흔히 쓰는 값은 website, article, product, profile입니다. 홈페이지나 랜딩 페이지는 website이고, 블로그 글은 article입니다.
article을 선택하면 평범한 website 타입으로는 쓸 수 없는 추가 속성과 기능이 열립니다.
<meta property="og:type" content="article">
<meta property="article:published_time" content="2026-07-16T00:00:00Z">
<meta property="article:author" content="Ada Lovelace">이 article:* 태그들은 발행일과 작성자(byline)를 카드에 공급하며, 페이지가 Pinterest Rich Pin 자격을 갖추도록 해줍니다. Rich Pin은 여러분의 Open Graph 마크업에서 구조화된 데이터를 곧바로 가져옵니다. 글에는 og:type을 article로, 그 외 모든 것에는 website로 설정하면 해당하는 필드들이 뒤따라옵니다.
다음은 대부분의 페이지가 실제로 사용하는 태그에 대한 참고 표입니다.
| 태그 | 제어하는 것 | 예시 값 |
|---|---|---|
og:title | 카드에 표시되는 헤드라인 | How Open Graph Tags Work |
og:type | 객체 타입: website, article, product, profile | article |
og:image | 미리보기 이미지(절대 HTTPS URL) | https://example.com/og/cover.png |
og:url | 페이지의 표준 URL | https://example.com/open-graph-guide |
og:description | 제목 아래 요약 | A practical guide to social meta tags. |
og:site_name | 사이트 전체의 이름 | Example |
og:locale | 콘텐츠 언어 및 지역 | en_US |
og:image: 크기, 비율, 그리고 공유를 망치는 규칙들
이미지는 미리보기에서 사람들이 가장 먼저 보는 부분이자, 대부분의 공유가 무너지는 지점입니다. og:image의 크기와 포맷만 제대로 맞추면 파일 하나로 어디서든 통합니다.
1200×630 (1.91:1) 범용 표준
권장 og:image 크기는 1200×630 픽셀, 즉 1.91:1 종횡비입니다. 이 이미지 하나면 Facebook, LinkedIn, Slack, Discord, 그리고 X의 summary_large_image 카드에서 올바르게 렌더링되므로, 플랫폼마다 다른 파일을 준비할 필요가 없습니다.
최소 크기도 중요합니다. Facebook은 200×200보다 작은 이미지를 무시하고, 600×315 미만은 비좁은 정사각형 썸네일로 보여줍니다. 가로 1200 픽셀 아래로 내려가면 큰 카드가 흐릿해 보이기 시작합니다. 1200×630을 목표로 하면 이 모든 기준을 한 번에 통과합니다.
og:image:width와 og:image:height가 중요한 이유
플랫폼이 여러분의 링크를 처음 만날 때는 아직 이미지를 내려받지 않은 상태이며, 이미지는 비동기로 가져옵니다. 크기를 미리 선언해 두면 플랫폼이 알맞은 공간을 확보하고 카드를 즉시 배치할 수 있습니다.
<meta property="og:image" content="https://example.com/og/cover.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:image:alt" content="Open Graph guide cover with the title in large type">이 태그들을 빠뜨리면 페이지의 맨 처음 공유가 크롤러가 따라잡는 동안 텅 빈 채로 렌더링될 수 있습니다. 태그를 넣어 두면 붙여넣는 첫 순간부터 카드가 올바릅니다. og:image:alt 태그는 이를 지원하는 플랫폼에서 스크린 리더를 위해 이미지를 설명합니다.
파일 포맷과 용량
JPG 또는 PNG를 사용하세요. 둘 다 모든 크롤러에서 안정적으로 디코딩되며, 이것이야말로 og:image의 핵심입니다. 여러분이 통제하지 못하는 서버에서도 렌더링되어야 하니까요. 경험칙상 파일은 1 MB 아래로 유지하고, 나머지보다 더 엄격한 WhatsApp용으로는 300 KB 아래로 유지하세요. 내보낸 파일이 더 무겁다면 이미지 압축기에 통과시켜 눈에 띄게 품질을 해치지 않으면서 1 MB 아래로 낮추세요.
여기서 최신 포맷에 손이 가기 쉽지만, 공유 이미지는 예외입니다. 새로운 포맷은 브라우저에서는 용량을 아껴주지만, 일부 소셜 크롤러는 이를 일관되지 않게 디코딩합니다. 그래서 WebP나 AVIF로 만든 og:image는 그것을 읽지 못하는 플랫폼에서 텅 빈 채로 돌아올 수 있습니다. 이 트레이드오프는 WebP vs AVIF vs JPEG — 2026년 어떤 이미지 포맷?에서 다루며, 공유 이미지에 한해서는 JPG 또는 PNG를 고수하세요. 플랫폼마다 가장자리를 다르게 잘라내므로, 로고와 헤드라인은 가운데의 1080×600 안전 영역 안에 두어 중요한 것이 잘리지 않도록 하세요.
절대 HTTPS URL 규칙
og:image와 og:url은 상대 경로가 아니라 완전한 https://… URL이어야 합니다. /cover.png 같은 경로는 편집기와 실제 페이지에서는 잘 해석되지만, 여러분의 URL을 가져오는 크롤러에게는 이를 해석할 기준(base)이 없어서 공유가 비어서 돌아옵니다. 이미지는 또한 공개적으로 접근 가능해야 합니다. robots.txt가 크롤러를 막거나 파일이 인증 뒤에 있으면 미리보기는 빈 채로 남습니다.
위의 모든 것을 좌우하는 제약이 하나 더 있습니다. 크롤러는 JavaScript를 실행하지 않습니다. Facebook, LinkedIn, WhatsApp, Telegram, Discord는 여러분의 원본 HTML을 가져와 그 안에 있는 것을 읽습니다. 프레임워크가 페이지 로드 후 클라이언트 측에서 주입한 태그는 그들에게 보이지 않으므로, Open Graph 태그는 서버에서 렌더링되거나 정적인 HTML 안에 있어야 합니다.
Twitter/X 카드: 태그 하나, 나머지는 Open Graph로 폴백
X는 자체 Twitter Card 메타 태그를 사용하지만, Open Graph와 겹치는 부분이 많아 예상보다 훨씬 적게 작성하게 됩니다. 실제로는 태그 하나만 추가하고 나머지는 폴백에 맡깁니다.
twitter:card, 유일한 필수 Twitter 태그
완전한 Open Graph 태그 세트를 갖추고 있어도, twitter:card가 없으면 X는 카드를 전혀 렌더링하지 않습니다. 이것이 유일하게 필수인 Twitter Card 태그입니다.
<meta name="twitter:card" content="summary_large_image">값이 레이아웃을 결정합니다. summary_large_image는 1200×630 이미지에 맞춘 큰 배너 카드이고, summary는 텍스트 옆에 작은 정사각형 썸네일이 붙은 간결한 카드입니다.
<meta name="twitter:card" content="summary">name 속성에 주목하세요. Twitter Card 태그는 Open Graph가 쓰는 property가 아니라 name을 사용합니다.
X가 제목, 설명, 이미지를 og:*로 폴백하는 방식
제목, 설명, 이미지의 경우, 해당하는 twitter:* 태그가 없으면 X는 여러분의 og:title, og:description, og:image를 읽습니다. 바로 이 때문에 twitter:title이나 twitter:image를 굳이 쓸 일이 거의 없습니다. twitter:card를 설정하고 Open Graph 태그를 깔끔하게 유지하면, X가 그것들로 카드를 조립합니다.
빈 twitter:image 함정
이 폴백에는 날카로운 모서리가 하나 있습니다. 빈 태그도 존재하는 것으로 간주된다는 점입니다. twitter:image를 빈 값으로 내보내면 X는 og:image로 폴백하는 대신 그 빈 값을 사용하고, 카드는 그림을 잃습니다.
<!-- Wrong: blocks the fallback and leaves the card imageless -->
<meta name="twitter:image" content="">
<!-- Right: omit the tag entirely and X reads og:image -->규칙은 간단합니다. 빈 소셜 태그는 절대 출력하지 마십시오. 값이 없으면 태그를 빼세요.
Slack과 Discord의 특이점
Slack은 Twitter Card를 먼저 읽고 그다음 Open Graph를 읽으며, twitter:label과 twitter:data를 통해 두 개의 추가 필드를 노출할 수 있습니다.
<meta name="twitter:label1" content="Reading time">
<meta name="twitter:data1" content="11 minutes">
<meta name="twitter:label2" content="Written by">
<meta name="twitter:data2" content="Ada Lovelace">이것들은 Slack 언펄(unfurl) 아래에 작은 라벨이 붙은 세부 정보로 나타납니다. Discord는 Open Graph를 읽고, 다른 플랫폼에는 없는 동작을 하나 더합니다. 페이지의 theme-color로 임베드 왼쪽 강조 막대에 색을 입힙니다.
<meta name="theme-color" content="#5865F2">각 플랫폼에서 링크 미리보기가 렌더링되는 방식
같은 태그라도 누가 읽느냐에 따라 서로 다른 소셜 미디어 링크 미리보기를 만들어냅니다. 각 플랫폼은 자기만의 태그 부분집합을 고르고, 자기만의 기간 동안 캐싱하며, 한두 가지 특이한 동작을 더합니다. 다음 표가 빠른 참고 자료입니다.
| 플랫폼 | 읽는 태그 | 캐시 | 주목할 동작 |
|---|---|---|---|
| Open Graph | ~30일 | 200×200 미만 이미지는 무시, 600×315 미만은 작은 정사각형으로 표시 | |
| Open Graph | ~7일 | Post Inspector로 오래된 미리보기 제거 | |
| X (Twitter) | twitter:card + og:*로 폴백 | 짧음 | twitter:card가 없으면 카드도 없음 |
| Slack | Twitter Card, 그다음 Open Graph | 메시지별 | twitter:label/twitter:data를 추가 필드로 렌더링 |
| Discord | Open Graph | 메시지별 | 임베드 강조 막대에 theme-color 사용 |
og:title + og:image | 메시지별 | 메타데이터를 상단 가까이에 원함, 이미지는 300 KB 아래로 유지 | |
| Telegram | Open Graph | 메시지별 | JPEG 또는 PNG에서만 안정적으로 렌더링 |
| Open Graph 또는 Schema.org | — | Article Rich Pin에는 og:type=article 필요 |
캐시 열은 흔한 놀라움을 설명해 줍니다. 태그를 고치고 다시 공유했는데도 Facebook이 몇 주 동안 예전 제목을 계속 보여주는 상황 말입니다. Facebook은 Open Graph 데이터를 약 30일, LinkedIn은 약 7일 동안 보관하므로, 수정 사항은 캐시가 만료되거나 여러분이 강제로 새로고침하기 전까지 나타나지 않습니다. 아래의 디버거들이 바로 그 일을 해줍니다.
흔한 Open Graph 실수(그리고 잡아내는 법)
깨진 미리보기의 대부분은 짧은 목록의 오류로 거슬러 올라갑니다. 하나같이 로컬에서는 멀쩡해 보이다가, 크롤러가 실제 페이지를 가져올 때에야 실패합니다.
상대 경로 og:image
상대 경로는 여러분의 브라우저에서는 렌더링되지만 공유하면 깨집니다. 크롤러에게는 이를 해석할 기준 URL이 없기 때문입니다.
<!-- Blank when shared -->
<meta property="og:image" content="/cover.png">
<!-- Renders everywhere -->
<meta property="og:image" content="https://example.com/cover.png">og:url 누락, 또는 canonical과 어긋나는 경우
og:url이 없으면 공유 수와 참여 지표가 URL 변형들(www 유무, 추적 파라미터 유무, 끝의 슬래시 유무)에 걸쳐 흩어집니다. canonical 링크와 og:url을 똑같은 하나의 URL로 가리키게 해서 신호가 한데 모이도록 하세요.
너무 작은 이미지 또는 잘못된 종횡비
200×200 미만 이미지는 아예 무시되고, 1.91:1에서 크게 벗어난 이미지는 의도하지 않은 방식으로 잘립니다. 1200×630으로 내보내면 모든 플랫폼에서 구도가 예측 가능해집니다.
twitter:card 빠뜨리기
Open Graph 태그를 완전히 갖춰도 twitter:card가 없으면 X에서는 여전히 카드가 나오지 않습니다. 이것이 링크가 LinkedIn에서는 멋지게 보이는데 X에서는 아무것도 안 보이는 가장 흔한 이유입니다.
크롤러가 볼 수 없는 클라이언트 측 렌더링 태그
싱글 페이지 앱이 로드 후에 Open Graph 태그를 주입하면, JavaScript를 실행하지 않는 크롤러는 그 태그를 끝내 보지 못합니다. 태그를 서버 측에서 렌더링하거나 HTML을 사전 렌더링하세요.
첫 1024바이트 이후에 놓인 charset
<meta charset="utf-8"> 선언은 문서의 첫 1024바이트 안에 나타나야 하며, 그렇지 않으면 브라우저가 이를 무시해 제목과 설명에 있는 비-ASCII 문자를 깨뜨릴 수 있습니다. <head> 안에서 맨 앞에 두세요.
<head>
<meta charset="utf-8">
<!-- everything else follows -->
</head>Open Graph 태그를 테스트하고 디버깅하는 방법
실제 URL에 대해 검증하지 않은 미리보기는 절대 믿지 마십시오. 세 가지 도구가 중요한 플랫폼들을 커버하며, 모두 캐시를 강제로 새로고침할 수 있습니다.
Facebook Sharing Debugger
Facebook Sharing Debugger는 여러분의 실제 URL을 가져와 Facebook이 정확히 무엇을 파싱했는지 보여주고, 누락되었거나 형식이 잘못된 태그를 나열합니다. 가장 유용한 버튼은 “Scrape Again”으로, Facebook의 약 30일 캐시를 원할 때 새로고침해 줍니다. 한 달을 기다리지 않고 수정 사항을 나타나게 하는 가장 빠른 방법입니다.
LinkedIn Post Inspector
LinkedIn Post Inspector는 LinkedIn에 대해 같은 일을 합니다. URL을 붙여넣으면 페이지를 다시 가져오고 LinkedIn의 약 7일 캐시를 비우므로, 업데이트한 제목이나 이미지가 며칠 뒤가 아니라 다음 공유에서 바로 나타납니다.
X 카드 검증은 개발자 포털로 이동했습니다
X는 독립형 Card Validator를 폐지했습니다. 2026년 기준으로 카드 검증은 공개 URL이 아니라 X 개발자 포털 안에 자리합니다. 그래서 대부분의 팀은 다른 방식으로 X 카드를 확인합니다. X가 og:*로 폴백하기 때문에 Facebook과 LinkedIn 디버거가 X가 읽을 태그를 이미 확인해 주며, twitter:card 레이아웃 자체는 서드파티 미리보기 도구가 빈틈을 메워 줍니다.
배포하기 전에 미리보기
디버거는 이미 라이브 상태인 URL만 검사할 수 있는데, 텅 빈 이미지를 발견하기에는 좋지 못한 시점입니다. 아직 편집하는 동안 카드를 미리 보세요. Open Graph 메타 태그 생성기는 여러분이 입력한 값으로 Google, Facebook, X, LinkedIn, Slack, Discord 미리보기를 렌더링하고, 브라우저에서 og:image의 실제 크기를 읽어 잘못된 비율을 잡아내며, 기존 <head>를 가져올 수 있어 공유가 배포되기 전에 깨진 부분을 진단할 수 있습니다.
빠른 체크리스트
다음은 모든 페이지가 최소한 담아야 할 내용입니다. 복사해서 여러분의 값으로 바꾸면, 어디서나 렌더링되는 미리보기를 갖게 됩니다.
<meta charset="utf-8">
<title>Your page title</title>
<meta name="description" content="Your 150-character summary.">
<link rel="canonical" href="https://example.com/page">
<meta property="og:title" content="Your page title">
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com/page">
<meta property="og:image" content="https://example.com/og/page.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:description" content="Your 150-character summary.">
<meta name="twitter:card" content="summary_large_image">배포하기 전에 핵심 사항을 점검하세요. 1200×630의 절대 HTTPS og:image, canonical과 일치하는 og:url, twitter:card 존재, 그리고 서버 측에서 렌더링된 태그입니다. 이 작업을 빠르게 해주는 유틸리티를 더 폭넓게 둘러보고 싶다면, 인코딩·해싱 필수 개발자 도구 온라인 가이드가 나머지를 모아 두었습니다. 블록 전체를 한 번에 생성하고 미리 볼 준비가 되었다면, Open Graph 메타 태그 생성기가 이를 작성하고 검사하며 배포하기 전에 모든 카드를 보여줍니다.
자주 묻는 질문
Open Graph 태그와 Twitter Card 태그의 차이는 무엇인가요?
Open Graph는 Facebook, LinkedIn, Slack 등이 읽는 크로스 플랫폼 프로토콜이고, Twitter Card 태그(twitter:*)는 X 전용입니다. X는 해당하는 twitter:* 태그가 없을 때 여러분의 OG 태그로 폴백하므로, 보통은 OG 태그에 twitter:card 값 하나만 더하면 됩니다.
Open Graph 태그가 Google 검색 순위에 영향을 주나요?
아닙니다. Open Graph와 Twitter Card 태그는 Google 순위에 영향을 주지 않습니다. 이 태그들은 링크가 공유될 때 어떻게 보이는지를 제어해 소셜 트래픽을 이끌 뿐입니다. SEO에는 고전적인 <title>과 canonical 태그가 중요하고, meta description은 스니펫과 클릭률을 다듬지만 직접적인 순위 요인은 아닙니다.
Open Graph 태그는 HTML 어디에 넣나요?
<head> 요소 안, 서버에서 렌더링되거나 정적인 HTML에 넣습니다. Facebook, LinkedIn, WhatsApp, Telegram 크롤러는 JavaScript를 실행하지 않으므로 클라이언트 측에서 주입한 태그는 보이지 않습니다. <meta charset>을 맨 앞에 두어 첫 1024바이트 안에 들어가게 하세요.
이미지 하나로 Facebook, X, LinkedIn을 모두 커버할 수 있나요?
그렇습니다. 1200×630 (1.91:1) 이미지 하나면 Facebook, LinkedIn, Slack, Discord, 그리고 X의 summary_large_image 카드에서 올바르게 렌더링됩니다. 공개 URL에서 HTTPS로 제공하고 og:image:width/og:image:height를 선언해 첫 공유가 비어 보이지 않게 하세요.
링크 미리보기에 이미지가 안 나오는 이유는 무엇인가요?
흔한 원인은 다음과 같습니다. 절대 HTTPS URL 대신 상대 경로로 쓴 og:image, 200×200 미만의 이미지, X에서의 twitter:card 누락, 또는 크롤러가 실행할 수 없는 JavaScript로 주입한 태그입니다. 고친 뒤 Facebook Sharing Debugger로 다시 스크랩하세요.
모든 페이지에 각자의 Open Graph 태그가 필요한가요?
이상적으로는 그렇습니다. 각 페이지에는 그 특정 페이지를 반영하는 og:title, og:description, og:image, 그리고 canonical og:url이 있어야 공유된 링크가 관련성 있는 미리보기를 보여줍니다. 사이트 전체 공통 폴백이 없는 것보다는 낫지만, 페이지별 태그가 훨씬 더 많은 소셜 클릭을 얻어냅니다.