<meta>－HTML5タグリファレンス

トップページ > HTML5 > <meta>

★HTML5タグリファレンス

<meta> …… その文書に関する情報（メタデータ）を指定する
Internet Explorer4

このページでは、HTML5のmeta要素を解説しています。

meta要素の最新情報は、以下を参照してください。

HTML Living Standardリファレンス

https://www.htmq.com/htmls/meta.shtml

HTML文書のメタデータは<head>～</head>の中に、 <title>（タイトル）・ <base>（基準URL）・ <link>（リンク情報）・ <style>（スタイルシート）・ <script>（スクリプト）などのタグで指定しますが、これらのタグで表現できないその他の様々なメタデータは<meta>で表します。

メタデータには様々なものがありますが、以下に使用頻度の高いメタデータの指定方法を紹介します。

■charset属性で文字エンコーディングを指定

文字エンコーディングの指定

charset属性は、文書の文字エンコーディングを指定する際に使用します。日本語の文字エンコーディングの値としては、"utf-8"・"shift_jis"・"euc-jp"などが挙げられます。大文字と小文字の違いは区別されません。 charset属性を指定したmeta要素は、一つの文書に一つだけしか配置できません。尚、XML文書にmeta要素のcharset属性を指定する場合には、値には"utf-8"を指定します。

meta要素で文字エンコーディングを指定する場合、HTML 4では以下のように記述していました。

HTML5でも上の記述方法のままで問題ありませんが、charset属性を使用すれば以下のように短くすることができます。

文字エンコーディングを指定しないと、例えば、日本語で作成されたウェブページに英語版のブラウザでアクセスした場合などに文字化けが起きることがあります。必須ではありませんが、できるだけ指定したほうが良いでしょう。

■name属性でメタデータ名を定義、content属性でその内容を指定

検索エンジン向けのキーワード・説明・インデックスの指定

name="keywords"は、そのHTML文書がどのような内容を示したものかキーワードで指定します。複数のキーワードを指定する場合には、半角カンマ（,）区切りで指定します。

name="description"は、その文書の説明を短文で指定します。ここで指定する値は、Googleの検索結果に表示されるなど、多くの検索エンジンで利用されるので慎重に言葉を選んでください。

また、name="robots" content="noindex,nofollow"は、検索エンジンのクローラ（ロボット）に対して URLをインデックスしないように（noindex）、文書内のリンクをたどらないように（nofollow）知らせるための指定です。この指定はすべての検索エンジンに対して有効ではなく、この情報を参照する検索エンジンに対してのみ有効となる指定なので注意してください。検索エンジン対策として一般的に利用されていますが、W3Cの仕様には記載されていません。

文書の作者の指定

name="author"は、その文書の作者を示す際に指定します。

文書作成に使用したツールやソフトウェアの指定

name="generator"は、文書作成に使用したツールやソフトウェアを示すものです。これは、ツールやソフトウェアを使用してウェブページが自動生成された際に、そのツール自身がウェブページを出力する際にhead要素内に挿入するものです。手作りしたウェブページに使用するものではないので注意してください。

■http-equiv属性を指定すると、meta要素がプラグマ指示子となる

meta要素にhttp-equiv属性を指定すると、そのmeta要素はプラグマ指示子（pragma directive）となります。プラグマ指示子とは“実行命令を指示するもの”のことで、ユーザーエージェント（ブラウザ）に対して文書の“状態・挙動”を指示する役割があります。 http-equiv属性の値には、以下の4つのキーワードを指定することができます。

content-language …… コンテンツ言語の指定
content-type …… ファイルタイプや文字エンコーディングの指定
default-style …… デフォルトスタイルの指定
refresh …… リダイレクト・再読み込みの指定

コンテンツ言語の指定

http-equiv="content-language"は、文書の主言語を指定します。言語はcontent属性で指定します。例えば、日本語ならcontent="ja"、英語ならcontent="en"となります。その他の主な言語には、 zh（中国語）、ko（韓国語）、de（ドイツ語）、fr（フランス語）、it（イタリア語）、es（スペイン語）、ru（ロシア語）、ar（アラビア語）などがあります。

ファイルタイプや文字エンコーディングを指定をする

http-equiv="content-type"は、ファイルタイプや文字エンコーディングを指定します。ファイルタイプを指定する場合には、例えばHTML文書ならcontent="text/html"と指定します。また、文字エンコーディングを指定すれば、charset属性の代わりとして機能します。

デフォルトスタイルの指定

http-equiv="default-style"は、デフォルトスタイルを指定します。具体的には、例えば、content="default.css"のように記述して、デフォルトスタイルとなるCSSファイルのURIを指定します。この指定をすると、link要素で複数のCSSファイルを指定している場合に、その中で優先して利用するCSSファイルをブラウザに伝えることができます。

リダイレクト・再読み込みの指定

http-equiv="refresh"は、別のURLへのリダイレクトや現在ページの再読み込みを指定します。 content属性の値には何秒後にリフレッシュするかと、ジャンプ先のURLを指定します。例えば、5秒後にnewpage.htmlというページにリダイレクトする場合には以下のように記述します。

また、5分ごとに現在のページを再読み込みする場合には以下のように記述します。

※めも：w3.orgによれば、 meta要素によるrefreshを多用しているウェブサイトは、検索エンジンのリストから削除されることがあるようです。それを避けたい場合には、代わりに301リダイレクトを使用すると良いとのことです。

■HTML4.01からHTML5へのバージョンアップによる変更点

HTML5では、name属性の値として"application-name"が追加されています。 name="application-name"は、ウェブアプリケーションの名前を示すものです。これはウェブアプリケーションを作成する場合に利用する値であり、ページがウェブアプリケーションでない場合には使用してはいけません。また、使用する場合には一つの文書に一つだけ指定します。

■属性

name属性: メタデータの名前を指定
http-equiv属性: プラグマ指示子を指定
content属性: メタデータの値などを指定
charset属性: HTML文書の文字エンコーディングを指定

■使用例

HTMLソース

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-language" content="ja">
<meta charset="UTF-8">
<meta name="keywords" content="HTML,CSS,JavaScript,特殊文字,リファレンス">
<meta name="description" content="HTML・CSS等の早見表的リファレンス">
<meta name="robots" content="noindex,nofollow">
<meta name="author" content="HTMQ">
<title>HTMLクイックリファレンス</title>
</head>
<body>
<p>HTML・CSSについて紹介します。</p>
</body>
</html>