MetaData란?

김민준·2023년 2월 24일
0

Frontend

목록 보기
10/14
post-thumbnail

Meta Data?

  • 데이터를 설명하는 데이터
  • meta data를 정의하게 되면 브라우저나 검색 엔진, 다른 웹서비스에서 해당 웹페이지에 대한 meta data를 토대로 분석함
  • 인스타그램의 해시태그('#')와 유사한 역활

Meta Data의 목적

  • 데이터를 표현하기 위한 목적
  • 데이터를 더 빨리 찾기 위한 목적(인덱스의 역활)

HTML Meta tag

  • html 메타 태그를 사용하여 메타 데이터를 정의함
  • <meta name="" content=""> 형식으로 구성 되어 있음

대표적인 Meta tag 종류

  1. Keywords (검색엔진에 의해 검색되는 단어 지정)
  • 사용법 : <meta name="Keywords" content="Dev Scroll" />
  1. Description(검색 결과에 표시되는 문자 지정)
  • 사용법 : <meta name="Keywords" content="Dev Scroll" />
  1. charset (문자 코드의 종류 설정) : 인코딩 깨짐 방지
  • 사용법 : <meta charset="UTF - 8"/>
  1. Date (날짜- 제작일)
  • 사용법 : <meta name="Date" content="2023-02-14T01:50:35+07:00" />

og(open graph) 태그

  • 콘텐츠의 요약내용이 SNS에 게시되는데 최적화된 데이터를 가지고 갈 수 있도록 설정함
  • 페이스북이 처음 만들었으며 지금은 거의 표준 처럼 사용됨

사용방법

<meta property="og:url"                content="링크될 URL을 지정" />
<meta property="og:type"               content="타입 지정 (ex: website , blog)" />
<meta property="og:title"              content="해당 링크의 제목 " />
<meta property="og:description"        content="해당 링크의 설명 입력 " />
<meta property="og:image"              content="썸네일 이미지며 절대 주소를 입력해야함" />
profile
이번엔

0개의 댓글