The Wayback Machine - https://web.archive.org/web/20170813174725/https://developer.mozilla.org/ja/docs/Web/HTML/Element/meta

MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

meta 要素

HTML <meta> 要素は、他のメタ関連要素 (<base>、<link>、<script>、<style>、<title>) で表すことができない任意のメタデータ情報を提示します。

属性のセットに応じて、メタデータの種類は以下のいずれかになります:

  • name を設定すると文書レベルのメタデータになり、ページ全体に適用します。
  • http-equiv を設定するとプラグマディレクティブ、つまりどのように Web ページを提供するかについて、通常 Web サーバから与えられる情報です。
  • charset を設定すると文字集合宣言、つまりシリアライズ化した Web ページで使用する文字集合です。
  • itemprop を設定するとユーザ定義メタデータとなり、メタデータのセマンティックがユーザ独自であるためユーザエージェントに対して透過的になります。
コンテンツカテゴリ メタデータコンテンツ。itemprop 属性を設定するとフローコンテンツおよびフレージングコンテンツ。
許可された内容 なし。これは空要素です。
タグの省略 空要素であるため開始タグは必須であり、終了タグは置いてはいけません。
許可された親要素 <meta charset> および <meta http-equiv>: <head> 要素。http-equiv がエンコーディング宣言ではない場合は、<head> 要素内にある <noscript> 要素の内部にも配置できます。
DOM インターフェイス HTMLMetaElement

属性

この要素はグローバル属性を持ちます。

<meta> 要素ではグローバル属性 name に特別な意味がある点と、name、http-equiv または charset のいずれかをすでに使用したときは itemprop を設定してはいけない点に注意してください。

charset
この属性は、ページで使用している文字エンコーディングを宣言します。これは、任意の属性の lang 属性を使用して個別に変更できます。この属性はリテラル文字列かつ IANA で定義されている文字エンコーディングの Preferred MIME Name のひとつであることが必要です。標準仕様では特定の文字エンコーディングを要求していませんが、以下の推奨事項があります:
  • 作者には UTF-8 を推奨します。
  • 作者は ASCII との互換性がないエンコーディング (つまり、8 ビットのコードポイント 0x20 から 0x7E が Unicode のコードポイント 0x0020 から 0x007E にマッピングされていない) を使用するべきではありません。これはセキュリティのリスクがあるためで、これらのエンコーディングをサポートしないブラウザが HTML 要素ではないコンテンツを HTML 要素として解釈するかもしれません。これは、少なくとも以下の文字セットがあてはまります: JIS_C6226-1983、JIS_X0212-1990、HZ-GB-2312、JOHAB、ISO-2022 ファミリ、EBCDIC ファミリ。
  • 作者は CESU-8、UTF-7、BOCU-1、SCSU およびこれらのカテゴリに入るエンコーディングを使用してはいけません。また、Web 上で用いようと考えてはいけません。これらのエンコーディングの一部でクロスサイトスクリプティング攻撃が実証されています。
  • 作者は UTF-32 を使用すべきではありません。これは、すべての HTML5 エンコーディングアルゴリズムで UTF-16 と区別できるわけではないためです。
注記:
  • 宣言した文字集合は、ページの文字集合と一致しなければなりません。誤った文字集合を宣言することは意味がないうえに、ユーザエクスペリエンスの劣化を招きます。
  • この <meta> 要素は <head> 要素の内部かつページの始めから 1024 バイト以内に配置しなければなりません。これは、ページの文字集合を選択するまでに始めの部分しか確認しないブラウザがあるためです。
  • この <meta> 要素はブラウザが提供する、ページの文字集合を判断するアルゴリズムの一部でしかありません。特に、HTTP の Content-Type ヘッダや BOM はこの要素より優先します。
  • この属性を使用して文字集合を定義することはよいことであり、また強く推奨します。ページで文字集合を定義しない場合は UTF-7 fallback cross-scripting のような、ページの利用者を攻撃するクロスサイトスクリプティング手法が実現する可能性があります。常にこの meta を設定することで、これらの危険性から保護されます。
  • この <meta> 要素は、HTML5 より前の <meta http-equiv="Content-Type" content="text/html; charset=IANAcharset"> (IANAcharset は、同等の charset 属性の値に対応します) と同義です。この構文はまだ許容されていますが、廃止されており今後は推奨されません。
content
この属性は状況に応じて、http-equiv 属性または name 属性に関連付けられた値を与えます。
http-equiv
この列挙属性は、サーバやユーザエージェントの動作を変更可能なプラグマを定義します。プラグマの値は content を使用して定義します。以下のいずれかを使用できます:
"content-language"
このプラグマは、ページのデフォルトの言語を定義します。
使用上の注意: このプラグマは廃止されたため、使用しないでください。代わりに、<html> 要素で lang グローバル属性を使用します。
"Content-Security-Policy"
この値により、サイト管理者がリソースのコンテンツポリシーを定義できます。いくつかの例外を除き、ポリシーはサーバオリジンやスクリプトのエンドポイントの指定に関与します。これは、クロスサイトスクリプティング攻撃の対策になります。
"content-type"
この属性は文書の MIME type を定義するもので、後に文字集合の定義が続きます。これは HTTP の content-type エンティティヘッダフィールドと同じ構文に従いますが、HTML 要素内にあるためほとんどの値は使用できません。従って、この内容として有効な構文はリテラル文字列 'text/html' に、以下の構文による文字集合を続けたものになります: '; charset=IANAcharset'。IANAcharset は、IANA で定義されている文字集合の Preferred MIME Name です。
使用上の注意:
  • このプラグマは廃止されたため、使用しないでください。代わりに、<meta> 要素で charset 属性を使用します。
  • XHTML 文書や XHTML の構文に従う HTML5 文書で文書のタイプを変更するために <meta> を使用してはいけませんので、この方法で XHTML の MIME type を設定しないようにしてください。これは正しい方法ではありません。
  • HTML 文書のみでしか content-type を使用できませんので、ほとんどの場合これは冗長です。このために廃止され、charset 属性に置き換えられました。
"default-style"
このプラグマは、ページ上で優先使用するスタイルシートを指定します。content 属性に、href 属性で CSS スタイルシートをリンクしている <link> 要素の id また は CSS スタイルシートを包含する <style> 要素の id を与えなければなりません。
"refresh"
このプラグマで指定するものは以下のとおりです:
  • content 属性に正の整数が 1 つだけ含まれている場合は、ページを再読み込みするまでの秒数。
  • content 属性に正の整数と、その後に文字列 ';url=' と有効な URL がある場合は、別のページにリダイレクトするまでの秒数。
"set-cookie"
このプラグマは、ページの Cookie を定義します。属性の値は IETF の HTTP Cookie 仕様で定義している構文に従わなければなりません。
注記: このプラグマは廃止されたため、使用しないでください。代わりに HTTP ヘッダ set-cookie を使用します。
name
この属性は、文書レベルのメタデータの名前を定義します。itemprop 属性、http-equiv 属性、charset 属性のいずれかも設定する場合は、この属性を設定するべきではありません。
文書レベルのメタデータの名前は、content 属性が持つ値と関連づけられます。name 属性で使用できる値は、content 属性で結びつけられる値に対して以下のものがあります:
  • application-name は、Web ページで実行する Web アプリケーションの名前を定義します。
    注記:
    • ブラウザは、これをアプリケーションの識別に使用するでしょう。これは <title> 要素とは異なります。title 要素もアプリケーション名から成りますが、文書の名前や状態といった特別な情報も含むことがあります。
    • 単純な Web ページで application-name メタ情報を定義するべきではありません。
  • author は、文書の作者名をフリーフォーマットで定義します。
  • description は、ページのコンテンツに関する簡潔で正確な概要を保持します。Firefox や Opera などいくつかのブラウザは、ページをブックマークに追加した際のデフォルトの説明文としてこのメタ情報を使用します。
  • generator は、ページを生成したソフトウェアの識別名をフリーフォーマットで定義します。
  • keywords は、ページのコンテンツに関連する単語をカンマ区切りの文字列で保持します。
  • referrer は、この文書からリクエストを送信する場合に　HTTP Referer ヘッダへ付加する内容を制御します:
    <meta name="referrer"> の content の値
    no-referrer HTTP Referer ヘッダを送信しません。
    origin ドキュメントのオリジンを送信します。
    no-referrer-when-downgrade 推測的に見てよりセキュアな宛先 (https->https) にはオリジンをリファラとして送信しますが、安全性が低い宛先 (https->http) には送信しません。これは既定の動作です。
    origin-when-crossorigin 同一オリジンへのリクエストでは URL 全体 (パラメータは除く) を送信しますが、他の場合はオリジンのみ送信します。
    unsafe-URL 同一オリジンへのリクエストでは URL 全体 (パラメータは除く) を送信します。

    注記: referrer でキーワード always、default、never をサポートするブラウザがあります。これらの値は非推奨です。

    注記: (document.write や appendChild により) 動的に <meta name="referrer"> を挿入すると、リファラを送信するかの決定権を持たないものになります。また、競合するポリシーをいくつか定義すると、No-referrer ポリシーが適用されます。

この属性では、WHATWG Wiki の MetaExtensions ページで定義されている拡張リストの値も使用できます。さらに、まだ正式には承諾されていませんが、一般的に使用される名前がいくつか提案中です:

  • creator は、文書の制作者をフリーフォーマットで定義します。これは組織名にできることに注意してください。複数の制作者がいる場合は、<meta> 要素を複数使用すべきです。
  • googlebot は robots と同義ですが、Google のインデックス作成クローラである Googlebot だけが従います。
  • publisher は、文書の発行者をフリーフォーマットで定義します。これは組織名にできることに注意してください。
  • robots は、協力的なクローラがページ上で行うべき動作を定義します。これは、以下のリストにある値をカンマ区切りで並べます:
    <meta name="robots"> の content の値
    値 説明 使用対象
    index robot にページのインデックス作成を許可する すべて
    noindex robot によるページのインデックス作成を拒否する すべて
    follow robot がページ上のリンクをたどることを許可する すべて
    nofollow robot がページ上のリンクをたどることを拒否する すべて
    noodp Open Directory Project に説明文がある場合、検索結果のページでその説明文をサイトの説明として使用しないようにする

    Google, Yahoo, Bing
    noarchive 検索エンジンによるページのコンテンツのキャッシュを拒否する Google, Yahoo
    nosnippet 検索結果のページでページの説明を表示しないようにする Google
    noimageindex インデックス登録された画像の参照元としてページを表示しないようにする Google
    noydir Yahoo Directory に説明文がある場合、検索結果のページでその説明文をサイトの説明として使用しないようにする Yahoo
    nocache noarchive と同義 Bing
    注記:
    • 協力的な robot しか、robots の name で定義した規則に従わないでしょう。電子メールを収集するようなものを寄せつけないようにするとは考えないでください。
    • meta の値を読み取るため、robot はページにアクセスできることが必要です。ネットワーク帯域の消費を抑えるなどこのアクセスを避けたい場合は、代わりに (または補足として) robots.txt ファイルを使用してください。
    • インデックスからページを削除したい場合は、meta を noindex に変更すれば実現できますが、robot が再びページを訪れたときになります。このアクセスを妨げないようにしてください。例えば robots.txt ファイルを使用します。一部の検索エンジンは、ページを早急に削除するための開発者ツールを用意しています。
    • index と noindex、または follow と nofollow を同時に使用するなど、使用可能な値の中には互いに排他的なものがあります。同時使用した場合の robot の動作は未定義であり、robot により大きく異なるかもしれません。このような状態は避けてください。
    • Google、Yahoo、Bing など一部の検索エンジンのクローラ robot は、HTTP ディレクティブ X-Robot-Tags で同じ値をサポートしています。これにより、画像など HTML 文書以外でもプラグマを使用できます。
  • slurp は robots と同義ですが、Yahoo 検索のクローラである Slurp のみが従います。

最後に、一部の name は一般的に使用されていますが標準化が進められていません:

  • viewport は、viewport の初期サイズに関する助言を与えます。このプラグマは、一部のモバイル機器のみで使用されます。
    <meta name="viewport"> の content の値
    値 設定可能な値 説明
    width 正の整数またはリテラル device-width viewport の幅をピクセル値で定義します。
    height 正の整数またはリテラル device-height viewport の高さをピクセル値で定義します。
    initial-scale 0.0 から 10.0 までの、正の数値 デバイスの幅 (ポートレートモードでの device-width またはランドスケープモードでの device-height) と viewport のサイズの比率を定義します。
    maximum-scale 0.0 から 10.0 までの、正の数値 ズームの最大値を定義します。この値は minimum-scale と同じまたはより大きくしなければなりません。そうしないときの動作は不定です。
    minimum-scale 0.0 から 10.0 までの、正の数値 ズームの最小値を定義します。この値は maximum-scale と同じまたはより小さくしなければなりません。そうしないときの動作は不定です。
    user-scalable 論理値 (yes または no) no を設定すると、ユーザはページのズームができなくなります。デフォルト値は yes です。
    仕様書 策定状況 コメント
    CSS Device Adaptation
    <meta name="viewport"> の定義    		 草案 Viewport META 要素について、非規範的な説明を掲載
    @viewport もご覧ください。
    注記:
    • この属性は標準化されていませんが、Safari Mobile、モバイル版 Firefox、Opera Mobile といったさまざまなモバイルブラウザで使用されています。
    • デフォルト値は機器やブラウザにより異なる可能性があります。
    • モバイル版 Firefox におけるこのプラグマについて詳しく知るには、こちらの記事をご覧ください。
scheme
この属性は、メタデータを説明するスキーマを定義します。スキーマは、フォーマットなど content の値を正しく解釈するように導くコンテキストです。
注記: この属性は廃止されたため使用しないでください。実際の使用法がなかったため、代替策はありません。省略してください。

例

<!-- HTML4 で charset を定義 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<!-- HTML5 で charset を定義 -->
<meta charset="utf-8">

<!-- 3 秒後にページをリダイレクト -->
<meta http-equiv="refresh" content="3;url=http://www.mozilla.org/">

仕様

仕様書 策定状況 コメント
Referrer Policy
<meta name="referrer"> の定義		 草案 <meta name="referrer"> の値やセマンティクスを定義
WHATWG HTML Living Standard
<meta> の定義		 現行の標準 itemprop 属性を追加
HTML5
<meta> の定義		 勧告 charset 属性を追加
HTML 4.01 Specification
<meta> の定義		 勧告  

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
基本サポート (有) 1.0 (1.7 or earlier) (有) (有) (有)
name="referrer" 17 36.0 (36.0) [1] ? ? ?
referrer で指定した値を (仕様書どおりに) 適用する 46.0        
機能 Android Android Webview Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
基本サポート (有) (有) 1.0 (1.0) (有) (有) (有) (有)
name="referrer" ? (有) 36.0 (36.0) [1] ? ? ? (有)
referrer で指定した値を (仕様書どおりに) 適用する 未サポート 46.0         46.0

[1] Firefox 39 まで、コンテキストメニューや中クリックでナビゲーションを行った際に referrer の値が考慮されていませんでした。

関連情報

ドキュメントのタグと貢献者

タグ: 
 このページの貢献者: mizunashi_mana, hashedhyphen, yyss
 最終更新者: mizunashi_mana,