현재 번역은 완벽하지 않습니다. 한국어로 문서 번역에 동참해주세요.

HTML <meta> 요소는 <base>, <link>, <script>, <style> 또는 <title>과 같은 다른 메타관련 요소로 나타낼 수 없는 메타데이터를 나타냅니다.

컨텐트 카테고리 메타데이터 컨텐트. itemprop 속성이 존재할 경우: flow content, phrasing content.
허용된 컨텐트 없음, 빈 요소(empty element)임.
태그 생략 빈 요소이므로 시작 태그는 있어야하고, 종료 태그는 없어야 한다.
허용된 부모 요소 <meta charset>, <meta http-equiv>: <head> 요소. http-equiv가 인코딩 선언이 아닌 경우에는 <head> 요소 내부에 존재하는 <noscript> 요소 내에 존재할 수 있다.
허용된 ARIA 역할 없음
DOM 인터페이스 HTMLMetaElement

속성

이 요소는 전역 속성을 포함합니다.

Note: 전역 속성인 name<meta> 요소에 대해 특정한 의미를 가지며, 동일한 <meta> 요소에 대해 itemprop 속성을 name, http-equiv 또는 charset 속성과 같이 설정할 수 없습니다.

charset
이 속성은 페이지의 문자 인코딩을 선언합니다. 이 속성은 standard IANA MIME name for character encodings을 포함해야 합니다. 이 표준은 특정한 인코딩을 요구하지는 않지만, 다음을 권장합니다:
  • 작성자는 UTF-8를 사용하는것이 좋습니다.
  • 작성자는 보안의 위험성을 회피하기 위해 ASCII와 호환되지 않는 인코딩을 사용하지 않아야 합니다: 해당 인코딩을 지원하지 않는 브라우저는 유해한 컨텐츠를 HTML로 해석할 수 있습니다. 이런 현상은 JIS_C6226-1983, JIS_X0212-1990, HZ-GB-2312, JOHAB, ISO-2022 패밀리와 EBCDIC 패밀리의 인코딩을 사용할 경우 발생합니다.

Note: ASCII와 호환되지 않는 인코딩이란 0x20와 0x7E 사이의 8비트 코드를 0x0020와 0x00E 사이의 유니코드 코드에 매핑 하지 않는 인코딩을 말합니다.

  • 작성자는 CESU-8, UTF-7, BOCU-1 그리고/또는 SCSU 인코딩을 사용해서는 안됩니다. 이들 인코딩을 통한 cross-site scripting 공격이 가능함이 입증되었습니다.
  • 모든 HTML5 인코딩 알고리즘이 UTF-32 인코딩을 UTF-16과 구분할 수 있는 것은 아니므로 UTF-32 인코딩을 사용하지 말아야 합니다.
각주:
  • 선언된 문자 집합(character set)은 페이지의 문자 집합과 일치해야 합니다. 부정확한 문자 집합을 선언할 타당한 이유가 없습니다.
  • <meta> 요소는 반드시 <head> 요소 내에 있어야 하고 어떤 브라우저는 문자 집합을 선택하기 전에 페이지의 앞 부분만 살펴보기 때문에 처음 512 바이트 이내에 있어야 합니다.
  • <meta> 요소는 문자 집합 결정 알고리즘의 한 부분일 뿐입니다. 이 요소는 Content-Type headerByte-Order Marks에 의해 재정의될 수 있습니다.
  • 문자 인코딩을 정의할 것을 강력하게 추천합니다. 어떤 페이지의 인코딩이 정의되지 않을 경우, UTF-7 fallback cross-scripting technique과 같은 cross-scripting 수법이 가능해집니다.
  • charset 속성을 가진 <meta> 요소는 HTML5 이전의 <meta http-equiv="Content-Type" content="text/html; charset=IANAcharset">와 같습니다. IANAcharsetcharset 속성과 동등한 값을 가집니다. 이 문법은 여전히 사용가능하지만 더 이상 권장되지 않습니다.
content
이 속성은 http-equiv 또는 name 속성 중 어떤 것이 사용되느냐에 따라 해당 속성의 값을 갖습니다.
http-equiv
이 속성은 속성의 이름(http-equiv(alent))에서 알 수 있듯이, HTTP 헤더의 이름을 값으로 가질 수 있습니다. 이 속성의 값으로 서버나 사용자 에이전트의 작동방식을 변경할 수 있는 지시를 정의할 수 있습니다. 지시 값은 content 속성 안에 정의하는데 다음 중 하나 일 수 있습니다:
  • "content-language"
    페이지의 기본 언어를 정의합니다. 요소의 lang 속성에 의해 재정의될 수 있습니다.

    경고: 이 값은 폐기되었으므로 사용하지 마십시오. <html> 요소의 lang 속성을 사용하는 것이 좋습니다.

  • "content-security-policy"
    이 값을 이용해 현재 페이지에 대한 컨텐트 정책(content policy)를 정의할 수 있습니다. 컨텐트 정책은 주로 허용된 server origins과 script endpoints를 명시함으로써 cross-site scripting 공격을 막는 것을 돕습니다.
  • "content-type"
    문자 인코딩과 함께 문서의 MIME type을 정의합니다. HTTP content-type 개체헤더 필드와 동일한 문법을 따르나 HTML 페이지 내부에 존재하며, text/html을 제외한 대부분의 값은 작동하지 않습니다. 그러므로 content에 유효한 문법은 'text/html' 문자열 뒤에 '; charset=IANAcharset'과 같이 문자열 집합을 정의하는 것입니다. 이 때, IANAcharset은 IANA가 정의한 문자 집합의 MIME 이름입니다.

    경고: 이 값은 폐기되었으므로 사용하지 마십시오. <meta> 요소의 charset 속성을 사용하시기 바랍니다.

    각주: <meta>는 XHTML 또는 HTML5의 XHTML 직렬화(serialization) 상황에서 문서의 유형을 바꿀 수 없게 되므로 <meta>를 이용한 XHTML MIME 유형으로의 변경은 절대 하지 마십시오.

  • "refresh"
    이 명령은 다음을 명시합니다:
    • content 속성에 양의 정수 값이 설정된 경우, 페이지가 재로딩될 때까지의 시간(초)을 의미합니다.
    • content 속성이 양의 정수 값을 가지고 그 값의 뒤에 ';url=' 문자열과 함께 유효한 URL이 설정된 경우, 다른 페이지로 리디렉션될 때까지의 시간(초)을 의미합니다.
  • "set-cookie"
    페이지에 대한 cookie를 정의합니다. 컨텐트는 반드시 IETF HTTP Cookie Specification에 정의된 문법을 따라야 합니다.

    Warning: 이 명령은 폐기되었으므로 사용하지 마십시오. 대신 HTTP 헤더의 Set-Cookie를 사용하십시오.

name

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

이 메타데이터의 이름은 content 속성에 담긴 값과 연관됩니다. 이름 속성에 사용될 수 있는 값은 다음과 같습니다:

  • application-name은 웹 페이지 내에서 실행될 어플리케이션의 이름을 정의합니다.
    각주:
    • 브라우저는 이 값을 어플리케이션을 인식하는데 사용할 수 있습니다. 일반적으로 어플리케이션의 이름을 담고 있는 <title> 요소와는 달리 문서의 이름이나 상태와 같은 정보를 담을 수도 있습니다.
    • 단순한 웹 페이지에서는 어플리케이션의 이름을 정의할 수 없습니다.
  • author는 문서의 작성자를 정의합니다.
  • description은 페이지의 내용에 대한 짧고 정확한 요약을 담고 있습니다. Firefox나 오페라와 같은 여러 브라우저에서는 이를 즐겨 찾기 페이지의 기본 설명으로 사용합니다.
  • generator는 페이지를 생성한 소프트웨어의 식별자를 담고 있습니다.
  • keywords는 콤마(',')로 구분된 페이지의 내용과 관련된 단어를 담고 있습니다.
  • referrer는 문서에서 전송된 요청에 첨부된 HTTP 헤더의 참조자(Referer)를 제어합니다:
    <meta name="referrer"> 속성에 대한 content 속성의 값
    no-referrer HTTP Referrer header를 전송하지 않습니다.
    origin 문서의 origin을 전송합니다.
    no-referrer-when-downgrade 현재 페이지와 동일한 수준의 안전도를 가진(https→https) URLs의 참조자로 origin을 전송하나, 더 낮은 안전도 수준(https→http)의 URLs에 대한 참조자는 전송하지 않습니다. 이 값은 기본값입니다.
    origin-when-crossorigin 동일한 origin의 요청에 대해서는 (매개변수가 제거된) 전체 URL을 전송하나 그렇지 않은 경우에 대해서는 origin만 전송합니다.
    same-origin 동일 사이트 origin(same-site origins)의 요청에는 참조자를 전송하지만, cross-origin 요청에는 참조자 정보를 담지 않습니다.
    strict-origin 목적지(destination)의 안전도 수준이 현재와 동일하거나 더 높은 수준인 경우(HTTPS-> HTTPS)에만 참조자로 문서의 origin을 전송하고 목적지의 안전도 수준이 더 낮은 경우(HTTPS->HTTP)에는 전송하지 않습니다.
    strict-origin-when-cross-origin 동일한 origin의 요청이 수행될 때 전체 URL을 전송하되 목적지(destination)의 안전도 수준이 현재와 동일하거나 더 높은 수준인 경우(HTTPS-> HTTPS)에만 origin을 전송하고 목적지의 안전도 수준이 더 낮은 경우(HTTPS->HTTP)에는 헤더를 전송하지 않습니다. 
    unsafe-URL same-origin 또는 cross-origin 요청에 대해 (매개변수가 제거된) 전체 URL을 전송합니다.

    각주:

    • 어떤 브라우저는 향후에는 없어질(deprecated) always, default 그리고 never 값을 참조자로 지원합니다.
    • <meta name="referrer">의 값을 document.write 또는 appendChild으로 설정하여 동적으로 삽입할 경우, 참조자의 작동을 예측할 수 없습니다.
    • 여러 정책이 서로 충돌할 경우에는 무참조자(no-referer) 정책이 적용됩니다.

This attribute may also have a value taken from the extended list defined on WHATWG Wiki MetaExtensions page. Although none have been formally accepted yet, a few commonly used names are:

  • creator which defines the name of the creator of the document, such as an organization or institution. If there are more than one, several <meta> elements should be used.
  • googlebot, a synonym of robots, is only followed by Googlebot (the indexing crawler for Google).
  • publisher which defines the name of the document's publisher.
  • robots which defines the behaviour that cooperative crawlers, or "robots", should use with the page. It is a comma-separated list of the values below:
    Values for the content of <meta name="robots">
    Value Description Used by
    index Allows the robot to index the page (default). All
    noindex Requests the robot to not index the page. All
    follow Allows the robot to follow the links on the page (default). All
    nofollow Requests the robot to not follow the links on the page. All
    none Equivalent to noindex, nofollow Google
    noodp Prevents using the Open Directory Project description, if any, as the page description in search engine results.

    Google, Yahoo, Bing

    noarchive Requests the search engine not to cache the page content. Google, Yahoo, Bing
    nosnippet Prevents displaying any description of the page in search engine results. Google, Bing
    noimageindex Requests this page not to appear as the referring page of an indexed image. Google
    nocache Synonym of noarchive. Bing
    Notes:
    • Only cooperative robots follow these rules. Do not expect to prevent e-mail harvesters with them.
    • The robot still needs to access the page in order to read these rules. To prevent bandwidth consumption, use a robots.txt file.
    • If you want to remove a page, noindex will work, but only after the robot visits the page again. Ensure that the robots.txt file is not preventing revisits.
    • Some values are mutually exclusive, like index and noindex, or follow and nofollow. In these cases the robot's behaviour is undefined and may vary between them.
    • Some crawler robots, like Google, Yahoo and Bing, support the same values for the HTTP header X-Robot-Tags; this allows non-HTML documents like images to use these rules.
  • slurp, is a synonym of robots, but only for Slurp - the crawler for Yahoo Search.
  • viewport, which gives hints about the size of the initial size of the viewport. Used by mobile devices only.
    Values for the content of <meta name="viewport">
    Value Possible subvalues Description
    width A positive integer number, or the text device-width Defines the pixel width of the viewport that you want the web site to be rendered at.
    height A positive integer, or the text device-height Defines the height of the viewport. Not used by any browser.
    initial-scale A positive number between 0.0 and 10.0 Defines the ratio between the device width (device-width in portrait mode or device-height in landscape mode) and the viewport size.
    maximum-scale A positive number between 0.0 and 10.0 Defines the maximum amount to zoom in. It must be greater or equal to the minimum-scale or the behaviour is undefined. Browser settings can ignore this rule and iOS10+ ignores it by default.
    minimum-scale A positive number between 0.0 and 10.0 Defines the minimum zoom level. It must be smaller or equal to the maximum-scale or the behaviour is undefined. Browser settings can ignore this rule and iOS10+ ignores it by default.
    user-scalable yes or no If set to no, the user is not able to zoom in the webpage. The default is yes. Browser settings can ignore this rule, and iOS10+ ignores it by default.
    Specification Status Comment
    CSS Device Adaptation
    The definition of '<meta name="viewport">' in that specification.
    Working Draft Non-normatively describes the Viewport META element
    See also: @viewport
    Notes:
    • Though unstandardized, this declaration is respected by most mobile browsers due to de-facto dominance.
    • The default values may vary between devices and browsers.
    • To learn about this declaration in Firefox for Mobile, see this article.
scheme
This attribute defines the scheme in which metadata is described. A scheme is a context leading to the correct interpretations of the content value, like a format.

Warning: Do not use this value, as it is obsolete. There is no replacement as there was no real usage for it.

Notes

Depending on the attributes set, the kind of metadata can be one of the following:

  • If name is set, it is document-level metadata, applying to the whole page.
  • If http-equiv is set, it is a pragma directive — information normally given by the web server about how the web page is served.
  • If charset is set, it is a charset declaration — the character encoding used by the webpage.
  • If itemprop is set, it is user-defined metadata — transparent for the user-agent as the semantics of the metadata is user-specific.

Examples

<meta charset="utf-8">

<!-- Redirect page after 3 seconds -->
<meta http-equiv="refresh" content="3;url=https://www.mozilla.org">

Accessibility concerns

Refreshing content

Pages set with a refresh value run the risk of having the time interval being too short. People navigating with the aid of assistive technology such as a screen reader may be unable to read through and understand the page's content before being automatically redirected. The abrupt, unannounced updating of the page content may also be disorienting for people experiencing low vision conditions. 

Viewport scaling

Disabling zooming capabilities by setting user-scalable to a value of no prevents people experiencing low vision conditions from being able to read and understand page content.

Specifications

Specification Status Comment
Referrer Policy
The definition of '<meta name="referrer">' in that specification.
Candidate Recommendation Defines values and semantics of <meta name="referrer">.
HTML Living Standard
The definition of '<meta>' in that specification.
Living Standard Added itemprop attribute
HTML5
The definition of '<meta>' in that specification.
Recommendation Added charset attribute
HTML 4.01 Specification
The definition of '<meta>' in that specification.
Recommendation  

Browser compatibility

The information shown below has been pulled from MDN's Github (https://github.com/mdn/browser-compat-data).

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support Yes Yes1 Yes Yes Yes
charset Yes Yes1 Yes Yes Yes
content Yes Yes1 Yes Yes Yes
http-equiv Yes Yes1 Yes Yes Yes
name Yes Yes1 Yes Yes Yes
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support Yes Yes Yes4 Yes Yes Yes
charset Yes Yes Yes4 Yes Yes Yes
content Yes Yes Yes4 Yes Yes Yes
http-equiv Yes Yes Yes4 Yes Yes Yes
name Yes Yes Yes4 Yes Yes Yes

See also

문서 태그 및 공헌자

이 페이지의 공헌자: dolmoon, Narrativi, joshua1988, azunyan3
최종 변경: dolmoon,