오픈 그래프 프로토콜
오픈 그래프 프로토콜(Open Graph Protocol, OG)은 웹 페이지의 HTML `
` 내 `og:` 접두어를 가진 메타 태그들을 크롤러가 읽어 SNS·메신저 등에서 링크 미리보기(제목·설명·이미지)를 표시하는 표준이다. 페이스북이 처음 만들었으며 현재는 거의 모든 주요 플랫폼이 지원한다.기본 필수 태그는 `og:url`, `og:type`, `og:image`, `og:title`, `og:description` 다섯 가지다. 트위터(X)는 표준 OG 태그를 일부 인식하지 못할 수 있어 `twitter:card`, `twitter:title`, `twitter:description`, `twitter:image` 태그를 별도로 작성하는 것이 안전하다. 이미지 권장 크기는 페이스북 기준 1200×630px이며, 넓은 이미지 타입에서는 최소 600×315px에 1.91:1 비율을 유지해야 한다.
주의해야 할 실무 이슈는 캐싱이다. 각 플랫폼의 크롤러가 링크를 캐시하는 주기가 달라서 이미지를 교체해도 즉시 반영되지 않는다. 트위터는 트윗 게재 후 7일간 캐시하며, 페이스북은 공식 디버거에서 "다시 스크랩" 버튼으로 갱신할 수 있다. 카카오는 개발자 API로 초기화가 가능하다. metatags.io, opengraph.xyz 같은 도구를 사용하면 여러 플랫폼에서 미리보기 결과를 한 곳에서 확인할 수 있다.
핵심 내용
- 필수 태그: og:url / og:type / og:image / og:title / og:description
- 트위터는 별도의 twitter:card 메타 태그 필요
- 이미지 권장 크기: 1200×630px (페이스북 기준), 최소 200×200px
- 각 플랫폼별로 캐시 갱신 주기가 다름 — 이미지 변경 후 즉시 반영 안 될 수 있음
- og:image:width / og:image:height 태그는 선택 사항이나 정확한 렌더링에 도움
관련 개념
- 웹 아키텍처 — 메타 태그는 HTML head 구조의 일부
- UI 컴포넌트 용어 — 링크 미리보기 UI는 카드 컴포넌트 형태로 표시됨
출처
- OG 등록하기 — 2023-04-06, ny.back