메타태그(meta tag)
HTML 문서의 맨 위쪽에 위치하는 태그. HEAD 태그 사이 또는 뒤에 있어도 되지만, 반드시 BODY 태그 앞쪽에 위치해야 한다. 브라우저와 검색 엔진을 사용할 수 있도록 문서의 정보를 포함하고 있다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta property="og:type" content="website" />
<meta property="og:url" content="https://studyJavaScript.co.kr/" />
<meta property="og:title" content="JavaScript" />
<meta property="og:image" content="%PUBLIC_URL%/JavaScript.png" />
<meta property="og:description" content="TEST" />
<meta property="og:site_name" content="Study" />
<meta property="og:locale" content="en_US" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
</head>OG (Open Graph)
오픈 그래프의 원리는 플랫폼에 URL을 붙여 넣는 순간 해당 플랫폼에서 크롤러가 빠르게 해당 URL을 먼저 방문해서 웹페이지에 있는 오픈그래프 데이터를 수집해 링크 안의 내용을 짐작할 수 있도록 이미지, 제목, 설명 문구를 함께 노출시키는 미리보기 기능.
"og:type" content="websit"
"og:url" content="링크URL"
"og:title" content="링크title"
"og:image" content="노출시킬 이미지"
"og:description" content="부가설명"
"og:image:width" content="1200"
"og:image:height" content="630"
- 이미지의 크기는 1200 x 630 픽셀을 권장
'Study > 실무' 카테고리의 다른 글
| new Date() 한국시간구하기 (0) | 2022.09.23 |
|---|---|
| 문자열에서 첫번째, 마지막 문자 가져오기 (0) | 2022.09.22 |
| Axios delete시 body에 데이터 넣기 (0) | 2022.09.22 |
| [React] TR Link안에 TD하나만 Link안보내기 (0) | 2022.09.22 |
| 카카오톡 오픈그래프 변경하기 (0) | 2022.09.22 |
