HTML5タグ虎の巻

metaタグ

metaは、ページの情報を指定するタグです。

解説

metaタグは、headタグの子要素として指定します。

基本的に指定したい項目ごとに記述方法が大体決まっているので、以下サンプルをコピペして使用してください。

コンテンツ・モデル

カテゴリー
(自カテゴリ)
メタデータ・コンテンツ
コンテキスト
(親カテゴリ)
メタデータ・コンテンツを許可する場所
コンテンツ・モデル
(子カテゴリ)
なし

属性

metaタグには以下の属性が指定できます。

【属性】
属性説明
nameメタデータ名を指定する
(例)name="keywords"
http-equivプラグマ指示子を指定する
(例)http-equiv="content-type"
contentメタデータ、プラグマ指示子の値を指定する
(例)disabled="disabled"
charset文字コードを指定する
(例)charset="utf-8"

サンプル

文字エンコーディングを指定する

<meta charset="utf-8">

「utf-8」、「shift_jis」、「euc-jp」などを指定できます。

ページのキーワードを指定する

<meta name="keywords" content="キーワード1,キーワード2,キーワード3">

カンマで区切って複数指定できます。

ページの説明を指定する

<meta name="description" content="ページの説明文">

検索エンジンの検索結果に使用されます。

検索エンジンがインデックスとページのリンクを辿らないように指定する

<meta name="robots" content="noindex,nofollow">

この指定を読み取ってくれる検索エンジンにのみ有効です。

ページの作者を指定する

<meta name="author" content="作者">

ページの作成に使用したツールを指定する

<meta name="generator" content="ツール名">

ページの使用言語を指定する

<meta http-equiv="content-language" content="ja">

日本語:ja、英語:en、フランス語:fr、スペイン語:es、中国語:zh などが指定できます。

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

<meta http-equiv="content-type" content="text/html;charset=utf-8">

デフォルトのCSSを指定する

<meta http-equiv="default-style" content="common.css">

複数のCSSを読み込んでいるときに最優先で有効になるCSSを指定します。

5秒後にページの再読み込みを行う

<meta http-equiv="refresh" content="5">

60秒後にhoge.htmlへ遷移する

<meta http-equiv="refresh" content="60;url=hoge.html">

サンプル

文字コードをUTF-8、作成者をTaro、キーワードをワード1,ワード2 とする

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <meta name="author" content="Taro">
    <meta name="keywords" content="ワード1,ワード2">
    <title>サンプル</title>
  </head>
  <body>
    <p>サンプルです</p>
  </body>
</html>

関連項目

  • head:HTML文章のヘッダ情報を表す