Frontend

meta 태그 및 og 의미

고수트 2023. 1. 6. 19:19
반응형

<meta> 태그는 문서에 대한 정보인 메타데이터(metadata)를 정의할 때 사용한다.
간략히, 문서에 어떤 정보가 담겨있는지를 기술한다.
제공된 정보는 브라우저나 검색 엔진, 다른 웹 서비스에서 사용 된다.


1. 검색엔진을 위한 keyword를 다음과 같이 입력한 뒤 검색 엔진에서 조회될 수 있도록 할 수 있다.
<meta name="keyword" content="search engine">

<meta name="keyword" content="search engine">

 

2. 웹 페이지에 대한 설명을 기입할 수 도 있다. 

<meta name="description" content="html meta tag page">


이밖에도 누가 저장인지를 나타내는 author 등 다양한 속성값이 있다.

그런데 메타 태그 내부에 og:title 과 같이 적힌 경우가 있다.


og 는 오픈그래프(Open Graph) 의 약자로 
SNS에 게시될 때 문서의 데이터를 가지고 갈 수 있도록 설정하는 것을 의미한다.

즉, 아래와 같이 해당 주소 복사시 전 미리 크롤러가 해당 웹사이트를 방문하여
HTML의 head의 메타데이터를 크롤링 하여 미리보기 화면을 생성하여 정보를 나타내게 하는데 사용한다.
https://ogp.me/

 

Open Graph protocol

The Open Graph protocol enables any web page to become a rich object in a social graph.

ogp.me

 

반응형