Developer SEO Utility
Open Graph 이미지 미리보기
제목, 설명, URL, 대표 이미지 주소를 입력하면 카카오톡·페이스북·트위터 공유 카드 형태를 미리 확인하고 OG/Twitter meta 태그를 생성할 수 있습니다.
Open Graph 정보 입력
공유 미리보기에 사용할 제목, 설명, URL, 대표 이미지 정보를 입력하세요.
0/60자 권장
0/150자 권장
og:url과 twitter:url에 사용됩니다.
og:image와 twitter:image에 사용됩니다.
og:site_name에 사용됩니다.
공유 콘텐츠 유형입니다.
공유 미리보기
플랫폼별로 공유 카드가 어떻게 보일지 확인하세요.
공유 설명이 표시됩니다.
win-j.com공유 설명이 표시됩니다.
공유 설명이 표시됩니다.
https://example.com/page/생성 결과
아래 코드를 HTML head 영역에 추가하면 됩니다.
정보를 입력한 뒤 OG 태그 생성하기 버튼을 눌러주세요.
Open Graph 점검 항목
공유 미리보기 품질은 제목, 설명, 이미지, 대표 URL 설정에 따라 달라집니다.
공유 카드의 핵심 제목입니다. 너무 길면 잘릴 수 있으므로 짧고 명확하게 작성하는 것이 좋습니다.
공유 카드 설명 영역에 표시됩니다. 페이지 내용을 간결하게 요약하면 클릭률 개선에 도움이 됩니다.
링크 공유 시 가장 크게 보이는 이미지입니다. 1200×630px 가로형 썸네일을 권장합니다.
도움말
Open Graph Preview란?
Open Graph Preview는 링크를 카카오톡, 페이스북, 트위터 등에 공유했을 때 표시되는 카드 미리보기를 확인하고 meta 태그를 생성하는 개발자 SEO 유틸리티입니다.
블로그 글, 유틸리티 페이지, 랜딩페이지, 상품 페이지의 공유 제목·설명·대표 이미지가 어떻게 보이는지 점검할 수 있습니다.
권장 OG 이미지 크기
- 권장 비율: 1.91:1 가로형 이미지
- 예시 크기: 1200 × 630px
- 중요한 텍스트는 이미지 중앙 영역에 배치하는 것이 좋습니다.
- 이미지 URL은 외부에서 접근 가능한 절대 URL을 사용하는 것이 좋습니다.
Open Graph 태그는 SEO에 직접 영향을 주나요?
Open Graph 태그는 검색 순위 자체보다 SNS와 메신저 공유 미리보기 품질에 더 직접적인 영향을 줍니다. 공유 카드의 제목, 설명, 이미지가 명확하면 사용자가 링크를 클릭할 가능성이 높아질 수 있습니다.
카카오톡에서 이미지가 바로 바뀌지 않는 이유는 무엇인가요?
카카오톡이나 SNS는 한 번 수집한 OG 정보를 캐시할 수 있습니다. 이미지를 수정했는데 바로 반영되지 않는다면 각 플랫폼의 공유 디버거에서 캐시를 갱신해야 합니다.
og:image는 상대 경로로 작성해도 되나요?
가능하면 https://로 시작하는 절대 URL을 사용하는 것이 좋습니다. 상대 경로는 일부 플랫폼에서 이미지를 제대로 수집하지 못할 수 있습니다.
Twitter Card 태그도 꼭 필요한가요?
Open Graph 태그만으로도 많은 플랫폼에서 미리보기가 표시되지만, X/Twitter 공유 품질까지 고려한다면 twitter:card, twitter:title, twitter:description, twitter:image 태그를 함께 넣는 것이 좋습니다.
생성된 태그는 어디에 넣어야 하나요?
생성된 meta 태그는 HTML 문서의 head 영역에 추가하면 됩니다. Django 템플릿에서는 base template의 meta block 또는 각 페이지별 SEO block에 넣어 관리할 수 있습니다.