개발자
🖼️ OG 미리보기 시뮬레이터
카카오톡·페이스북·X·LinkedIn·Slack에서 공유했을 때 어떻게 보일지 한 화면에. 메타태그 검증 + 코드 생성까지.
본 도구는 참고용입니다
- 입력값·환경에 따라 결과가 달라질 수 있으며 정확성을 보장하지 않습니다.
- 중요한 의사결정에는 전문가 조언을 받으세요.
- 미리보기는 실제 카드에 가깝게 시뮬레이션한 결과이며, 각 플랫폼의 알고리즘·캐시 정책에 따라 다르게 표시될 수 있습니다. 카카오톡은 한번 캐시되면 약 48시간 유지되므로 변경 후 카카오톡 캐시 초기화 도구에서 새로고침 권장.
ⓘ 서버를 통해 페이지를 받아와 메타태그를 추출합니다. 일부 사이트는 봇 차단으로 실패할 수 있으니, 그럴 땐 HTML 붙여넣기 모드를 사용하세요.
📋 위 입력칸에 URL이나 HTML을 넣으면 5개 플랫폼 미리보기가 표시됩니다
지원: 🇰🇷 카카오톡 · Facebook · X(Twitter) · LinkedIn · Slack
Open Graph(OG) — 한 줄 요약
Open Graph는 2010년 Facebook이 만든 메타데이터 규약으로, URL이 공유될 때 어떤 카드로 표시될지를 페이지 작성자가 직접 지정할 수 있게 합니다. 카카오톡·Facebook·LinkedIn·Slack·Discord는 모두 OG 태그를 따르고, X(Twitter)만 자체 twitter:* 태그를 우선 참조(없으면 OG로 폴백).
- og:title — 카드 헤드라인 (필수)
- og:description — 카드 본문 (권장)
- og:image — 카드 썸네일 (필수, 1200×630 권장)
- og:url — 페이지 canonical URL
- og:site_name — 사이트 이름 (카드 하단 도메인 영역에 표시)
- og:type — website / article / video.movie 등
- og:locale — ko_KR 등 언어 코드
🇰🇷 카카오톡 OG 가이드 — 가장 까다로움
한국에서 가장 중요한 공유 채널이면서 가장 까다로운 곳이 카카오톡입니다. 다음 규칙을 모르면 카드가 표시되지 않거나 깨집니다.
이미지 비율
2:1 또는 1.91:1
1200×630px 권장. 정사각 1:1은 작게 표시.
이미지 용량
5MB 이하
jpg / png / webp 권장. gif는 첫 프레임만.
캐시
약 48시간
한 번 캐싱되면 변경이 반영 안 됨 — 캐시 초기화 도구 필수.
HTTPS 필수
http는 무시
og:image도 https URL이어야 표시.
문자 인코딩
UTF-8
한글 깨짐 방지 — Content-Type charset 명시.
리다이렉트
직접 URL 권장
단축 URL·리다이렉트 체인은 카드 표시 실패 사례 많음.
💡 메타태그 수정 후 즉시 반영하려면 developers.kakao.com/tool/clear/og 에서 캐시를 초기화하세요(URL 입력 → 조회 → 캐시 삭제).
플랫폼별 카드 차이 한눈에
| 플랫폼 | 이미지 비율 | 캐시 | 특이사항 |
|---|---|---|---|
| 🇰🇷 카카오톡 | 2:1 (1200×630) | 48시간 | HTTPS·og 태그만, 캐시 초기화 도구 필수 |
| 1.91:1 | 24시간~ | Sharing Debugger로 강제 새로고침 가능 | |
| X (Twitter) | 2:1 또는 1:1 | 7일 | twitter:card 별도 — summary_large_image 권장 |
| 1.91:1 | 7일 | Post Inspector로 캐시 초기화 | |
| Slack | 제한 없음 | 1시간 | unfurl_links 옵션 영향, 봇 정책 적용 |
| Discord | 카드 형태 다양 | 재요청 시 | embed.color 등 추가 옵션 지원 |
자주 묻는 질문 (FAQ)
Q1. 메타태그를 수정했는데 카카오톡 카드가 그대로예요.
카카오톡은 URL당 약 48시간 캐시가 적용됩니다. 카카오 개발자 도구의 "공유 디버거" 또는 "캐시 삭제" 메뉴에 URL을 넣고 캐시를 갱신하세요. Facebook은 Sharing Debugger, X는 Card Validator(deprecated 됐으나 일부 동작), LinkedIn은 Post Inspector를 사용합니다.
Q2. og:image는 어느 크기·비율이 가장 안전한가요?
1200×630px (2:1)이 가장 보편적입니다. Facebook 권장 1.91:1, 카카오톡 2:1, X 2:1(summary_large_image) — 1200×630 한 장이면 모든 플랫폼에서 잘립니다 없이 표시됩니다. 파일 형식은 jpg(사진) 또는 png(텍스트·로고), 용량은 5MB 이하 권장. 절대 URL(https://example.com/og.png)을 사용해야 하며 상대 경로는 일부 플랫폼에서 표시 실패합니다.
Q3. URL 입력 모드에서 "페이지를 불러올 수 없다"고 나옵니다.
대상 서버가 봇/스크래퍼를 차단했거나(쿠팡·일부 쇼핑몰), Cloudflare 등 WAF가 우리 요청을 막은 경우입니다. HTML 붙여넣기 모드로 전환해 브라우저 페이지 소스(Cmd+U / Ctrl+U)의 <head> 부분을 복사해 붙여넣으면 동일하게 동작합니다.
Q4. twitter:card는 꼭 따로 넣어야 하나요?
X(Twitter)는 twitter:* 태그를 우선 사용하며, 없으면 og:*로 폴백합니다. 다만 twitter:card 선언이 없으면 카드 표시 자체가 안 되는 경우가 있으므로 <meta name="twitter:card" content="summary_large_image"> 한 줄은 필수에 가깝습니다. summary_large_image는 큰 이미지 카드, summary는 작은 정사각 썸네일 카드.
Q5. og:image에 동적 이미지(서버에서 생성)를 써도 되나요?
됩니다. Next.js의 opengraph-image.tsx, Vercel OG, Cloudflare Workers의 OG 이미지 생성 등이 흔합니다. 단 응답 속도 < 3초, Cache-Control 적용, 안정적인 도메인 사용은 필수. 카카오톡은 응답이 느리면 캐시 갱신을 포기하고 빈 카드를 보여줍니다.
Q6. 같은 페이지를 SNS별로 다르게 보이게 할 수 있나요?
가능합니다. og:*는 공통 폴백으로 두고, twitter:title·twitter:description·twitter:image를 별도 지정하면 X에서만 다른 카드가 표시됩니다. Slack은 og:site_name이 큰 영향을 미치므로 브랜드명 명시 권장. LinkedIn은 og:type=article일 때 더 풍부한 카드를 보여줍니다.
Q7. 검색엔진(SEO)에는 OG 태그가 영향을 미치나요?
직접적인 검색 순위 영향은 없지만, 간접 효과는 큽니다. SNS 공유 → 카드가 매력적 → 클릭률 ↑ → 트래픽 ↑ → 백링크 자연 발생. Google은 title·meta description을 우선 보지만, 일부 검색 결과(Discover 등)에서는 og:image를 썸네일로 사용하므로 둘 다 정성껏 작성하세요.
Q8. 검색이 안 되는 사이트에서도 메타태그가 보이나요?
검색 노출 여부와 OG는 무관합니다. robots.txt나 noindex 메타로 검색은 차단해도, SNS 공유 카드는 정상 표시됩니다. 반대로 검색은 잘 되는데 OG 카드가 비어 있는 경우도 많으니 — 이 도구로 한 번 확인하시는 게 좋아요.