HTMLをXHMTL1.0に移行する際のメモ書き

メモ

さらに一歩進んで、HTMLからXHTMLにするには

互換性と表記の違いについて

以下の9個の条件を覚えておくべきである。

  1. 全てのタグ（要素タイプ名、属性名）は小文字で記述する
  2. 属性の値は必ず引用符で囲む
  3. 終了タグを省略しない
  4. 空要素のタグは />で閉じる
  5. ファイル内の位置を示すにはid属性を併記する
  6. &はあらゆるところで&と記述する
  7. 属性の省略書式は使わない
  8. head要素内のスクリプトやスタイルシートの注意
  9. 言語コードの指定にxml:lang属性を用いる

全てのタグ（要素タイプ名、属性名）は小文字で記述する

HTMLでは大文字と小文字は区別されませんでしたので、表示を見やすくするためにタグの要素名を大文字で表記するHTMLエディタなどがありました。あと、手打ちの場合でも流行としてHTML要素名を大文字で表記する事が流行った時期もありましたが、XMLではこれを区別するため、「IMG」と「img」は別の要素タイプと認識されます。XHTMLでは全ての要素タイプと属性は小文字で定義されたので、タグの記述にあたっても小文字を用いなければなりません。

属性の値は必ず引用符で囲む

HTML（SGML）においては、値が数字など特定の値のみの場合は引用符を省略して 「 width=100 」 のような記述が認められていましたが、XHTMLでは全ての属性値を引用符で囲んで 「 width="100" 」 のようにしなければなりません。

終了タグを省略しない

HTML（SGML）ではDTDの定義によっては終了タグを省略することができました。たとえば、リスト項目要素のLIの場合、

<ul>
  <li>ある項目
</ul>

という具合に終了タグを省略することが認められ、それが一般的な書法となっていましたが、XMLではこれが認められません。必ず

<ul>
  <li>ある項目</li>
</ul>

のように終了タグを加えなければなりません。内容モデルを持たない空要素を除いて、全ての要素は開始タグと終了タグのペアで記述します。

空要素のタグは />で閉じる

HTMLのimg要素やbr要素のように、内容モデルを持たない空要素（HTMLで開始タグしか使わないもの）は、XMLにおいては<br/>という具合に、タグを閉じるときに「 />」を使わなければなりません（空要素タグと呼ばれています）。ただし、この書式ではHTMLブラウザがタグを正しく認識できない可能性があるので、/ の前にスペースを置いて、 <br /> のように記述します。

ファイル内の位置を示すにはid属性を併記する

HTMLではファイル内の特定の位置へのリンクのためにname属性を使って

<a href="#foo">アンカーをクリックすると</a>
....
<a name="foo">ここにジャンプする</a>

という記述をしていましたが、XHTMLではファイル内部の位置を示す属性は id属性 になりました。従って、ジャンプ先は <a id="foo"> となるわけですが、このid属性をサポートしないブラウザもあるため、

<a href="#foo">アンカーをクリックすると</a>
....
<a name="foo" id="foo">ここにジャンプする</a>

という具合に、name属性とid属性を同じ値で併記することが推奨されています（id属性そのものは、HTML 4.0から導入されています）。なお、XHTML1.1ではname属性は廃止され、id属性のみでフラグメントを示します。

&はあらゆるところで&amp;と記述する

HTMLでも普通&は&amp;と記述することになっていますが、XHTMLの場合、その用法が徹底していて、たとえばCGIを呼び出すためのURLでも<a href="">http://hoge.co.jp/hoge.cgi?mode=alfa&id=blavo">などのように、記述する必要があります。（本来はHTML2.0から明文化されていたが、XHTMLでは厳格な取扱いになっただけ）

属性の省略書式は使わない

HTMLでは、属性の名前と値が同じ場合に、属性名を記述せずに

<input type="radio" name="bar" checked>

としていましたが、XHTMLではこれは認められず

<input type="radio" name="bar" checked="checked" />

と書かなければなりません。こうすると古い（新しいものでも一部）ブラウザでは正しく働かないことがありますが、それに対する解決策は示されていないようです。

head要素内のスクリプトやスタイルシートの注意

HTMLとは異なり、XHTMLにおいてはスタイルやスクリプトも#PCDATA（字句解析を受けるデータ）として定義されたため、< はタグの開始と見なされ、コメントした内容は無視されることになります。たとえばJavascriptで数値の比較をするような式を記述していると、XHTMLではエラーになり、スタイルシートを古いブラウザから隠すために

<style type="text/css">
<!--
p {color:red}

    • >

</style>

のように記述していると、その定義は無視されてしまう可能性が高いとされています。解決策としては、外部ファイルにスタイルシートやスクリプトを記述することが推奨されています。

言語コードの指定にxml:lang属性を用いる

XMLでは言語コードの指定にxml:lang属性を用いるので、HTMLとの互換性のためにlang属性と合わせて記述します。

<p lang="fr" xml:lang="fr">Bonjour, monsieur</p>

XHTML 1.1ではlang属性は廃止され、xml:lang属性のみを記述します。

その他の注意事項

その他、入力のルールとしては先頭に「<html xmlns="">http://www.w3.org/1999/xhtml">」などのXML名前空間を宣言する必要や

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"">http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">

の用な厳密な宣言を行う必要もある。なお、詳細は「http://www.kanzaki.com/docs/html/xhtml1.html#ref-xhtml10 （XHML1.0）」を参考の事