OG 태그 미리보기 - Open Graph 메타 태그 검사기
Open Graph 및 Twitter 카드 값을 입력하여 소셜 미디어 미리보기를 실시간으로 확인하세요. 바로 사용할 수 있는 메타 태그 코드를 즉시 생성할 수 있습니다.
Open Graph 메타 태그란 무엇인가요?
Open Graph (OG) 메타 태그는 Facebook, Twitter, LinkedIn, Discord와 같은 소셜 미디어 플랫폼에서 웹 페이지가 공유될 때 표시되는 방식을 제어하는 HTML 메타 요소입니다. 소셜 미디어 미리보기 카드에 나타나는 제목, 설명, 이미지 및 URL을 정의합니다. 올바르게 구성된 OG 태그는 소셜 공유의 클릭률을 크게 향상시킬 수 있습니다.
FreeToolbox OG 태그 미리보기 도구 사용 방법
- OG 값 입력 — og:title, og:description, og:image URL, og:url, og:type 및 og:site_name을 입력하세요.
- Twitter 카드 태그 추가 — 선택적으로 Twitter/X 카드의 제목, 설명 및 이미지를 재정의하세요.
- 실시간 미리보기 확인 — Facebook, Twitter, LinkedIn, Discord에서 페이지가 어떻게 보이는지 정확하게 확인하세요.
- 생성된 코드 복사 — 코드 복사를 클릭하여 페이지에 붙여넣을 준비가 된 HTML 메타 태그를 얻으세요.
FreeToolbox OG 태그 미리보기 도구를 사용해야 하는 이유
- 4가지 플랫폼 미리보기 — Facebook, Twitter/X, LinkedIn 및 Discord 미리보기를 동시에 확인하세요.
- 실시간 업데이트 — 입력하는 대로 미리보기가 즉시 업데이트되므로 페이지를 다시 로드할 필요가 없습니다.
- 코드 생성 — 올바른 형식의 메타 태그 HTML 코드를 자동으로 생성합니다.
- Twitter 카드 지원 — Twitter 전용 재정의 (twitter:title, twitter:image 등)를 위한 별도 필드를 제공합니다.
- 서버 불필요 — 모든 것이 브라우저에서 실행됩니다. 어떤 데이터도 서버로 전송되지 않습니다.
- 크기 지침 — 최적의 이미지 크기 (1200x630px)에 대한 기본 제공 권장 사항을 제공합니다.
FreeToolbox vs 다른 OG 미리보기 도구
| 기능 | FreeToolbox | OpenGraph.xyz | MetaTags.io |
|---|---|---|---|
| 플랫폼 | 4 (FB, TW, LI, DC) | 3 (FB, TW, LI) | 3 (Google, FB, TW) |
| 실시간 미리보기 | 예 | 예 | 예 |
| 코드 생성 | 예 | 예 | 예 |
| Discord 미리보기 | 예 | 아니요 | 아니요 |
| 계정 불필요 | 예 | 예 | 무료 티어 제한 |
| 광고 | 최소 | 보통 | 많음 |
자주 묻는 질문
권장되는 og:image 크기는 얼마인가요?
권장 크기는 1200 x 630 픽셀 (1.91:1 가로 세로 비율)입니다. 이는 Facebook, Twitter, LinkedIn 및 Discord에서 잘 작동합니다. PNG 또는 JPG 형식을 사용하고 파일 크기를 8MB 미만으로 유지하세요.
이 도구가 URL에서 OG 태그를 가져올 수 없는 이유는 무엇인가요?
브라우저 보안 (CORS 정책)으로 인해 JavaScript가 다른 도메인에서 콘텐츠를 가져올 수 없습니다. 이 도구는 수동 입력을 대신 사용하며, 이는 게시하기 전에 태그를 미리 보기에 훨씬 좋습니다.
OG 태그와 Twitter 카드 태그가 모두 필요한가요?
Twitter/X는 Twitter 전용 태그가 없는 경우 OG 태그로 대체됩니다. 그러나 카드 유형을 제어하려면 twitter:card를 추가하는 것이 좋습니다. Twitter와 다른 플랫폼에서 다른 콘텐츠를 원하는 경우에만 Twitter 전용 태그를 사용하세요.
어떤 og:type을 사용해야 하나요?
홈페이지 및 일반 페이지에는 'website'를 사용하고, 블로그 게시물 및 뉴스에는 'article'을 사용하고, 제품 페이지에는 'product'를 사용하세요. 기본값인 'website'는 대부분의 경우에 적합합니다.
실제 라이브 OG 태그를 어떻게 테스트하나요?
페이지에 메타 태그를 추가한 후 Facebook 공유 디버거 (developers.facebook.com/tools/debug), Twitter 카드 유효성 검사기 및 LinkedIn 게시물 검사기를 사용하여 태그가 올바르게 작동하는지 확인하세요.