head要素内には、ページ情報を扱う内容を記述します。主に以下のような要素を記述します。
<title>要素
文書にタイトルをつけるための要素で、記述は必須です。この要素に囲まれた内容は、ブラウザのタイトルバーに表示されます。この用途としては、その文書のお気に入りに登録された時に使用されます。また、検索エンジンの検索結果に表示されたり、検索キーワードとして使用されます。
例）<title>ページタイトル</title>
<link>要素
関連する別のページとの関係を示します。link要素の属性には以下のようなものがあります。
| 属性 | 値 | 説明 |
|---|---|---|
| rel | stylesheet（外部スタイルシートを示す） contents（目次の文書を示す） bookmark（ブックマークを示す） |
現在の文書から見たリンク先の関係を示す |
| rev | リンク先から見た現在の文書の関係を示す | |
| href | リンク先へのパスを記述 | リンク先の文書を指定 |
<meta>要素
文書に関するメタ情報（文書情報）を指定するための要素です。文書で使用される言語や文字コード、Webページに関する制作者、説明文、キーワードなどを指定します。
属性には必須属性となる「content」、任意属性となる「name」、「http-equiv」、「scheme」などがあります。各種情報の記述には以下のような種類があります。
文字コード
Webページの文字コードを宣言します。このmeta情報を記述することによって文字化けの発生を抑えることができます。特に日本語を用いる場合は指定したほうが良いです。
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
charset=""のダブルクォーテションの中は、Webページを保存した際のテキストエディタの文字コードに合わせて「shift_jis」、「utf-8」、「euc-jp」などに合わせます。特にphpやperlなどのプログラミングを記述したWebページの文字コードには気をつける必要があります。
スタイルシートを記述する時
Webページ内にスタイルシートを使ったデザイン・レイアウトを施す場合に必ず記述します。
<meta http-equiv="Content-Style-Type" content="text/css" />
JavaScriptを記述する時
Webページ内にJavaScriptを使って動的コンテンツを作成する場合に必ず記述します。
<meta http-equiv="Content-Script-Type" content="text/javascript" />
Webページの制作者などの情報
Webページの制作者情報を明記する時に記述します。ブラウザ上には表示されません。
<meta name="Author" content="制作者の名前などの情報" />
キーワードの記述
検索ロボットの中にはこのキーワードを解釈してくれるものがあるので、SEO対策の一環として記述します。通常、ページに関するキーワードを指定しますが、キーワードは半角カンマ(,)で区切ります。
<meta name="Keywords" content="キーワード1,キーワード2" />
Webページの説明書き
Webページに関する説明文を指定します。これもSEO対策の一環として記述します。
<meta name="Description" content="Webページの説明文" />
検索ロボットの制御
検索ロボットへの支持を示します。INDEXは検索を許可、NOINDEXは検索を禁止、FOLLOWはリンク先を手繰ることを許可、NOFOLLOWはリンク先参照を禁止の指定をします。
<meta name="Robots" content="INDEX,FOLLOW" />
以上の要素がhead要素内に記述する要素になります。meta情報には、まだたくさんの属性がありますが、すべてを記述する必要はありません。しかし、SEO対策なる属性は必ず記述するようにします。
【head要素内に記述する要素】