P-0036 XHTML の注意事項

HTML 4 から XHTML へ移行する際や、 XHTML 文書を書く際に気をつけておいた方がいいこと。

まず、よく言われること

終了タグは省略しない

p 要素や li 要素など、 HTML 4 では終了タグの省略が許されているものがありますが、 XHTML では全ての要素で終了タグが省略できなくなっています。

修正前：
<p>第1段落
<p>第2段落
修正後：
<p>第1段落</p>
<p>第2段落</p>

img 要素や br 要素などの終了タグを書いてはいけなかった要素にも終了タグが必要となってます（ <br></br> のようにする）。ただしこれらのケースでは、過去のブラウザのために簡略化した記述が許されていて、終了タグの代わりに開始タグの末尾にスラッシュ（/）を書けばよいことになっています。

修正前：
<p>ねむい。<br>しんどい。</p>
修正後：
<p>ねむい。<br / >しんどい。</p>

スラッシュの前に半角スペースを一つ入れておくことで、古いブラウザでも問題なく解釈できます。

要素名・属性名は小文字で書く

HTML 4 では要素名・属性名の大文字小文字は好きなように書けましたが、 XHTML では全て小文字で書かなければなりません。

修正前：
<A onClick="jump();">
修正後：
< a   onclick ="jump();">

属性の記述を省略しない

HTML 4 では属性値を引用符（ " ）で囲わなくてもいい場合がありますが、 XHTML では属性値は必ず引用符で囲わなければなりません。

修正前：
<p class=note>
修正後：
<p class=" note" >

また、 option 要素の selected 属性や hr 要素の noshade 属性など「 selected 」のようにだけ書けばよかった属性も、 XHTML では 属性名 ="属性値" の形で書かなければなりません。（ HTML 4 での「 selected 」だけのような記述は属性名を省略したものです）

修正前：
<option selected>
修正後：
<option  selected="selected" >

これらのケースでは、属性名と属性値に同じ名前を書けば大概は大丈夫です。

アンカー名に注意

HTML 4 までではページ内のアンカーに a 要素の name 属性を使っていましたが、 XHTML では汎用の id 属性を使う方がよいとされています。現在のところ a 要素には name 属性と id 属性を併記するように勧められていますが、 id と name では値の記述のルールが若干異なり、 id の値には数字で始まる名前が使えません。日記の各日付のアンカーなど、数字のみの name を指定している場合には修正しておきましょう。

修正前：
<a name="20010128" id="20010128">
修正後：
<a name=" date20010128 " id=" date20010128 ">

URI の記述に注意

HTML 4 までではリンク先の URI に「 & 」などをそのまま記述しても大丈夫でしたが、 XHTML ではリンク先 URI も含めてソース中の特殊記号は全て実体参照で書かなければなりません。 HTML 中に JavaScript を記述している場合、条件分岐の「 & 」なども実体参照を使う必要があります。

修正前：
<a href="bbs.cgi?page=5&style=tree">
修正後：
<a href="bbs.cgi?page=5 &amp; style=tree">

ただ、 JavaScript のソースで if 文などに実体参照を使うとまともに解釈されないおそれがあるので、心配な場合は src 属性を使って外部ファイルを読み込ませるようにするといいでしょう。

PageTop

文書型宣言より前にコメントを入れない

XML では XML 宣言より後であれば文書型宣言（ DOCTYPE ）だろうがコメントだろうが何を書いてもよいとされていますが、 IE 5 は XML 宣言と文書型宣言の間にコメントを書くと（ HTML 文書でなく）ただの XML 文書として解釈してしまいます。ローカルにあるファイルだと問題ありませんが、 WWW 上に置くとこの現象が起こるようですので、くれぐれも注意しましょう。

XHTML 文書は XML 文書なので XML の仕様に沿って記述されていれば普通は問題ありませんが、ブラウザ側が正しく解釈できないために、この例のように XML として正しくても問題が起こる場合があります。ブラウザでの表示チェックはなるべく行うようにしましょう。

PageTop

識別子は絶対パスで指定

XHTML の仕様書（邦訳）では文書型宣言の識別子が "DTD/xhtml1-strict.dtd" という風に相対パスで書かれていますが、実際に書くときは絶対パスにする必要があります。気付かずに相対パスのままになっている場合があるので、注意しましょう。

修正前：
<!DOCTYPE html 
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "DTD/xhtml1-strict.dtd">
修正後：
<!DOCTYPE html 
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    " http://www.w3.org/TR/xhtml1/ DTD/xhtml1-strict.dtd">

PageTop

B:Back