Guidelines
Practice
Guidelines

SEO 심화 - 오픈그래프(Open Graph)

웹 페이지를 인스타그램, 페이스북과 같은 소셜미디어에 표현하는 Open Graph에 대해 알아보겠습니다.

오픈 그래프는 영화의 제목, 주요 배우, 간략한 줄거리와 함께 이미지를 표현하는 영화 포스터와 같습니다.

Facebook에서 개발한 Open Graph 프로토콜(통신규약)은 소셜 미디어에 웹페이지의 제목, 설명, 이미지와 같은 메타데이터를 제공하고, 링크의 미리보기 이미지를 보여줄 때 사용합니다.


주요 Open Graph 태그

1. og:title

웹 페이지의 제목을 정의합니다.

웹사이트 제목
<meta property="og:title" content="웹사이트 제목" />

2. og:description

웹 페이지의 간단한 설명을 정의합니다.

웹사이트 설명
<meta property="og:description" content="웹사이트 설명" />

3. og:type

웹 페이지의 종류(예: website, article)를 정의합니다.

웹사이트 종류
<meta property="og:type" content="website" />

4. og:url

웹 페이지의 정확한 주소(URL)를 지정합니다.

웹사이트 주소
<meta property="og:url" content="https://example.com/my-web-page" />

5. og:site_name

웹사이트의 이름을 정의합니다.

웹사이트 이름
<meta property="og:site_name" content="웹사이트 이름" />

6. og:image

  • 링크 미리보기 이미지 URL을 지정합니다.
웹사이트 미리보기 이미지
<meta property="og:image" content="https://example.com/my-image.jpg" />

Guidelines

AI Tutor

Publish

Design

Upload

Notes

Favorites

Help