HTML文書の全体構造

Updated / Published

最初のHTMLが1989年に誕生してから、WWWの普及に伴い、様々な独自仕様のHTMLが氾濫してきました。それらは環境に強く依存するものであったため、WWWの生みの親であるティム・バーナーズ=リー博士はCERNを離れ1994年10月1日にWebの標準化を進める団体としてW3Cを創設、この団体のもとで HTMLの仕様が策定されました。仕様に沿うことで、HTML文書はより多くの環境で的確に情報を表現できるウェブページとなり得ます。

本稿では、1999年12月に勧告されたHTML4.01仕様をもとに解説します。1999年12月に基づく情報となると古いように思われますが、紆余曲折あったHTMLが原点回帰した画期的なバージョンのHTMLであり、現在でも広く使われています。また初学者の方には、HTML4.01の仕様を知ることでHTMLの時代的背景や本来使われるべき使い方を学ぶことができるきっかけとなることが期待できます。それでは、ここからはHTML4.01仕様におけるHTML文書の作法に入っていきましょう。

DOCTYPE宣言(文書型宣言)

HTML の標準(仕様)を定義していることを Document Type Definition(文書型定義)と呼びます。正しい規格に則って HTML文書を記述するためには DTD(文書型定義)を記述する必要があります。DTD(文書型定義)を宣言することを DOCTYPE宣言(文章型宣言)と呼び、その文書が HTML のどのバージョン(規格)で記述されているかを宣言します。

Document Type(文書型)を示す意味

HTML には、これまでにも様々なバージョンの HTML が存在します。Document Type(文書型)を示すことで、どのマークアップ言語をどのバージョンで使用するかを決めます。これにより、その文書がどのバージョンに属しているかを明示し、他のバージョンとの区別をつけて混乱を避けるための情報となります。バージョン毎に、それぞれの文書型が用意されており、このバージョンでは、どのような要素や属性、属性値を指定することができるということが定義されています。そして、制作者は宣言した文書型に応じて、定義されている仕様(ルール)に沿った文書を作成しなければいけません。言ってみれば DOCTYPE宣言(文書型宣言)とは、「この HTML文書は定められた規格に則って書かれたものです」と宣言するものです。

なお、DTD(文書型定義)は絶対に記述しなくてはいけないものではありません。適正な HTML であることを宣言するために必要な指定であり、DTD が宣言されていなくてもブラウザなどの UA はウェブページとして普通に表示します。

本稿では、仕様云々のことはよくわからないという場合は、以下に紹介する HTML4.01移行型DTD を記述することをおすすめます。HTML4.01移行型DTD は、W3C の策定した HTML4.01 の仕様において廃止、または廃止予定の古い非推奨要素・属性を使用する HTML文書の場合に適しています。つまり、ある程度ルーズな記述が可能になります。しっかりと仕様のことを理解したいという方は、HTML4.01厳密型DTDを採用されることをおすすめします。厳格な記述が求められる分、HTMLのルールがよく理解できるようになります。

HTML4.01厳密型DTD

W3C の仕様で「推奨しない」とされる要素や属性、さらにフレーム用の内容を使用しない。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

なお、DTD(文書型定義)にアドレス(URI)の記述が含まれていますが、次のように省略して記述することができます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">

HTML4.01移行型DTD

厳密型DTDに加えて、W3C の仕様で「推奨しない」とされる要素や属性も使用する。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

移行型DTDもURIを省略した場合は次のように記述することができます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

HTML4.01フレーム設定型DTD

移行型DTDに加えて、フレーム用の内容も使用する。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

フレーム設定型DTDもURIを省略した場合は次のように記述することができます。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">

HTML文書の情報を読みとって、それをディスプレイ上に表示するブラウザは、このDOCTYPE宣言(文書型宣言)に従って表示(レンダリング)方法が異なります。たとえば、HTML4.01厳密型DTD を記述すると、HTML4.01 の仕様において「非推奨(廃止、または廃止予定)」とされる古い要素や属性を指定していた部分をすべてはじきだして表示(レンダリング)することが期待されます。また、それら「推奨しない」とされる要素や属性の多くは、CSS(カスケーディングスタイルシート)を使って指定することが推奨されています。また、HTML4.01フレーム設定型DTD は、ひとつのページを分割して表示できるフレーム(frameset要素)を使用する場合にのみ記述します。

HTML文書の基本構造

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>HTML文書の基本構造</title>
</head>
<body>
本文の内容
</body>
</html>

HTML の要素はすべて開始タグ("<要素型名>")と終了タグ("</要素型名>")で構成されています。上記のサンプルにある html要素, head要素, body要素もすべて "<html>" と "</html>", "<head>" と "</head>", "<body>" と "<body>" の構成になっており、それぞれ次のような意味をもちます。

  • html要素は、この文書が HTML文書であることを定義します。HTML文書の一番頭(文書型宣言がある場合は文書型定義の直下)に "<html>"、最後尾に "</html>" を置いて、HTMLソース全体を囲みます。
  • head要素は、ヘッダと呼ばれる文書に関する情報を定義します。"<head>" と "</head>" の間には、文書のデータ形式やタイトル、キーワード、要約文、制作者情報など文書に関する各種の情報を記入します。
  • body要素は、文書の本体を定義します。"<body>" と "<body>" の間には、文書の本文となる内容を記述します。ここに書き込まれた内容がブラウザなどで閲覧した際に表示される部分になります。

文書の本体を表す要素には、body要素の他に frameset要素があります。frameset要素は、フレームを使用する場合にのみ定義します。フレームはページを四角の枠に分割して、ひとつのページ内に複数のページの分割表示を可能にします。

登場要素の詳解