Open Graph 미리보기

OG(Open Graph) 미리보기는 웹페이지 URL을 소셜 미디어에 공유했을 때 어떻게 표시되는지 미리 확인할 수 있는 도구입니다. Facebook이 개발한 Open Graph 프로토콜은 페이지의 제목, 설명, 대표 이미지 등을 정의하며, Facebook, LinkedIn, KakaoTalk, Slack 등 대부분의 플랫폼이 이를 지원합니다. 공유 전에 미리보기를 확인하면 의도한 대로 정보가 표시되는지 검증할 수 있습니다.

시작하기

1. 확인할 웹페이지의 URL을 입력합니다.
2. "분석" 버튼을 클릭하여 해당 페이지의 OG 태그를 가져옵니다.
3. 미리보기 영역에서 각 플랫폼에서의 표시 형태를 확인합니다.
4. 누락되거나 수정이 필요한 태그가 있으면 직접 편집합니다.
5. 수정된 OG 태그 코드를 복사하여 웹페이지에 적용합니다.

기능 소개

• URL 분석: 웹페이지 URL을 입력하면 OG 태그를 자동으로 읽어와 분석합니다.
• 플랫폼별 미리보기: Facebook, Twitter, LinkedIn 등 각 플랫폼에서의 표시 형태를 확인합니다.
• 태그 검증: 필수 OG 태그가 누락되었는지, 값이 올바른지 검사합니다.
• 이미지 확인: og:image로 지정된 이미지의 크기와 비율이 적절한지 확인합니다.
• 실시간 편집: 태그 값을 직접 수정하며 결과를 바로 확인할 수 있습니다.
• 코드 출력: 올바른 OG 태그 코드를 생성하여 복사할 수 있습니다.

주의할 점

• OG 이미지는 1200x630px(비율 1.91:1)이 가장 안정적이며, JPG 또는 PNG 형식이 권장됩니다.
• og:title은 60자 이내, og:description은 155자 이내로 작성하면 대부분의 플랫폼에서 잘리지 않습니다.
• og:url에는 항상 정식(canonical) URL을 사용하여 중복 문제를 방지하세요.
• 소셜 플랫폼은 OG 정보를 캐시하므로 태그 수정 후에는 각 플랫폼의 디버거 도구로 캐시를 새로고침하세요.
• 모든 분석은 브라우저에서 로컬로 수행되므로 입력한 URL이나 데이터가 외부로 전송되지 않습니다.

활용 팁

• 마케팅 캠페인: 소셜 광고나 프로모션 링크를 공유하기 전에 미리보기를 점검합니다.
• 블로그 배포: 새 글을 발행하고 SNS에 공유하기 전에 제목과 이미지가 올바르게 표시되는지 확인합니다.
• 쇼핑몰 상품: 상품 페이지가 공유될 때 상품명, 가격, 이미지가 제대로 나타나는지 검증합니다.
• 웹사이트 리뉴얼: 사이트 개편 후 모든 페이지의 OG 태그가 정상인지 일괄 점검합니다.
• 경쟁사 분석: 다른 사이트의 OG 태그 설정을 참고하여 자사 페이지를 개선합니다.

자주 하는 질문