meta 태그

'~에 대해서'라는 의미를 가진 단어로

해당 html문서가 어떤 내용을 담고 있으며, 문서의 키워드, 작성자 등을 알려주는 웹페이지의 요약.

웹문서의 <head>영역 안에 작성해야 한다.</head>

<meta charset="">

문자 인코딩을 나타내는 "문자 집합 선언"

페이지의 문자 인코딩을 선언하며 이 특성이 존재할 경우

그 값은 반드시 문자열 "utf-8"의 대소문자 구분 없는 ASCII(미국정보교환표준부호) 표현이어야 함

<meta http-equiv="항목명">

HTTP 헤더가 제공하는 정보와 동일한 "프래그마 지시문"

-웹브라우저 서버에 명령을 내리는 속성.

-name 속성을 대신해 사용할 수 있음.

<meta property="" content="">

HTML 문서의 메타정보에 해당하는 제목, 설명, 문서의 타입, 대표 URL 등 다양한 요소들에 대해

사람들이 통일해서 쓸 수 있도록 정의해 놓은 프로토콜.

해당 콘텐츠의 요약 내용이 SNS에 게시되는데 최적화된 데이터로

미리 크롤러가 웹사이트를 방문하여 미리보기 화면 생성.

페이스북에서 만들었으나 카카오, 네이버 등 많은 곳에서 사용.

  <!-- ** open graph 작성 양식 -->
  <!-- 제목 -->
  <meta property="og:title" content="og 연습">
  <!-- 설명 -->
  <meta property="og:description" content="메신저나 sns, 블로그, 카페 등에서 유용하게 사용됨">
  <!-- 이미지 -->
  <meta property="og:image" content="https://이미지주소">
  <!-- 주소 -->
  <meta property="og:url" content="https://주소">
  
  <!-- 트위터 전용 -->
  <meta name="twitter:card" content="요약 내용">
  <meta name="twitter:title" content="제목">
  <meta name="twitter:description" content="설명">
  <meta name="twitter:image" content="https://이미지주소">
  <meta name="twitter:url" content="https://주소">