前回は、メッセージのボディに対する付加情報の表現であるHTTPヘッダについてまとめた。ここでは、タグで文書の相互リンク構造を表現するコンピュータ言語であるHTMLについて説明する。
１ HTMLとは
HTML（Hypertext Markup Language）とは、タグ（Tag）で文書の相互リンク構造を表現するコンピュータ言語である。マークアップ言語でマークアップした構造を持った文書のことを構造化文書（Structured Document）と呼ぶ。構造化文書のためのマークアップ言語としてはもともとSGMLがあったが、仕様をシンプルにしたXMLが開発された。HTML 4.01をSGMLベースからXMLベースに変えた仕様がXHTML 1.0である。ここでは現在主に使われているXHTMLに基づき説明する。
２ メディアタイプ
HTMLメディアタイプには「text/html」と「application/xhtml+xml」の2種類がある。「text/html」はSGMLベースのHTMLを、「application/xhtml+xml」はXMLベースのXHTMLを示す。どちらのメディアタイプを使う場合でもcharsetパラメータを付けて文字エンコーディングを指定できる。特別な理由がない限りUTF-8を使うのが無難である。
３ 拡張子
HTMLには「.html」または「.htm」という拡張子を用いる。「.htm」は古いOSの制限によるものなので、現在は「.html」の方が一般的である。
４ XMLの基礎知識
XMLのツリー構造
XML文書は木構造として表現できる。
要素
XMLは要素（Element）で文書の構造を表現する。要素は開始タグ（Start Tag）、内容（Content）、終了タグ（End Tag）からなる。タグには要素名が入り、開始タグは<要素名>、終了タグは</要素名>と記述する。（拡張可能なマークアップ言語 XMLの基礎知識９項も参照）
XMLの木構造は要素を入れ子にして表現する（要素の木構造）。例えば、<html>要素、<head>要素、<body>要素があった場合、<html>要素を<head>要素と<body>要素の親要素（Parent Element）、<head>要素と<body>要素を<html>要素の子要素（Child Element）と呼ぶ。また、内容を持たない要素のことを空要素（Empty Element）と呼ぶ。
属性
要素は属性（Attribute）を複数持つことができる。属性とは、属性名と属性値の組で、開始タグの中に属性名＝”属性値”という形式で記述する。属性名、属性値ともに文字列である。開始タグは属性を複数持てるが、同じ名前の属性は1つだけしか記述できない。また、属性は入れ子にできず、開始タグの中での属性の順番には意味がない。
実体参照と文字参照
実体参照（Entity Refernce）とは、「< > ” ‘ &」の5文字においてXMLの文書構造を記述するための特別な文字となる場合に用いるしくみである。例えば、「<」という文字は「<」と表現する。5文字以外の文字を表現する方法には文字参照（Character Reference）がある。例えば、コピーライト記号（©）は十進数で169なため、「©」と表現する。
コメント
XML文書中にはコメントを書くことができる。コメントの書式は「<!– コメント内容 –>と表現する。
XML宣言
XML文書の先頭にはXML宣言（XML Declaration）を書く。XML宣言では、XMLのバージョンや文字エンコーディング方式を指定する。XML文書をUTF-8またはUTF-16でエンコードしている場合、XML宣言は省略できる。
名前空間
名前空間（Namespace）とは、複数のXMLフォーマットを組み合わせるときに、名前の衝突を防ぐ目的で使うものである。要素と属性両方に存在する。
要素の名前空間宣言は、xmlns:接頭辞=”名前空間名”という書式で記述する。接頭辞には任意の文字列が入る。「:接頭辞」を省略した場合は、接頭辞がないデフォルト名前空間を意味する。名前空間名にはURIが入り、このURIは各フォーマットの仕様で決められている。名前空間宣言は名前空間名と接頭辞を結び付ける役割を持ち、接頭辞によって名前の衝突を防ぐ。
属性の名前空間宣言も書式は同じである。ローカル属性（Local Attribute）と、グローバル属性（Global Attribute）の2つがある。ローカル属性とは、href属性のように接頭辞の付かない属性のことである。ローカル属性はどの名前空間にも属さない。グローバル属性とは、thr:count属性のように接頭辞の付いた属性のことである。グローバル属性は接頭辞の名前空間に属し、属性を拡張したいときに利用する。
５ HTMLの構成要素
HTMLの基本的な構成要素はヘッダとボディである。HTTPメッセージと同様に、ヘッダには文書のメタデータを、ボディには文書の内容そのものを入れる。
ヘッダ
ヘッダに入る要素と指定できるメタデータは、下記の4つである。
- title：文書のタイトル
- link：他のリソースへのリンク
- script：JavaScriptなどのクライアントサイドプログラム
- meta：その他のメタデータ
ボディ
ボディに入る要素は、ブロックレベル要素（Block Level Element）とインライン要素（Inline Element）の2つに分けられる。
ブロックレベル要素は、文章の段落や見出しなど、ある程度大きなかたまりを表現する。HTMLの代表的なブロックレベル要素には以下の9つがある。
- h1、h2、h3、h4、h5、h6：見出し
- dl、ul、ol：リスト
- div：ブロックレベル要素のグループ化
- p：段落
- address：アドレス情報
- pre：整形済みテキスト
- table：表
- form：フォーム
- blockquote：引用
インライン要素は、ブロックレベル要素の中に入る要素で、強調や改行、画像埋め込みなどを表現する。HTMLの代表的なインライン要素には以下の18個がある。
- em：強調
- strong：強い強調
- dfn：定義語
- code：ソースコード
- samp：例
- kbd：キーボード入力文字
- var：変数
- cite：引用または他のリソースへの参照
- abbr：WWW、HTTPなどの省略形
- a：アンカー
- q：インラインの引用
- sub：上付き文字
- sup：下付き文字
- br：改行
- ins：挿入した文字列
- del：削除した文字列
- img：画像
- object：オブジェクト
共通の属性
HTMLのすべての要素は、id属性とclass属性を持つことができる。id属性とは、文書内で一意なIDのこと。文書内のある部分をURIで示すときにURIフラグメント（「#」以降で指定する部分）で利用したり、CSSでスタイルを指定したりするときに利用する。class属性とは、その要素が属するクラスのこと。その要素がどのような意味を持つのかを指定するメタデータとしての役割がある。CSSでのスタイルの指定や、microformatsなどでメタデータを表現するときに利用する。
６ リンク
ここではハイパーメディアフォーマットとしてのHTMLを見ていく。
<a>要素—アンカー
<a>要素とは、HTMLにおいて他のWebページにリンクするために使われるアンカータグ（Anchor Tag）である。<a>要素の内容のことをアンカーテキスト（Anchor Text）と呼ぶ。
<link>要素
<link>要素とは、HTMLのヘッダでWebページ同士の関係を指定するために使う。rel属性はリンクの意味を示し、index、prev、nextはそれぞれ目次、前のページ、次のページを意味する。
オブジェクトの埋め込み
HTMLにはテキストだけでなく、画像や映像なども埋め込める。歴史的経緯により、一般的には画像の埋め込みには<img>要素を、それ以外のオブジェクトの埋め込みには<object>要素を利用する。
フォーム
HTMLでのフォームではリンク先のURIに対してGETとPOSTが発行できる。
GETは、キーワード検索などユーザからの入力によってURIを生成するときに利用する。フォームの基本構造は、<form>要素とその中に入るフォームコントロール要素である。フォームコントロール要素には、テキスト入力（<input type=”text”>）やラジオボタン（<input type=”radio”>）、セレクトボックス（<select>）などがある。フォームはターゲットとなるURIを持ち、フォームを利用した結果はターゲットURIに送られる。そのときに用いるメソッドは<form>要素のmethod属性で指定する。method属性の値がGETの場合、ターゲットURIとフォームへの入力結果からリンク先のURIを生成する。
POSTは、リソースの作成などユーザの入力をターゲットURIに送信するときに利用する。
７ リンク関係—リンクの意味を指定する
HTMLやAtomは、Web APIのようにプログラムがクライアントの場合でもリンクの意味をプログラムが可読な状態で記述するためのしくみを用意している。
rel属性
<a>要素と<link>要素はそれぞれrel属性を持てる。rel属性の値には、リンク元のリソースとリンク先のリソースがどのような関係にあるかを記述する。rel属性の値のことをリンク関係（Link Relation）と呼ぶ。例えば、元のHTMLリソースを外部のCSSリソースにリンクするときに使う「stylesheet」がある。HTML 4.x/XHTM 1.xでは以下の15個のリンク関係を定義している。
- alternate：翻訳などの代替文書へのリンク
- stylesheet：外部スタイルシートへのリンク
- start：文書群の最初の文書へのリンク
- next：文書群の次の文書へのリンク
- prev：文書群の前の文書へのリンク
- contents：目次へのリンク
- index：索引へのリンク
- glossary：用語集へのリンク
- copyright：著作権表示へのリンク
- chapter：章へのリンク
- section：節へのリンク
- subsection：小節へのリンク
- appendix：付属書へのリンク
- help：ヘルプへのリンク
- bookmark：文書中のブックマークへのリンク
microformats
microformatsとは、様々なリソースのリンク関係を表現するために、HTMLのリンク関係の拡張を行うものである（リンクの詳細やイベント情報を表現できる microformats参照）。
８ ハイパーメディアフォーマットとしてのHTML
今回は、ハイパーメディアフォーマットとしてのHTMLを解説した。HTTPとURI、そしてハイパーメディアによるリンクを組み合わせて初めてWebが成り立つ。HTMLでリンクを設計する際は、「リンクをたどることでアプリケーションの状態が遷移する」ことを強く意識することが重要である。
最後に
８でも述べたように、HTMLでリソースを表現するときの重要な設計指針は、リソース同士をきちんと接続してアプリケーション状態を表現できているかどうかである。ヘッダやボディといったHTMLの構成要素やリンク、そしてリンク関係について学ぶ必要はあるが、HTMLで実現できる効果は絶大である。
次回は、リンクの詳細やイベント情報を表現できる microformats についてまとめる。
 |
