ウェブランサー

<meta> ドキュメントに関するメタ情報を追加する

対応ブラウザ
IE7対応IE8対応Firefox対応Chrome対応Opera対応Safari対応
タイプ -
取り扱い 標準

<meta>タグは、<head>~</head>内に埋め込む情報を記述するためのものです。内容のキーワードや説明文、文字コードや言語タイプなど様々な属性を指定出来ます。

また、metaは終了タグがありません。どこからどこまでという範囲指定が必要ないため、開始タグを記述し、そこに属性を指定して終わりです。

HTML5では、文字コードの指定方法が変わったことが特徴的です。また、name属性の値に、[application-name]が追加されました。そのページがWebアプリケーションである場合に使用します。

<meta>タグに指定できる属性

HTML5

charset="文字コード"
文字コードを指定します。
http-equiv="キーワード"
HTTPヘッダにコンテンツ属性を加えます。
name="キーワード"
メタ情報の名前を指定します。
content="文字列"
name属性で指定したプロパティの内容を指定します。

(X)HTML4.01

http-equiv="キーワード"
HTTPヘッダにコンテンツ属性を加えます。
name="キーワード"
メタ情報の名前を指定します。
content="文字列"
name属性で指定したプロパティの内容を指定します。

<meta>の使用サンプル

文字コードの指定
日本語の文字化けを防ぐために文字コードを指定します。
(X)HTML4.01
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=euc-jp" />
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
HTML5
<meta charset="UTF-8">
<meta charset="euc-jp">
<meta charset="Shift_JIS">
キーワードの指定
ドキュメントに関連するキーワードを指定することができます。
(X)HTML共通
<meta name="keywords" content="キーワード1,キーワード2" />
<meta name="keywords" content="キーワード1,キーワード2">
概要の指定
ドキュメントの内容に関して、簡単な説明文を加える事が出来ます。検索結果や特定のブラウザのブックマーク時の説明文として表示されます。
(X)HTML共通
<meta name="description" content="このページについて簡単な説明をします。" />
<meta name="description" content="このページについて簡単な説明をします。">
基準スタイルシート言語の宣言
スタイルシートを使う場合には記述しておきましょう。
(X)HTML4.01
<meta http-equiv="Content-Style-Type" content="text/css" />
基準スクリプト言語の宣言
Javaなどを使う際の基準となる言語指定です。Javascriptを使用する際は、とりあえず記述しておきましょう。
(X)HTML4.01
<meta http-equiv="Content-Script-Type" content="text/javascript" />
文書の著者
誰が作ったページなのか明確にしたい場合、ドキュメントの著者を宣言します。name="author"が文書の作者、name="copyright"が著作権に関する情報を表します。
(X)HTML共通
<meta name="author" content="MyNAME" />
<meta name="copyright" content="Copyright NAME" />
<meta name="author" content="MyNAME">
<meta name="copyright" content="Copyright NAME">
画面の再読み込み(リフレッシュ)
ある一定の期間で自動的に再読み込み(更新)してくれます。
(X)HTML共通
<meta http-equiv="refresh" content="10" />
<meta http-equiv="refresh" content="10">
自動ジャンプ(リダイレクト)
別ページへ自動的にジャンプします。サイトの引越しでURLが変わった時などによく見られますね。
(X)HTML4.01
<meta http-equiv="refresh" content="10;url=http://example.com/" />
HTML5
<meta http-equiv="refresh" content="10" url="http://example.com/">
キャッシュの制御
キャッシュの制御を行います。見た人のブラウザに履歴をキャッシュされるのを防ぎます。
(X)HTML4.01
<meta http-equiv="Pragma" content="no-cache" />
キャッシュの有効期限を定義
キャッシュの有効期限を定義します。キャッシュが消去されるタイミングを指定する事が出来ます。
(X)HTML4.01
<meta http-equiv="Expires" content="Wed, 31 December 2008 20:00:00 GMT" />
検索ロボットの制御
検索ロボットの制御を行います。検索対象に含んで欲しいページと、そうでないページを指定出来ます。
・[index]   :インデックスする事を許可
・[noindex] :インデックスを禁止
・[follow]  :リンク先の参照を許可
・[nofollow]:リンク先の参照を禁止
(X)HTML共通
<meta name="robots" content="index,follow" />
<meta name="robots" content="noindex,nofollow" />
<meta name="robots" content="index,follow">
<meta name="robots" content="noindex,nofollow">

<meta>に関連するHTMLタグ

ルート・ヘッダー・メタデータ要素
<base> ページの基準となるURLを指定する
<!DOCTYPE> ドキュメントタイプの宣言
<head> ドキュメントのヘッダーを定義する
<html> HTML文書の開始を宣言してドキュメントルートを定義する
<link> 関連するファイルをリンクする
<meta> ドキュメントについてのメタ情報を追加する
<style> スタイルシートを指定する
<title> ウェブページのタイトルを指定する