Open Graph 미리보기

제목, 설명, URL, 이미지를 먼저 정리한 뒤, 소셜 플랫폼이나 메신저에서 공유될 때 카드가 어떻게 보일지 게시 전에 확인할 수 있습니다.

Open Graph 항목

왼쪽에서 metadata 를 수정하면 오른쪽 카드 미리보기와 복사용 meta 태그가 즉시 업데이트됩니다.

짧고 명확하게 유지하는 것이 좋습니다. 많은 플랫폼은 약 60~90자 부근부터 제목을 잘라냅니다.
긴 문장 하나에 여러 포인트를 넣기보다 핵심을 한 문장으로 정리하는 편이 좋습니다.
전체 URL 이나 도메인만 입력해도 됩니다. 출력 전에 정규화됩니다.

생성된 Meta 태그

확인 후 페이지 head 나 CMS SEO 입력란에 바로 붙여 넣을 수 있습니다.

실시간 미리보기

넓은 카드와 컴팩트 카드를 함께 보면서 다양한 공유 상황에서 가독성을 확인할 수 있습니다.

제목 글자 수 0
설명 글자 수 0
이미지 상태
  1. 게시하려는 제목, 설명, 사이트 이름, canonical URL, 이미지 URL 을 입력합니다.
  2. 큰 카드와 컴팩트 카드가 동시에 바뀌는 모습을 보며 같은 metadata 가 서로 다른 공유 상황에서도 읽기 쉬운지 확인합니다.
  3. 글자 수 카운터로 제목과 설명이 너무 길지 않은지 확인해 소셜 플랫폼이나 메신저에서 너무 빨리 잘리는 것을 줄일 수 있습니다.
  4. 아직 방향을 정하지 못했다면 먼저 예시를 적용한 뒤, 자신의 실제 문구로 바꿔가며 다듬을 수 있습니다.
  5. 카드가 잘 보이면 생성된 meta 태그를 복사해 페이지 head, CMS SEO 입력란, 템플릿 시스템에 붙여 넣으세요.

팁: 이 도구는 일반적인 카드 형태를 재현하지만, 실제 자르기 방식, 캐시, 문장 생략은 플랫폼마다 다릅니다. 게시 전 QA 단계로 사용하는 것이 가장 적절합니다.

언제 이 도구를 사용하나요?

랜딩 페이지, 기사, 제품 페이지, 캠페인 링크 등을 게시하기 전에 Open Graph 정보가 공유 시 깔끔하고 매력적으로 보이는지 확인하고 싶을 때 유용합니다.

실제 페이지의 metadata 를 자동으로 불러오나요?

아니요. 이 버전은 클라이언트 사이드 전용입니다. 실제 페이지가 아직 없어도 시험해 보고 싶은 값을 직접 입력해 공유 카드를 미리 확인할 수 있습니다.

최종 공유 카드가 여기와 조금 다르게 보일 수 있는 이유는 무엇인가요?

플랫폼마다 자체 캐시, 이미지 크롭, 텍스트 생략 규칙이 있기 때문입니다. 이 도구는 큰 가독성 문제를 미리 찾는 데 적합하지만, 최종 렌더링은 플랫폼이 결정합니다.

og:title 과 페이지 title 은 꼭 같아야 하나요?

반드시 같을 필요는 없습니다. 많은 팀이 SEO 중심의 페이지 title 을 유지하면서, 공유용으로는 더 짧고 전달력이 높은 og:title 을 별도로 작성합니다.

og:image:alt 는 꼭 넣는 것이 좋나요?

가능하면 넣는 것이 좋습니다. 접근성 측면뿐 아니라 기사나 캠페인 자산의 metadata 관리를 더 꼼꼼하게 하는 데도 도움이 됩니다.

어떤 페이지 유형에 적합한가요?

기사, 제품 페이지, 캠페인 페이지, 브랜드 소개 페이지, 프로필 페이지에 적합합니다. 콘텐츠 유형을 전환해 해당하는 Open Graph 태그를 만들 수 있습니다.

QR코드 단축 URL 링크 공유
2026-04-08

QR코드 × 단축 URL:학생들이 도구에 즉시 연결되는 두 가지 방법

타이머, 룰렛, 점수판 모두 준비됐는데 학생들은 어떻게 자신의 기기에서 접속할까요? QR코드 생성기와 단축 URL 두 가지 도구를 활용하면 전체 학생이 30초 안에 지정 페이지에 접속할 수 있습니다. 긴 URL을 직접 입력할 필요가 없습니다.

이미지 편집 소셜 미디어 콘텐츠 제작
2026-03-25

소셜 콘텐츠 이미지 편집 가이드: 규격, 비주얼 일관성, 내보내기 설정

소셜 콘텐츠의 완성도는 아이디어만으로 결정되지 않습니다. 이미지 크기, 구도, 브랜드 일관성, 출력 설정까지 재사용 가능한 편집 워크플로를 정리했습니다.

이미지 형식 JPG PNG
2026-04-14

이미지 형식 선택 가이드:JPG·PNG·WebP·GIF 완전 비교

왜 PNG는 JPG보다 몇 배나 클까요? WebP는 언제 써야 할까요? GIF는 이제 구식인가요? 압축 원리부터 시작해 상황별 최적 형식을 선택하는 방법을 정리했습니다.

Emoji 디지털 커뮤니케이션 크로스 플랫폼
2026-03-17

Emoji 완전 가이드: 의미, 매너, 크로스 플랫폼 활용

Emoji는 단순한 장식이 아니라 텍스트 커뮤니케이션의 톤을 조정하는 도구입니다. 의미 차이, 업무 매너, 브랜드 운영 전략, 플랫폼 표시 이슈까지 실무 중심으로 정리했습니다.

PDF 문서 정리 PDF 병합
2026-04-14

PDF 병합·분할·압축 완전 정복:일상 문서 정리 가이드

큰 PDF에서 필요한 페이지만 꺼내고 싶다면? 여러 보고서를 하나로 합쳐야 한다면? 파일이 너무 커서 업로드가 안 된다면? 가장 흔한 PDF 작업 4가지를 설치 없이 해결하는 방법을 알아봅니다.

단축 URL 링크 공유 마케팅 도구
2026-03-29

URL이 너무 길다면? 무료 단축 도구와 실전 가이드

긴 URL은 가독성이 떨어지고 공유 중 잘리기 쉽습니다. 이 글에서는 무료 단축 링크 도구를 고르는 기준과 안전하게 운영하는 방법을 정리합니다.

이런 도구도 있어요