文書に関する情報の定義
Updated / Published
ヘッダと呼ばれる文書に関する情報を定義するhead要素内の記述について解説します。
タイトル（表題）の定義
<html>
<head>
<title>ページのタイトル</title>
</head>
<body>
......title要素は "<head>" と "</head>" の間に挟まれるヘッダ情報のひとつで、HTML文書のタイトル（表題）となります。HTML文書には、必ず head要素内に1つの title要素を記述する必要があります。
"<head>" と "</head>" の間に挟まれた文字列は、ブラウザではタイトルバー（ウインドウ上部）に表示されます。また、ブラウザのブックマーク（お気に入り）に登録した際のタイトルにもなり、さらに Yahoo! や Google などの検索エンジンでは、検索結果に表示されるリンクのタイトルとなります。タイトルにHTML仕様上の文字数制限はありませんが、検索エンジンの検索結果では全角25文字から30文字前後以降の長いタイトルは省略して表示されるようです。このため、HTML文書をウェブページとしてWWW上に公開して以降は、タイトルの付け方次第でアクセス率にも大きく関わります。以下に示すタイトルを設定する際の注意点を参考に、各ページごとに適切なタイトルを設定するようにしましょう。
タイトルを設定する際の注意点
- 長い名称、一般的でない名称は避ける(例：HyperText Markup Language は HTML とした方が一般的)。
- 「★、●」などの記号や「！」などの感嘆符を含めない(検索エンジンは記号や感嘆符を無視する)。
- タイトルは複数のキーワードで構成する （例: "Web制作解説" → "Web" 、"制作"、"解説"の3つで構成されている）。
- タイトル内のキーワードは本文で繰り返されるものにする（逆にタイトルと内容が一致していないのは不自然）。
- 極力全角25〜30文字前後におさめる（検索エンジンの結果でが、全角25文字から30文字前後以降を省略して表示するため）。
なお、title要素が指定されていない場合、ブラウザのタイトルバー（ウインドウの上部）には自動的に URI（アドレス）が表示されることが多いようです。
- 登場要素の詳解
title要素
補足情報（メタ情報）の定義
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="keywords" Content="title要素,meta要素,link要素">
<meta name="description" Content="文書に関する様々な情報の定義について。">
<meta name="ROBOTS" content="INDEX,FOLLOW">
<title>文書に関する情報の定義</title>
</head>
<body>
......meta要素は "<head>" と "</head>" 間に、このウェブページの制作者や制作年月日、連絡先などの様々な補足情報（メタ情報）を定義します。なお、このように補足情報（メタ情報）を示すのは英語圏の論文形式を踏襲していることに由来します。英語圏の論文は「表題・著者名・所属機関名・要約・キーワード・本文+文献」で構成されており、同じように HTML文書では meta要素を使って様々な補足情報（メタ情報）を示します。
記述されている文字コードを指定する
コンピュータ上の文字にはコードとして固有の数値が割り当てられています。それぞれの文字のコードの対応表のようなものがあり、どの対応表を用いてHTML文書の文字を解析すれば良いのかを文字コードと呼ばれるもので指定します。
<meta http-equiv="Content-Type" content="text/html; charset=文字コード">- 検索エンジンロボットやブラウザなどHTML文書の情報を読み取って解析するソフトウェア(UA)が正しく解釈できるように働きかけます。
- 日本語が扱える代表的な文字コードには、
Shift_JIS,EUC-JP,ISO-2022-JP,UTF-8があります。
検索のヒット率を上げるためのウェブページのキーワードを指定する
<meta name="keywords" content="キーワード1,2,3">- 文書の内容を表すキーワードをカンマ（
,）で区切って3個から10個程度並べます。 - 文書の内容に実際に記述されていないキーワードや、同一キーワードを繰り返し記述することのないようにしましょう。
検索結果の説明部分（スニペット）になる要約文（ウェブページの概要）を指定する
ここに記述された要約文が検索結果に表示されるウェブページの説明部分（スニペット）となります。
<meta name="description" content="ウェブページの概要">- その文書の扱っている内容の要約文を記述します。
- 極力全角80文字以内に収めます。80文字以上の記述があっても省略して表示されます。
検索エンジンロボットにウェブページの登録とリンク先を辿る可否を指定する
<meta name="ROBOTS" content="可否">- 特に指定がなければ検索エンジンロボットは自動的にウェブページの情報を収集し、そのウェブページ内のリンク先を辿って、他のウェブページの情報を収集するので、フレームのメニューページやポップアップページなど、このページには検索された際に直接飛んでこられては困るようなページがある場合に限り、ロボットの行動を制御する記述を行います。
- このロボットの動きを制御する
meta要素の属性値の半角アルファベットは大文字で記述するのが正式とされますが、小文字でも問題なく認識できるようです。属性値は次の通りです。
| ページ登録 | リンク先を辿る | タグの表記例 |
|---|---|---|
| ◯ | ◯ | <meta name="ROBOTS" content="ALL"> |
| ◯ | ◯ | <meta name="ROBOTS" content="INDEX,FOLLOW"> |
| ◯ | × | <meta name="ROBOTS" content="INDEX,NOFOLLOW"> |
| × | ◯ | <meta name="ROBOTS" content="NOINDEX,FOLLOW"> |
| × | × | <meta name="ROBOTS" content="NOINDEX,NOFOLLOW"> |
| × | × | <meta name="ROBOTS" content="NONE"> |
- 登場要素の詳解
meta要素
関連（リンク）性の定義
<html><head>
<title>2.html</title>
<link rel="prev" href="1.html">
<link rel="next" href="3.html">
<link rev="prev" href="3.html">
</head><body>
......link要素は、そのウェブページとの関連（リンク）性を示します。title要素や meta要素と同じ様に、"<head>" と "</head>" の間に記述します。この link要素は、複数のウェブページがサイト内にある場合に、現在観覧しているウェブページのサイト内でのポジション（位置）を示すことに使用したりします。rel属性は順方向で現在のウェブページ（始点）から見たリンク先のリソースに対する関係を示します。rev属性は逆方向でリンク先のリソース（終点）から見た現在のウェブページに対する関係を示します。
rel属性、rev属性の値には次の link-type（リンクタイプ）と呼ばれるキーワードがあります。
alternate- この文書の代替にあたる文書を示す
appendix- この文書の付属書にあたる文書を示す
bookmark- 文書内の重要なアンカーへのリンクを示す
contents- この文書の目次にあたる文書を示す
copyright- 著作権に関する記述のある文書を示す
glossary- 指定する文書が用語集であることを示す
help- この文書のヘルプにあたる文書を示す
index- この文書の索引にあたる文書を示す
next- この文書の次の文書であることを示す
prev- この文書の前の文書であることを示す
start- 一連の文書の中で最初の文書を示す
chapter- 一連の文書の中で章にあたる文書を示す
section- 一連の文書の中で節にあたる文書を示す
subsection- 一連の文書の中で項にあたる文書を示す
stylesheet- 制作者スタイルシートの参照を示す
キーワードは半角アルファベットの大文字・小文字が区別されません（case-insensitive）。複数指定する場合は、半角スペースで区切って列記（例：rel="prev help"）します。
- 登場要素の詳解
link要素