次へ: 3 Yahoo! ニュース記事の構造 上へ: AWK による HTML ファイルの整形 前へ: 1 はじめに (PDF ファイル: awkhtml.pdf)

2 HTML のおおまかな仕組み

HTML とは、HyperText Markup Language の略で、 WWW ページ文書を書くための書式を決めたものです。我々が普段見ている WWW ページ (何とか.html の形式のページ) はほぼすべてがこの規格に従って書かれています。

HTML は、文書の見た目の構造や論理的な構造をタグと呼ばれるマークアップ (印付け) によって示すやり方²を取っていて、文書の中にこのタグを含めて書いていきます。

HTML のタグは、

のように、ペアのタグで文書の部分を囲むものと、

のように、単独のタグで意味を持つものの 2 種類に大きく分かれます。

HTML 文書の基本的な構造は、以下のようになります:

<html>
<head> <title>タイトル</title>
</head>
<body>
本文
</body>
</html>

上にも見られますが、いくつか HTML 文書での決まりを上げます。

文書中の改行は入れても入れなくても表示とはあまり関係はなく、 HTML ファイルの本文中の改行は表示ではスペース一つと同じ意味になる (強制的に改行するには明示的に改行タグを書き入れる)
タグ名のアルファベットは大文字でも小文字でも構わず、同じ意味になる⁴
タグで囲んだ文書中にまたタグを使うこともできるが、その場合内側のタグ部分を終了させてから外側のタグ部分を終了させるように書く
タグにはオプションをつけることができるものもあり、その場合は、 <タグ名オプション名="その値" ...> のように書く。

次に、上で示したいくつかのタグの意味を紹介します。

<html> $\sim$ </html>: HTML 部分を明示するタグ。通常 HTML ページ全体がこれで囲まれる⁵。その中味はヘッダと本文に大きく分かれる。
<head> $\sim$ </head>: HTML のヘッダ部分を囲むタグ。ヘッダにはタイトルや著者、使用言語などが書かれる。この部分はブラウザには表示されない。
<title> $\sim$ </title>: この HTML ファイルのタイトルを定義するタグ。このタイトルは本文に表示されるわけではなく、通常はブラウザの上部のタイトルバーに表示されるか、ブックマークの登録時にこの WWW ページの名称として利用される。
<body> $\sim$ </body>: HTML 本文を囲むタグ。オプションとして本文の背景色などを指定することができる。基本的にこの部分がブラウザに表示される。

この他にも、文字の大きさ、改行、見出し、箇条書きなどに関する多くのタグがありますが、今回利用する HTML ファイルに含まれる主要なタグを以下に紹介します。

HTML で利用可能なタグの一覧や詳細については、HTML のタグ辞典 ([7], [8] など) や、 HTML タグを紹介するサイト ([9] など) などを参照してください。

次へ: 3 Yahoo! ニュース記事の構造 上へ: AWK による HTML ファイルの整形 前へ: 1 はじめに

竹野茂治＠新潟工科大学
2006年8月14日