XHTML文書の書き方ルール
XHTMLの書式はHTMLに比べ厳密に決められています。ここではXHTML1.0 transitionalのルールについて触れていきたいと思います。まず、その基本的な約束事をまとめてみました。
- 冒頭にXML、DOCTYPE宣言文を書く
- 文書はすべて整形式で記述
開始タグと終了タグがきちんとした場所に正しく配置されていて、要素が正しいツリーを形成する整形式であることが一番の基本です。
- 終了タグを省略しない
<ol>
<li>りんご</li>
<li>みかん</li>
</ol>
HTMLでは<li>などのリストタグの終了タグを省略できましたが、XHTMLでは終了タグも記述します。 - 空要素タグを />で閉じる
<br /> <hr /> <img src=・・・ />
- 属性値を全て引用符で囲む
<img src="img/XX.gif" width="X" height="Y" alt="ロゴ" />
- タグ(要素名、属性)はすべて小文字で記述
<A href="XXX">YYYY</a> ×
<a href="XXX">YYYY</a> ○
大文字と小文字を併用せず、小文字で統一して記述。 - 属性の省略はしない
<input type=radio name=job checked /> ×
<input type=radio name=job checked="checked" /> ○ - ファイル内の位置にリンクする場合はid属性を付記
リンク元 <a href="index.html#xhtml">
リンク先 <a name="xhtml" id="xhtml">
※ただし、XHTML1.1ではname属性は廃止されてしまっているので、id属性のみ記述します。 - "&"は全て"&"でエスケープする
- 属性値内では改行しない
- スクリプトおよびスタイル要素の定義が異なる
スクリプトやスタイルシートは原則として外部ファイルにする。外部ファイルは<head>〜<head>内にlinkタグを記述。
<link rel="stylesheet" href="../css/xxx.css" type="text/css" />
どうしてもXHTMLファイル内に記述しなければならない場合はCDATAセクションを使用します。
<style type="text/css">
<![CDATA[
body {
background-color: #000000;
color: #ffffff;
}
]]>
</style>※しかし、CDATAを使用する場合は、ファイルの拡張子を.xhtmlにしないとスタイルシートは表示されません。また、拡張子xhtmlは非対応ブラウザもあるので、結局、スクリプトやスタイルシートは外部ファイルにした方が良いということです。
XML宣言とDOCTYPE宣言
XHTMLではファイルの文頭にXML宣言とDOCTYPE宣言をします。
XHTMLではファイルがXML文書であるということを宣言する記述を
1行目に挿入することが推奨されています。
<?xml version="1.0" encoding="Shift_JIS"?>
バージョン(version)属性は必須です。文字コード(encoding)属性には使用する文字コードを指定しますが、文字コードがUTF-8、またはUTF-16の場合、encoding属性は省略できます。
シフトJIS → Shift_JIS
JIS → ISO-2022-JP
EUC → EUC-JP
Unicode → UTF-8
Unicode → UTF-16
※1行目にXML宣言を記述することで、WinのIE6以下のブラウザでレンダリング(データ生成)が互換モードになり、表示がおかしくなったり、XML宣言文がそのまま表示されたりするため、標準モードによる表示を期待する場合は、文字コードをUTF-8、またはUTF-16にして、このXML宣言を省略するか、通常のHTML 4.01などで組みます。
XML宣言の次に、Document Type の宣言を記述します。これはファイルがXHTMLのTransitional 仕様で記述されていることを意味します。
<!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">
DOCTYPE宣言は、文書のDTDを指定することで、指定されたXHTMLのDTDに従ったXML文書として扱われることになります。さらにhtml要素にはxmlns属性を指定します。xmlns属性にはどの仕様(バージョン)のXML文書なのかを記述します。そして使用する言語名を属性で指定します。
XHTMLの拡張子
XHTML文書の拡張子は.xhtmlですが、IE6では認識されない為、.htmlもしくは.htmで記述します。
以上、まとめるとXHTML1.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>
<title>〜</title>
<link rel="stylesheet" type="text/css" href=" 〜 .css" />
</head>
<body>
〜
</body>
</html>
transitional以外のタイプのXML宣言、DOCTYPE宣言の記述は下記をご参照ください。
XHTML 1.0 Frameset
XHTML 1.0 Strict
XHTML 1.1
XHTML Basic 1.0
ここではXHTML1.0 transitonal仕様で書いていますが、他の仕様では非推奨となっているタグがありますので要注意です。詳しくは使用可能なXHTMLのタグ一覧をご参照ください。