메타 태그(meta Tag)

hazel's·2022년 2월 23일
0

meta Tag ?

메타태그는 html에서 가장 위에 있는 태그로, data에 대한 정보를 나타내는 태그이다.
HTML 요소는 , , 메타데이터를 나타냅니다.

-가능한 콘텐츠는 없다. (빈요소)
-여는 태그 존재 (O) , 닫는 태그 존재 (X) (빈요소)

mata tag attribute

1.http-equiv(항목명)

-헤더의 값을 정의할 수 있는 속성이며,
-content-security-policy
현재 페이지의 콘텐츠 정책을 정의할 수 있다. 대부분의 콘텐츠 정책은 허용하는 출처와 스크립트 엔드포인트를 지정해 사이트 간 스크립트 공격 방어에 도움을 준다.
-content-type
지정할 경우, content 특성 값은 반드시 "text/html; charset-utf-8"이어야 한다.
-default-style
기본 css 스타일 시트 세트의 이름을 지정한다.
-x-ua-compatible
지정할 경우, content 특성의 값은 반드시 "IE=edge"여야 한다. 사용자 에이전트는 프래그마를 무시한다.
-refresh
content 특성이 양의 정수 값을 가지고 그 뒤를 문자열 ;url=과 유효한 URL이 뒤따른다면, 해당 URL로 이동하기 전까지의 초 단위 대기시간.

2.content(정보 값)
-meta 정보의 내용이다.

3.name (정보이름)
-문서 레벨의 메타데이터의 이름을 정의한다. itemprop, http-equiv 또는 charset 속성 중 하나라 도 설정이 된 경우에는 설정 할 수 없습니다.

예제)

-웹페이지 인코딩 속성 지정
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />   
  <meta charset="utf-8">
-호환성 설정
  <meta http-equiv="X-UA-Compatible" content="IE=edge;Chromeframe=1">:
-뷰포트 설정
   해상도가 아닌 실제 크기에 따라 웹이 보이는 형태를 달리해야할때 사용하는 태그
  <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-        scale=1.0,maximum-scale=1.0,user-scalable=no">
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  
-설명 태그 : 검색엔진에 설명나오는 부분
  <meta name="description" content="<![CDATA[ 내용 최대 290글자 ]>">
 
-검색엔진에서 색인되고 허용여부를 설정하는 태그
  기본설정 all, nofollow는 링크 노출안함, none은 크롤링 되지 않는다.
 <meta name="robots" content="ALL">
 
-일정 시간이 흐르면 설정한 페이지로 리디렉션...에러발생 할 수 있어 비추!
 <meta http-equiv="refresh" content="30;url=https://nowonbun.tistory.com" />
 
  -author tag
  <meta author="mr.jung" content="js-script" />

출처: https://nowonbun.tistory.com/516?category=678515 [명월 일지]
https://developer.mozilla.org/ko/docs/Web/HTML/Element/meta

profile
좋아하는 것을 하나하나 채워가면 행복해질꺼야

0개의 댓글

Powered by GraphCDN, the GraphQL CDN