metaタグの一覧です。
metaタグを使用するとページの情報を
ブラウザやGoogleなどの検索エンジンに伝えることができます。
ページの説明
ページの説明を明示するには、name="description"を使用します。
1 2 |
<meta name="description" content="XXX"> |
ここに記述した内容は検索エンジンによって使用され、検索結果に表示されます。
ページのキーワード
ページのキーワードを明示するには、name="keywords"を使用します。
1 2 |
<meta name="keywords" content="aaa, bbb, ccc"> |
ここに記述した内容は検索エンジンの検索キーワードに使用されます。
しかし最近の検索エンジンではそれほど重要視されないようです。
ページの作者
ページの作者を明示するには、name="author"を使用します。
1 2 |
<meta name="author" content="xxx"> |
何に使用されるかは不明です。
著作権の表示
著作権を明示するには、name="copyright"を使用します。
1 2 |
<meta name="copyright" content="XXX"> |
作成したエディタ
作成したエディタを明示するには、name="generator"を使用します。
1 2 |
<meta name="generator" content="notepad"> |
何に使用されるかは不明です。
検索ロボットの制御
検索ロボットにインデックスの方法を指示するには、name="robots"を使用します。
1 2 |
<meta name="robots" content="noindex,nofollow"> |
検索エンジンに対してインデックスしてほしくない時に記述します。但しここの記述を守るかどうかは各検索エンジンによるので必ずこの指定通りになるとは限りません。
noindex | 検索ロボットに対してインデックスに登録しないようにする指定。 |
---|---|
nofollow | 検索ロボットに対してページ内のリンクをたどらないようにする指定。 |
ページの言語
ページの言語を明示するには、http-equiv="content-language"を使用します。
1 2 |
<meta http-equiv="content-language" content="ja"> |
ブラウザが言語により最適な表示をしてくれます。
日本語 | ja | 中国語 | zh | ドイツ語 | de |
---|---|---|---|---|---|
英語 | en | 韓国語 | ko | フランス語 | fr |
イタリア語 | it | ロシア語 | ru |
ただ、現在はcontent-languageを使用する方法は非推奨なので、htmlタグにlang属性で指定してください。
1 2 |
<html lang="ja"> |
ページの文字コード
ページの文字コードを明示するには、http-equiv="Content-Type"を使用します。
1 2 3 4 5 |
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Type" content="text/html; charset=iso-2022-jp"> <meta http-equiv="Content-Type" content="text/html; charset=euc-jp"> <meta http-equiv="Content-Type" content="text/html; charset=Windows-31J"> |
UTF-8 | UTF-8 |
---|---|
SHIFT-JIS | Shift_JIS |
JIS | iso-2022-jp |
EUC | euc-jp |
Windows-31J | Windows-31J |
HTMLが記述された言語を指定してください。
ページの文字コードとここに指定した文字コードが異なると文字化けを起こします。
HTML5であれば以下の指定でOKです。
1 2 |
<meta charset="UTF-8"> |
スタイル言語
スタイルを明示するには、http-equiv="Content-Style-Type"を使用します。
1 2 |
<meta http-equiv="Content-Style-Type" content="text/css"> |
指定しなければデフォルトでtext/cssになるので、特殊なスタイル言語を使用しない限り基本的に指定しなくても問題はありません。
デフォルトスタイル
デフォルトスタイルを明示するには、http-equiv="default-style"を使用します。
1 2 |
<meta http-equiv="default-style" content="common.css"> |
複数のスタイルシートファイルを読み込ませた時、default-styleに指定したものが最優先で適用されます。
スクリプト言語
使用するスクリプト言語を明示するには、http-equiv="Content-Script-Type"を使用します。
1 2 |
<meta http-equiv="Content-Script-Type" content="text/javascript"> |
指定しなければデフォルトでtext/javascriptになるので、特殊なスクリプト言語を使用しない限り基本的に指定しなくても問題はありません。
ページ再読み込み
ページの再読み込みを行うには、http-equiv="refresh"を使用します。
数値は再読み込みをする間隔で、秒単位で指定します。
1 2 |
<meta http-equiv="refresh" content="10"> |
数値の後ろにページを指定すると、指定した秒経過後に指定したページで再読み込みされます。
1 2 |
<meta http-equiv="refresh" content="10; url=test.htm"> |
ページキャッシュの無効化
ページキャッシュの無効化を指定するには、http-equiv="Pragma"または、
http-equiv="Cache-Control"を使用します。
1 2 3 |
<meta http-equiv="Pragma" content="no-cache"> <meta http-equiv="Cache-Control" content="no-cache"> |
キャッシュ無効化時は、基本的に両方指定します。
うまく行かない時は有効期限も指定してください。
ページキャッシュの有効期限
ページキャッシュの有効期限を指定するには、http-equiv="Expires"を使用します。
1 2 3 |
<meta http-equiv="Expires" content="Tue, 31 Dec 2019 23:59:59 GMT"> <meta http-equiv="Expires" content="86400"> |
GMT時刻で指定する方法と、ページを読み込んだ時から〇日間といったように指定する方法の2パターン指定できます。
トランジションの指定
トランジション(ページ遷移時のビジュアル効果)の指定をするには、
http-equiv="Page-Enter"を使用します。
1 2 |
<meta http-equiv="Page-Enter" content="blendTrans(Duration=1,Transition=12)"> |
コメント