metaタグで情報を付加する
2014年5月18日:HTML
画面には表示されないが、検索エンジンなどのプログラムが利用する情報としてmetaがあります。
このmetaを使用することで
- 文章のキーワード
- 文章の要約
- 使用している文字エンコードの種類
などを指定することができます。
検索エンジン用にキーワードや要約などを指定する
キーワードと要約
よく使用するmeta情報としてキーワードや要約があります。
これらの情報を見ることで、このHTMLファイルで記述されている概ねの内容を把握できるのでとても大切です。
ページに書かれている内容のキーワードと要約を的確に記述しましょう。
指定の仕方は
<meta name="keywords" content="キーワード1,キーワード2" /> <meta name="description" content="ここに要約" />
とします。キーワードはコンマで区切ります。
検索エンジンの制御
検索エンジンに対して、検索結果にのせてほしくない場合などがあります。
これらのことを検索エンジンにmetaタグを通じて伝えることができます。
その方法は
<meta name="robots" content="X" />
のようにして、Xの部分に
- index:ページをインデックスすることを許可する(検索エンジンの結果にのる)
- noindex:ページをインデックスすることを許可しない(検索エンジンの結果にのらない)
- follow:リンクをたどることを許可する
- nofollow:リンクをたどることを許可しない
- all:index,followをいずれも許可する
- none:index,followをいずれも許可しない
を記述します。
検索エンジンに載せたくない場合は「noindex」を指定します。
そして、ページにはってあるリンクを検索エンジンにたどってほしくない場合は「nofollow」を指定しましょう。
著者情報を指定する
文章を書いた著者・著作権・連絡先をMetaタグで以下のように指定できます。
<meta name="author" content="著者の名前" /> <meta name="copyright" contnet="著作権保持者" /> <meta name="reply-to" contnet="XXX@YYY.com" />
- authorがページを書いた著者の名前
- copyrightがページの著作権保持者
- reply-toにはページに関する連絡先
をそれぞれ記述します。
ファイルの種類を指定する
読み込んでいるファイルでは、どの種類のスタイルシートやスクリプト言語を使用しているかを指定できます。
例えば、
<meta http-equiv="Content-Style-Type" content="text/css" />
とすれば、CSSをスタイルシートとして使用していることを示し、
<meta http-equiv="Content-Script-Type" content="text/javascript" />
なら、JavaScriptを使用していることを示すことができます。
CSSやJavaScriptを使用する場合はこれらの記述を入れるようにしましょう。
使用している文字エンコード方式を指定する
文字形式には、様々な形式があります。
- UTF-8
- Shift-JIS
- EUC-JP
などです。
文字エンコードを指定しないと文字化けが起こります。
ですから、metaに文字エンコード方式を記述することで、文字化けを防ぐことができます。
必ず記述するようにしましょう。
記述は以下のようにします。
【UTF-8の場合】
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
【Shift-JISの場合】
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
【EUC-JPの場合】
<meta http-equiv="Content-Type" content="text/html; charset=EUC-JP">
これらは文章の種類はHTMLで文字エンコードはそれぞれUTF-8、Shift-JIS、EUC-JPを意味しています。
最近の流れとしてUTF-8の使用が推奨されているので、UTF-8を使うようにしてください。
著者:安井 真人(やすい まさと)
@yasui_masatoさんをフォロー