→
メタ データ名。
name 属性を持つ場合、文書のメタ データを設定する。文書のメタ データは、名前と値のペアの観点から表される。META 要素の name 属性が名前を与え、同じ要素の content 属性が値を与える。名前はメタ データのどの側面を設定するかを指定する。META要素がcontent属性を持たない場合、メタデータの名前と値のペアの値部分は、空文字列である。
名前は大文字・小文字を区別せず、かつ ASCII 大文字・小文字を区別しない方法で比較されなければならない。
name 属性のキーワード:
キーワード | 備考 |
---|---|
application-name
| ページが表すウェブ アプリケーションの名前。 |
author
| ページ著者のうちの一人の名前。 |
color-scheme
| ユーザー エージェントが希望のカラー スキームでページの背景をすぐにレンダリングするのを支援する。 |
description
| ページを説明する自由形式の文字列。 |
generator
| このページを生成したソフトウェアの識別子です。 |
keywords
| ページに関連するキーワード。 |
referrer
| 文書のデフォルトのリファラー ポリシーを定義する。 |
theme-color
| ユーザー エージェントがページや周囲のユーザー インターフェイスのの表示をカスタマイズするために使用すべき提案される色を定義する。 |
キーワード | 備考 |
---|---|
viewport
| このビューポートの初期の寸法の大きさについてのヒントを指定します。モバイル端末でのみ使用されます。 |
キーワード | 備考 |
---|---|
creator
| この文書の作成者の名前で、組織や機関などです。複数ある場合は、複数の <META> 要素を使用する必要があります。 |
googlebot
| robots と同様ですが、Googlebot(Google のインデックス作成用クローラー)のみが従います。 |
publisher
| この文書の発行者の名前です。 |
robots
| 協力的なクローラー、つまり「ロボット」がページに対して使用すべき動作です。 |
application-name
値(content属性)は、ページが表すウェブ アプリケーションの名前を与える短い自由形式の文字列でなければならない。ページがウェブ アプリケーションでない場合、application-name メタ データ名を使用してはならない。それぞれの名前の言語を指定するlang属性を使用することで、ウェブ アプリケーション名の翻訳は与えられてもよい。
与えられる言語をもつ複数の META 要素が存在してはならず、かつ name 属性値が文書ごとに値 application-name と ASCII 大文字・小文字不区別で一致する。
タイトルはステータス メッセージを含むかもしれず、アプリケーションの名前であること代わりに特定の時点でページの状態に関連かもしれないので、ユーザー エージェントは、ページの TITLE 要素に優先して UI でアプリケーション名を使用してもよい。
指定された言語の順序付きのリスト(たとえばイギリス英語、アメリカ英語、英語)を使用するためにアプリケーション名を検索するには、ユーザー エージェントは次の手順を実行しなければならない:
¶省く
author
値は、ページ著者のうちの一人の名前を与える、自由形式の文字列でなければならない。
color-scheme
ユーザー エージェントが(ページ内のすべての CSS が読み込まれるのを待つのではなく)希望のカラー スキームでページの背景をすぐにレンダリングするのを支援するために、META 要素で 'color-scheme' 値を提供できる。
値は、CSS 'color-scheme' プロパティ値の構文と一致する文字列でなければならず、以下で説明するように、文書ルート要素の color-scheme 宣言とともにカスケードされる。
文書で color-scheme に ASCII 大文字・小文字不区別一致で設定される name 属性値をもつ複数の META 要素が存在してはならない。
normal
[light | dark]+
only light
次の宣言は、ページが暗い背景色と明るい前景色のカラー スキームを認識して、処理できることを示す:
<META name="color-scheme" content="dark">
これは、CSS の color-scheme プロパティで個々の要素が好みの配色と受け入れられる配色を指定できるのと同じように、文書レベルで機能します。スタイルは、 という CSS メディア機能を使って、現在の配色に合わせることができます。
description
値は、ページを説明する自由形式の文字列でなければならない。たとえば検索エンジン内など、値はページのディレクトリーで使用するために適切なものでなければならない。name 属性値が文書ごとの description に ASCII 大文字・小文字不区別で一致する場合、複数のMETA要素が存在してはならない。
generator
値は、文書を生成するために使用されるソフトウェア パッケージの 1 つを識別する自由形式の文字列でなければならない。この値は、たとえばマークアップがテキスト エディターでユーザーによって記述されたページのように、マークアップがソフトウェアによって生成されないページで使用してはならない。
"Frontweaver" と呼ばれるツールは、ページ生成のために使用されるツールとして自分自身を識別するために、ページのHEAD要素内にその出力で含むかもしれない:
<META name=generator content="Frontweaver 8.2">
keywords
値は、それぞれがページに関連するキーワードである、コンマ区切りトークンの集合でなければならない。
イギリスの高速道路上の書体に関するこのページは、ユーザーがページを検索するために使用するかもしれないキーワードを指定するMETA要素を使用している:
<!DOCTYPE HTML> <HTML lang="en-GB"> <HEAD> <TITLE>Typefaces on UK motorways</TITLE> <META name="keywords" content="british,type face,font,fonts,highway,highways"> </HEAD> <BODY> ...
referrer
値(content属性)は、文書のデフォルトのを定義する、リファラー ポリシーでなければならない。→A
no-referrer
origin
no-referrer-when-downgrade
origin-when-cross-origin
same-origin
strict-origin
strict-origin-when-cross-origin
unsafe-URL
theme-color
値は、ユーザー エージェントがページや周囲のユーザー インターフェイスのの表示をカスタマイズするために使用すべき提案される色を定義する、CSS <color> 生成物とマッチする文字列でなければならない。たとえば、ブラウザーは、指定された値でページのタイトルバーに色をつけるかもしれず、またはタブ バーやタスク スイッチャーでカラー ハイライトとして使用するかもしれない。
文書ごとに theme-color に ASCII 大文字・小文字不区別一致で設定される name 属性値を持つ複数の META 要素が存在してはならない。
この標準自身は、テーマ カラーとして"WHATWG green"を使用している:
<META name="theme-color" content="#3c790a">
viewport
このの初期の寸法の大きさについてのヒントを指定します。モバイル端末でのみ使用されます。
値 | 使用可能なサブ値 | 解説 |
---|---|---|
width
| 正の整数値、または device-width のテキスト
| ウェブサイトを表示させるビューポートのピクセル単位の幅を定義します。 |
height
| 正の整数値、または device-height のテキスト
| ビューポートの高さを定義します。どのブラウザーでも使用されていません。 |
initial-scale
| 0.0 と 10.0 の間の正の実数
| 端末の幅(縦長画面で device-width、横長画面で device-height)とビューポートの寸法の比率を定義します。 |
maximum-scale
| 0.0 と 10.0 の間の正の実数
| 拡大縮小インする最大値を定義します。minimum-scale 以上でなければ、動作は未定義です。ブラウザーの設定でこの規則を無視することができ、iOS 10 以降では既定で無視されます。 |
minimum-scale
| 0.0 と 10.0 の間の正の実数
| 拡大縮小レベルの最小値を定義します。maximum-scale 以下でなければ、動作は未定義です。ブラウザーの設定でこの規則を無視することができ、iOS 10 以降では既定で無視されます。 |
user-scalable
| yes または no
| no に設定された場合は、ユーザーがウェブページを拡大縮小することができなくなります。既定値は yes です。ブラウザーの設定でこの規則を無視することができ、iOS 10 以降では既定で無視されます。 |
viewport-fit
| auto 、contain 、cover
| auto の値は、初期レイアウトのビューポートに影響を与えず、ウェブページ全体が表示されます。
contain の値は、ディスプレイに内接する最大の長方形に合わせてビューポートが拡大されることを意味します。 cover の値は、ビューポートが端末のディスプレイいっぱいになるように縮小されることを意味します。 重要なコンテンツがディスプレイの外に出てしまわないように、safe-area-inset-* 変数を使用することを強くお勧めします。 |
ビューポートの拡大縮小についてのアクセシビリティの考慮:
user-scalable を no に設定して拡大縮小機能を無効にすると、弱視の人がページの内容を読んだり理解したりすることができなくなります。
関連情報:
CSS の @viewport アット規則。
例:
<meta name="viewport" content="width=device-width, initial-scale=1">
creator
この文書の作成者の名前で、組織や機関などです。複数ある場合は、複数の <META> 要素を使用する必要があります。
googlebot
robots と同様ですが、Googlebot(Google のインデックス作成用クローラー)のみが従います。
publisher
この文書の発行者の名前です。
robots
協力的なクローラー、つまり「ロボット」がページに対して使用すべき動作です。
以下の値をカンマで区切ったリストです。
値 | 解説 | 使用者(¶サイト?) |
---|---|---|
index
| ロボットがこのページをインデックスすることを許可します(既定値)。 | すべて |
noindex
| ロボットにこのページをインデックスしないよう要求します。 | すべて |
follow
| ロボットがこのページ上のリンクをたどることを許可します(既定値)。 | すべて |
nofollow
| ロボットにこのページ上のリンクをたどらないよう要求します。 | すべて |
all
| index、follow と同等です。 | |
none
| noindex、nofollow と同等です。 | |
noarchive
| 検索エンジンにこのページの内容をキャッシュしないよう要求します。 | 、、 |
nosnippet
| 検索エンジンの結果でこのページの説明の表示を抑制します。 | Google、Bing |
noimageindex
| このページをインデックスされた画像の参照ページとして表示しないよう要求します。 | |
nocache
| noarchive と同等です。 | Bing |
表示内容: |
表示内容: |