XHTML

>Information

このコンテンツは、HTMLからXHTMLへの変換方法や違いについてなどを中心に、
XHTMLの初心者向け入門講座と簡易リファレンスを掲載しております。

>はじめに

XHTMLとは

XHTMLは（Extension HTML）の略で、従来のHTMLをXMLの仕様に沿って改良したHTMLの新バージョンとなる言語です。 XHTMLはインターネット時代に合わせて多様なニーズに応えるべく登場するであろう次世代ブラウザに基準となる可能性を秘めた言語であり、これの習得がWebコーディング及びデザイン上達の絶対条件になると思われます。

XHTMLの歴史

XHTMLはHTML 4.01をXMLとして通用する為に再定義されたものです。
以下はWebブラウザ向けに誕生した言語の進化図となります。

HTML（1989年）━━━━━━┓
                          ┣ XHTML（2000年）
         XML（1998年）━━┛

2000年1月にXHTML 1.0が勧告され、2003年現在はモジュール化されたXHTML 1.1が最新となります。また現在繁用しているブラウザ、携帯電話やPDAに対応すべく、必要なモジュールだけに絞ったXHTML Basicも開発されています。

>XHTMLの基本

伸長性

XHTMLで記述した情報は、XMLとHTML 4.01の両方から使用可能です。これはXMLの長所である、Web用に作成したデータを他の用途に使用できるというメリットが使用できることを意味しています。

相互運用とポータビリティ

後述しますが、XHTMLはXMLアプリケーションであるという事実のために、HTMLより正確なコーディングが必要となります。 すべてのプログラマーが正確な同じ方法でコーディングすることにより、IEやネットスケープなど異なるブラウザー間によるテーブルの幅などの表示の違い、つまり互換性問題が解決され、 如いてはXHTMLでコーディングすることそのものがクロスブラウザを実現し、ユニバーサルデザインになり得るという実用性があります。

基本のまとめ

まとめとしてXHTML1.0仕様書の翻訳どら猫本舗さんの文章を引用させていただきます。

• XHTML文書はXML適合である。それだから、標準的なXMLツールを用いて難なく見られ、編集され、検証される。
• XHTML文書は、これまで既存のHTML4ユーザエージェントで機能していたのと同じく、あるいはそれ以上に機能し、また新しい XHTML 1.0 適合ユーザエージェントでも同様に機能するよう書くことができる。
• XHTML文書は、HTML文書オブジェクトモデルやXML文書オブジェクトモデル [DOM] をあてにするアプリケーション(例. スクリプトやアプレット)を役立てることができる。
• XHTMLファミリーが進化するにつれ、XHTML 1.0 に適合した文書が、多様なXHTML環境の中や環境間で相互運用される可能性が高まる。

さらに個人的な見解として

• W3Cは、より高度なSGMLを使用する代わりにXMLの中にHTML4.0を含ませる論理的なステップとしてXHTMLを定義しました。
• XHTMLはXMLを一般に適用する為に作られたHTML4.0の改良版です。つまりW3CのHTML新バージョンとも言えます。
• XHTMLの汎用性と拡張性をみるに、この言語の習得がWebデザイン上達において将来的には必須となると思われます。

>Q & A

XHTMLの役割は何ですか。

XMLはその自由度の高さからウェブに未来を与えています。しかしXMLは、繁用されている既存のHTMLブラウザーに現状対応しきれていません。 ここでXHTMLは、ブラウザーがXMLに基づくまでの”潤滑油”としての役割を果たすべく登場しました。
つまりXHTMLは、XML標準にウェブを移行させる為の政策の一部といえます。

XHTMLの利点は何ですか。

XHTML使用の利点はその厳密さです。
今日のブラウザーは誤ったHTML文法構造を寛容に受け入れます。多くのウェブデザイナーもこれに甘え、悪いHTMLを生成し続けました。 しかしこのHTMLコーディングでは、IEやネットスケープなどはそれぞれ異なって反応する、つまりブラウザーによってウェブの見え方が違うという問題を起こしました。
これらのエラーを回復すべく登場したXHTMLは、コーディングに厳格さを求めることにより、ブラウザーにおける互換性問題を解決できるという利点があります。

XHTMLは、いつ一般的な存在となりますか。

現状では移行する大きなメリットが無いためか、あまりXHTMLは普及していません。しかしXHTMLは1.0 から1.1 へとバージョンを重ね、モジュール化などといった確実な進歩を見せています。
また事実各ブラウザーメーカーは先に述べた”互換性”問題を懸念しています。そしてブラウザーも当然バージョンを重ね、これら互換性問題を解決すべく進歩していくと思われます。よって近い将来正しい厳格なHTMLのコーディング、しいてはXHTMLが標準になるであろうと個人的には予測してます。

XHTMLの学習は困難ですか。

まったく困難ではありません。すでにHTMLをある程度習得されている方であれば、以下のHTMLとの相違点を参照されれば容易にXHTMLへ移行できます。またHTMLを一から学習されようとしている方も、悪いHTMLを生成したことがないということが、言わば利点となり得るかと思われます。 しかし先にHTMLをある程度習得されている必要はあります。

>HTMLとの相違点

XHTMLがXMLアプリケーションであるという事実のために、記述の取り決めがHTMLより厳格（strict）になっています。 このためXHTMLの記述の大原則として正しい論理構造の文法理解が必須となります。 具体的には、HTML4において多くの既存のブラウザでは広く容認されてきたDTD宣言の省略や、タグの入れ子関係の許容などはXHTMLでは認められません。

タグと属性はすべて小文字

XHTMLはXMLを適用（ベースと）しています。XMLが適用する文字セット（ISO）は大文字小文字を区別するといった厳格な言語であるので、HTML要素および属性名はすべて小文字でなければいけません。

属性値はすべて引用符でくくる

この決まりも厳格になっていて、特にコーディングをHTMLエディタで行っている場合、値が数値のときに引用符が省略されていることが多いので注意が必要です。

属性が最小化できない

属性値、checkedやnowrap、compactなどは省略することができました。しかしXHTMLでは有効ではなくなり、必ず属性値を指定する必要があります。つまりXMLは、属性最小化をサポートしていないのです。

他にismap, declare, noshade, disabled, readonly, multiple, selected, noresize, defer.などの属性が関係します。

name属性はid属性へ

HTML4は、a, applet, form, frame, iframe, img, map 要素についてname属性を定義し、JavaScriptやスタイルシートプロパティへの指定としてid属性が定義されています。しかしXHTMLでは要素のname属性は公式には廃止予定であり、後続バージョンのXHTMLでは取り除かれます。 そこでXHTMLでは上記要素はすべてid属性で定義します。

空要素には終了タグが必要

<hr><img><input><meta><br>などといったHTML4.0では終了タグを持たない ”空要素”でも以下の例のように、/>を付けて終了させる必要があります。

※XHTMLに非対応のブラウザとの互換性を考慮して、/> の前には半角スペースを空けることが推奨されています。

非空要素にも終了タグが必要

最近のHTMLエディタなどは<p> タグをパラグラフを分離するために使用、つまり改行の目的で使用することがあります。 特にスタイルシートを使用しないページでは、どのブラウザでも問題なく表示されるといった所以ではありますが、XHTMLでは これら非空要素についても終了タグが必須となります。

<li></li>、<dt></dt>、<dd></dd>などといったリスト要素についても同様です。

スクリプト要素とスタイル要素について

スクリプト要素やスタイル要素の内容の中に含まれる要素は、XMLでは#PCDATA を持つものとして宣言されます。 ここでXHTMLでは<script></script>あるいは<style></style>内を以下のようにCDATAセクションでコード化する必要があります。

<script type="text/javascript">
<!--
document.write("<h2>文字</h2>");
// -->
</script>

<script type="text/javascript">
<!-- <![CDATA[
document.write("<h2>文字</h2>");
// ]]> -->
</script>

文書を下位互換にするために、スクリプト及びスタイルシートをコメント内に"隠蔽する"従来のやり方が、XMLに基づく実装では期待通りに機能しない可能性が高いのです。しかしここで、 そのCDATAで包括する作業のかわりに簡単な解決策として、外部スクリプトおよび外部スタイルシートを使用することがあげられます。

CSSの取り扱い

CSSスタイルシートの取り扱いの注意点は、HTMLとして引き出されたXHTML文書にはHTML規則が適用され、XMLとして引き出されたXHTML文書にはXML規則が適用されるということです。 ここでXHTML文章記述の際には以下の点に留意する必要があります。

• XHTML用のCSSスタイルシートは、要素名や属性名は小文字を使わなければならない。
• XHTML名前空間の中でユーザエージェントは "id" および "class" 属性を使用できる。
  よって短縮 "#" セレクタ文法および"." セレクタ文法が以前の通り使用できる。
• XHTML名前空間内では、利用者エージェントは"id"属性をID型の属性として認識すると期待される。
  よってスタイルシートは、利用者エージェントがDTDを読むことがなくても，短縮記述の"#"選択子構文の使用を継続できることが望ましい。
• XHTML構文解析の表（table）において、tbody要素は省略出来ない。CSS選択子でtbody要素が参照される場合は、常にtbody要素を明示的に追加することが望ましい。

実体参照文字の使用

例えばパラメーターをとるCGIスクリプトを参照するURLの中に含まれがちな『&』や、属性値の中に空白を記述したい場合は実体参照文字を使用します。

これもXMLプロセッサの認識仕様から派生する相違点といえます。

>例文と解説

この章から、仕様書で義務的なものとして説明されている記述方法を、例文を提示しながら解説していきます。

文章の冒頭

HTML4には存在しなかったものですが、この文章が何の言語で書かれているかをブラウザ側に伝える必要があります。つまり、このXHTML文章はXMLで記述してありますよ、ということをブラウザ側に伝える必要があるというわけです。 またW3C仕様書ではすべての文書でXML宣言を行うよう強く奨励しています。

<?xml version="1.0" encoding="Shift_JIS"?>

※ 文書のキャラクタエンコーディングがデフォルトの UTF-8 か UTF-16 以外、つまり Shift_JIS 、euc-jp 、iso-2022-jp のとき、上記宣言を文章の冒頭に記述することは必須となります。

新しいDTD（文章型定義）

HTML4では許容されていたDTD（文章型定義）は、厳格な論理構造が要求されるXHTMLでは記述の省略ができません。 つまり以下のDTDのうち1つに照らし合わせてXHTML文章を正当化し、コーディングしなければなりません。

■ XHTML 1.0 Strictの場合
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

■ XHTML 1.0 Transitionalの場合
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

■ XHTML 1.0 Framesetの場合
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

■ XHTML 1.1の場合
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

■ XHTML Basic 1.0の場合
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN"
    "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">

名前空間

XHTML名前空間はXMLNAMESに従って他のXML名前空間と一緒に使っても構わないとされています。 ここで他のXML名前空間を使用するにかかわらず、XHTML が使用する名前空間を<html> タグ内に記述する必要があります。

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

※ 注意点としては言語の指定に lang と xml:lang の双方が使われていて、xml:lang 属性の値が優先していることです。 なお最新バージョンのXHTML 1.1では lang 属性は廃止され xml:lang 属性のみ使用されます。

サンプルXHTMLドキュメント

以下にこれまで述べたXHTML記述の際の注意点及びHTML4との相違点を踏まえたサンプルXHTMLドキュメントを挙げます。 要素、属性、属性値がすべて小文字である、空要素におけるタグの新しい終了方法、その他属性値をすべて引用符で括っているなどXHTMLで記述する際の基本文型となっています。

※ 以下赤字は主な変更点
※ XHTML 1.0 Transitional で記述した例

<?xml version="1.0" encoding="Shift_JIS"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

<head>
<meta content="text/html; charset=shift_jis" http-equiv="content-type" />
<title>XHTMLドキュメント</title>
</head>

<body>

<h1>タイトル</h1>
<h2>サブタイトル1</h2>

<p>パラグラフ1</p>

<ol>
   <li>リスト・アイテム1 </li>
   <li>リスト・アイテム2 </li>
</ol> 

<h2>サブタイトル2</h2>

<p>パラグラフ2</p>

<dl> 
   <dt> 用語 
   <dd> 定義 </dd> 
    </dt>
</dl>

<hr />

<p>
   <img src="URL" width="100" height="30" alt="image" />
   ↑バナー画像<br />
</p>

<address>
   <a href="mailto:aki2nd@yahoo.co.jp">Contact</a>
</address>

</body>

</html>

>XHTML1.0と1.1

バージョンの推移

HTML 4.0 は非標準的なマークアップ言語でした。そこでW3Cは、Web製作開発において整形式で妥当なXMLの世界へと移行させる手助けとして、 HTML を XML の仕様に準拠するように再定義したものとして XHTML 1.0 を開発しました。その後XHTMLファミリー文書型は、新しくてさらに構造的な機能を持つ Modularization of XHTMLで定義されるXHTMLモジュールより XHTML 1.1 を再定義しています。

推移の意義

新バージョンXHTML 1.1 はモジュールにのみ基づいた初期的な文書型を定義しています。この”初期的”な文書型ということは、大多数のインターネットコンテンツに適用できるうるという一貫性を意味し、さらに広い範囲のクライアントデバイスへの運用を可能にしてます。

XHTML 1.0 からの変更点

新バージョンXHTML 1.1 の最たる変更点はモジュール化です。つまり廃止方向の要素や属性のサポートを除外し、初期的な文書型を定義しているという点です。今後の新XHTMLファミリーからもこのことは継続されると思われ、また次世代ブラウザでも一部のモジュールのみをサポートしていく方向になっていくと思われますので、 今まで非標準的なマークアップでコーディングされていた方も、これを機に仕様に準拠した正しいマークアップをされることをお勧め致します。

サポート状況

繰り返しますが、XHTML 1.1 と XHTML 1.0 との相違点で最も重大なのは、廃止方向であった機能の除去にあります。ここではXHTML 1.0 には存在していたがXHTML 1.1 ではサポートされなくなった機能を挙げてみます。

■ 廃止要素

■ 廃止属性

>PDF

	当webページ（http://www.awcs.org/xhtml/）をpdfファイルで閲覧することが出来ます。
	http://www.awcs.org/xhtml/_.pdf