[HTML] Meata Tag - og: 사용하기

JJeong·2021년 5월 24일
0
post-custom-banner

👀 인용 표시가 되어 있는 부분은 정말 인용입니다.


해당 콘텐츠의 요약내용이 "SNS에 게시되는데 최적화된 데이터"를 가지고 갈 수 있도록 설정하는 것입니다.

<meta property="og:title" content="콘텐츠 제목">
<meta property="og:url" content="웹페이지 URL">
<meta property="og:type" content="웹페이지 타입(blog, website 등)">
<meta property="og:image" content="표시되는 이미지">
<meta property="og:site_name" content="웹사이트 이름(URL과 다름)">
<meta property="og:description" content="웹페이지 설명(제목 아래에 표시)">

<meta name="twitter:card" content="트위터 카드 타입(요약정보, 사진, 비디오)">
<meta name="twitter:title" content="콘텐츠 제목">
<meta name="twitter:description" content="웹페이지 설명">
<meta name="twitter:image" content="표시되는 이미지">


오픈그래프는 어떤 HTML 문서의 메타정보를 쉽게 표시하기 위해서
메타정보에 해당하는 제목, 설명, 문서의 타입, 대표 URL 등 다양한 요소들에 대해서
사람들이 통일해서 쓸 수 있도록 정의해놓은 프로토콜이며
페이스북에 의하여 기존의 다양한 메타 데이터 표기 방법을 참조하여 만들어졌다.

post-custom-banner

0개의 댓글