오픈 그래프 & 트위터 카드 생성기

Open Graph(og:)는 Facebook, LinkedIn, Slack, WhatsApp, Pinterest 및 대부분의 플랫폼에서 링크 미리보기를 생성하기 위해 읽는 공유 프로토콜입니다. Twitter Card(twitter:)는 카드 레이아웃을 제어하는 X의 자체 어휘입니다. 예를 들어 summary vs summary_large_image. 이들은 크게 겹치며 title, description, image는 og: 태그에서 올 수 있습니다. Twitter-specific tags는 og:가 표현할 수 없는 것을 추가합니다. 예를 들어 카드 스타일과 @site 핸들.

Facebook, LinkedIn, X summary_large_image 모두가 사용하는 큰 카드는 1200x630 픽셀(1.91:1 비율)을 사용합니다. 이는 자르지 않고 프레임을 채우는 것입니다. 파일 크기를 5MB 이하로 유지하고 절대 https URL을 통해 제공하십시오. 플랫폼은 상대적 또는 http 이미지를 신뢰할 수 없기 때문입니다. Facebook이 허용하는 최소 크기는 200x200이지만 작은 이미지는 영웅 카드 대신 작은 썸네일로 렌더링됩니다.

모든 플랫폼은 스크래핑한 카드의 첫 버전을 캐시하며, 때로는 몇 주 동안 캐시되므로 태그를 수정한 후에도 오래된 제목과 이미지가 남아 있습니다. 강제 재스크래핑: URL을 Facebook Sharing Debugger에 붙여넣고 다시 스크래핑을 클릭합니다. LinkedIn Post Inspector를 사용하고 X에서 링크를 공유하여 캐시를 새로 고칩니다. 태그가 실제로 제공된 HTML 헤더에 있고 대부분의 스크래퍼가 실행하지 않는 JavaScript에 의해 나중에 주입되지 않았는지 확인하십시오.

트위터 태그가 없을 경우, X는 일치하는 Open Graph 태그로 돌아갑니다. og:title, og:description, og:image 태그는 카드의 대부분을 차지합니다. 따라서 실제 최소한은 og: 태그의 완전한 세트와 twitter:card 태그만으로 레이아웃을 선택하고 twitter:site 태그는 속성을 표시합니다. og: 태그를 추가하면 Facebook, LinkedIn, Slack 및 다른 모든 곳에서도 동일한 미리보기가 작동합니다.