XHTMLに書き換える(HTML4.01からXHTML1.0へ)

携帯サイトはCHTMLからXHTMLになってきているし、普通のホームページもHTMLからXHTMLへと段々移行してきています。そこで私も思いきってホームページをHTML4.01からXHTML1.0へ書き換えてみました。

XHTML1.0とHTMLの違いと書き換えの注意点(主なもの)

2000年にW3Cの勧告となったXHTML（Extensible HyperText Markup Language）は、HTMLに、XMLの拡張性を取り入れたものです。HTMLは書式をある程度適当に書いても許されましたが、XHTMLはXMLを適用した為、書式が厳格になっています。

元々HTML4.01でも見栄えはCSSで設定するのが推奨されていますが、XHTMLではその考え方が更に進んできています。つまり、文章はHTMLで表現して、その見栄えは外部スタイルシート(CSS)で記述する方法です。私は以前からその方法でホームページを作っていましたので、今回のHTML4.01からXHTML1.0への移行は比較的簡単でした。

次に、HTML4.01からXHTML1.0 Transitional(XHTMLでも比較的規格がゆるいもの)への書き換えで、日本語コード楽天がShift JISの場合を例に説明します。

XML宣言やXHTMLでの日本語指定

XHTMLで書かれた文書だと示す為には、次のようにファイルの先頭でXHTMLのXML宣言と日本語の指定をしておきます。

<?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 http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<meta http-equiv="Content-Style-Type" content="text/css" />

普通のXHTMLやSSIの場合は上記の記述で問題ありませんが、PHPの場合は先頭の行がエラーとなり表示できません。これは <? で始まるXML宣言が、PHPを省略して書く際の冒頭部分と同じなのでエラーとなる為です。PHPではこの省略を使えないように、.htaccessファイルに次の行を書き加えれば問題はありません。

php_flag short_open_tag Off

または、PHPでは先頭の行を次のようにPHPコマンドにしてしまいます。

<?php echo '<?xml version="1.0" encoding="Shift_JIS"?>'."\n"; ?>

この先頭のPHPコマンドにしたXML宣言は、ホームページビルダーやHTML Project2やExpression Web3等のソフトではエラーとなることがあります。

このXML宣言は一般的なXHTML文書（application/xhtml+xml）では必須ですが、ウェブページ用のXHTML文書(text/html)では省略できるという意見もありますが、賛否両論あるようです。

また、次のようにHTMLタグ内で xml:lang属性を指定します。そうすると、 lang属性は必ずしも必要ないのですが、ブラウザによってxml:lang属性を認識しない場合もあるので、念の為、lang属性も残しておきます。

xml:lang="ja" lang="ja"

全てのタグと属性は小文字で記述します

HTMLではタグを大文字で書いても小文字で書いてもよかったのですが、XHTMLでは、全てのタグと要素タイプと属性とを小文字で書かなければなりません。これまで書いてきたHTMLを書き直すのは大変です。

しかし、フォームの method 属性は HTTP では大文字・小文字を区別しますので大文字で書かなければ不具合となる場合もあります。XHTML では小文字に統一されましたので小文字でなければならないし、HTTP では大文字でなければならないという変なことになります。この場合だけは大文字で書きましたがどうなんでしょう。

method="OPTIONS"|"GET"|"HEAD"|"POST"|"PUT"|"DELETE"|"TRACE"|"CONNECT"

終了タグを省略できません

HTMLではLIタグやPタグのように、終了タグを省略してもかまわないものがいくつかありましたが、XHTMLでは終了タグを省略することはできません。

<li>******</li>
<p>******</p>

元々終了タグが無かったものは />で終ります

BRタグ等の元々終了タグが無かったものは <br /> のように記述します。XHTML に対応していない古いブラウザとの互換性を考慮して、/> の前には半角のスペースを空けます。

<br />
<hr />

ファイル内の場所を示すにはname属性と共にid属性を併記します

XHTMLではファイル内部の場所を示す属性は id属性になりました。このid属性をサポートしていないブラウザもあるので、name属性とid属性を同じ値にして併記します。

<a name="top" id="top">ページの先頭にジャンプ</a>

属性値はすべて "" で囲みます

HTMLでは属性値を""で囲まないで記述することもありましたが、これを必ず属性値はすべて "" で囲むようにします。

<img src="**.jpg" alt="***" width="320" height="240" />

属性名を省略しないで書きます

HTMLではFORMタグ内で属性名と属性値が同じ場合に、属性名を記述しない場合がありましたが、次のようにちゃんと省略しないで記述します。

<option selected="selected">修理以外の質問</option>

TEXTSSを使った全ページの書き換えと注意事項

フリーソフトのTEXTSSはこのような全ファイルの書き換えの場合にとても便利です。ホームページ内の全ファイルの変更をする場合でも一瞬で書き換えが可能です。

バックアップを取ってから変更します

TEXTSSにはバックアップ機能がついていますが、バックアップファイルを別に保存しておく方が安心でしょう。BAKファイルからの全ファイル書き戻し操作は大変です。

大量の書き換えの場合は、操作の都度バックアップを取ります。BAKファイルではひとつ前までの段階にしか戻せません。

書き換えの前に必ず無置換書き換えをしてみます

書き換えには絶対自信がある場合でも、必ず無置換の書き換え操作をして動作を確認してから本格的な書き換え操作をしましょう。思いもよらない落とし穴にはまることがあります。

ワイルドカード置換の場合は特に慎重にします

ワイルドカード置換は、とても便利ですが、思わぬ置換が発生することがよくあります。面倒でもひとつひとつの置換を確認しながら、問題点をなくしてから実行することも重要です。

IMGタグのように終了タグが無い時に、終了タグを追加するには、ワイルドカードを使うしかその方法が思いつきません。今回私は試行錯誤しながらワイルドカードを使って書き換えをしました。

ホームページビルダーの設定変更

ホームページビルダーでXHTMLのページを作成していると、エラーとなった時に、ホームページビルダーが勝手にページを書き換えることがあります。ホームページビルダーの設定では、エラーでもページを書き換えないように設定しておく必要があります。

タグについては標準で大文字になっていますので、これを小文字になるように設定します。その他、終了タグを省略しない設定にします。