HTML文書とは何か

Webブラウザが読み込み、解釈して整形表示するためのファイルをHTML文書またはHTMLファイルというテキストファイルである。 HTML文書は、ワードプロセッサなどのようにファイル内に文字それ自身以外の特別な情報（フォント種別、文字の大きさや色、それらの配置場所）は一切含まれないことに注意しよう（もちろん、画像なども埋め込まれていない）。

HTML文書のファイル拡張子は、.html または .xhtml である（後者をXHTML文書ともいう）。

HTML文書では、自然言語を記述した文字列以外に、タグ（tag）と呼ばれる特別な文字列が含まれる。タグとは、記号「<」で始まり、記号「>」で終わる文字列である。タグには名前がついており、<タグの名前 ..... > のように、記号<の直後の文字列でタグの名前がわかる。タグには、<タグ名>挟まれる文字列</タグ名>のように、開始タグ（<タグ名>）と終了タグ（</タグ名>）とがペアになって文字列を挟んで使われるものがある。ペアで使われる開始タグと終了タグまでの範囲を要素（element）という。

タグは文章構造を規定するために利用される。本来終了タグが使われるべき箇所にそれがなっかったりしても、最近のWebブラウザは「良きように」賢く解釈してくれるので、その使い方には注意を払わないことも多い。しかし、CSSを利用した文書レイアウトの向上やXHTMLとして記述するEPUB書籍への転用などを考えると、タグの利用においては厳格さを心がけるようにしたい。

しかしながら、HTMLやCSS規格（現在ではHTML5とCSS3であることが望ましい）との兼ね合いや、Webブラウザが全ての規格を実装しているとは限らないこともあり、タグの運用には悩ましいことも多い。

タグの運用は何故厳格であらねばならないのか

HTMLでは、Body要素（本文コンテンツ）を、その文書の論理構造を指示する目的で用意された各種のタグを正しく使って書くことが求められていることを理解することは、一般の文書作成においても大変重要だ。

タグを、ブラウザで表示される「視覚的なレイアウト」（フォントのサイズや色など）を調節するために使ってはならない。表示されるレイアウトを調整するためには、CSSの仕組みを使う。 HTMLの世界では、文書構造とそれをどのようにレイアウトするかを可能な限り分離するように求められている。

演習：タグによって文書構造を規定することと、CSSを使ってその文書のレイアウトや視覚効果とを何故そのようにして分離する必要があるのかを説明しなさい。

[ヒント] 同じHTML文書であっても、Webブラウザ毎に表示の仕方は違っていることを確かめなさい。同じブラウザでも、ウィンドウ幅や表示するフォントサイズをユーザが勝手に調整することでもきる。

数多くのHTML文書を自分で書くことで得られること

ワードプロセッサのように「手軽に入力」してWYSIWYG的に「レイアウトを調整」すれば、HTMLファイルを生成してくれるオーサリングソフトウエア（authoring software）がある。こうしたソフトウエアの利用は大変便利であるが、文書作成やコンピュータにおける情報管理の育成には必ずしも結びつかない（ように思われる）。あえて、テキストファイルとして自分でタグを入力しながらHTMLファイルを作成することには大きな意味がある。 LaTeX文書の作成も同じ意味合いがあることはいうまでもない。

文書は単なる文字を並べてた文章の集まりではないことは何度も認識すべきである。表現し伝えるべき目的や内容に応じた文の形があることを明確に意識しよう。どこで段落（パラグラフ）を改めるのか、文書の型にはそれが担う役割があることなどを自覚的に運用することによって、見た目にもわかりやすく伝えたい内容を明快に伝えることができる。複数の段落をひとまとめにして見出しをつけること、このような見出しが付いた文章の塊を適切に組み合わせて文書が構成されている（文書は構造をもつということである）。

文書を構成するもの（要素や属性）にはどのようなものがあるのかを知り、（面倒なことではあるが）それらの要素や属性を毎度ラベルし、それらの組み合わせが破綻がないようにして組み上げて文型を整え、文書を作りあげていくことは、母語ではない言語を学んで文を書く作業にも似ている。文法に反しないようにしながら、表現したいことが何かを逐次考えながら、記述するからである。こうした訓練が、学んでいる言語だけでなく、母語による文章力をも鍛えるのだ。

HTML文書の基本構造

HTMLファイルは、次のような構造をもっている。

<!DOCTYPE html> HTML文書型を宣言

html要素

head要素名前空間、言語指定

body要素 HTML本文

html要素は2つの子要素、head要素とそれに続くbody要素を持つ。 body要素内にはブラウザで整形表示されるHTML文書本文を記載するのであるが、それに先立つhead要素にはbody要素に関わるさまざまな情報を指定する（文字符号化のような必須情報やレイアウトに関するオプション情報などを含む）。

このHTML文書の基本構造はHTML5では次のようタグで規定される。

<!DOCTYPE html>
<html>
<head>
文書のヘッダ情報（文字コード指定を含む）
</head>

<body>
文書本体（ブラウザが表示するコンテンツ）
</body>
</html>

タグの使い方について、次のことに注意しよう。

HTML文書は単独で使われるDOCTYPEタグ（文書型定義タグ）で始まる。記号「!」もふくまれていることに注意。
htmlタグ、headタグ、bodyタグはペアになって使われている。
htmlタグは、head要素とbody要素を挟んでいる（しかも、head要素がbody要素に先立っている）。
HTML文書は、html要素の終了タグ </html> で終わっている。

HEAD要素をどう書くか（なぜ必要なのか）、BODY要素をどのように書くのかが、HTML文書を書くと言うことになる。

HEADについては、基本的な事項についてHTML構文指定とHTMLヘッダに説明がある。