HTMLとXHTML
HTMLからXHTMLに…という流れになってきている訳ですが、で結局どうすりゃいいの？って話です。
で、調べたりしてみると「HTML4.01の時に…」とか「W3Cが…」とか「マークアップ言語を…」という話の段階で うぅ…(-ω-lll) と頭を抱えました。
そして今でも頭を抱えます…(;´∀｀A)
そんな私でも、なんとかXHTMLと思われるものでサイトを作るようになってとりあえず気をつけているHTMLとXHTMLとの大きな違い。
１．XML宣言をする
２．タグは全て小文字で書く
３．終了タグを明示する
４．空要素タグの最後に「 /（半角スペースとスラッシュ）」を入れる
５．属性値は必ず引用符（"）で囲む
といった感じです。
あくまでも私が思っている大きな違いですが…。本当はもっと細かく、ちゃんといろいろあるはずです。
１．XML宣言をする
XML宣言と言って、一番最初（１行目）に
<?xml version="1.0" encoding="Shift_JIS"?>
を書かなくてはいけません。
だけどこれを書くと、IE6ではDOCTYPEスイッチというのが起こり、後方互換モードってやつで動作します。
「後方互換モード」は、web標準に準拠していない古いブラウザに合わせて動作します。
ちなみに、「標準準拠モード」は、W3Cの仕様に準拠した表示をします。
で、せっかくXML文書だよと示すためにXML宣言を書いたのに、IE6では互換モードになってしまってレイアウトが崩れたりしてしまいます。
でも、文書の文字コードにUTF-8、UTF-16をつかっていればXML宣言は必須じゃないよとなっているので、この文字コードで書いていればXML宣言は省いても大丈夫です。
実際にはXML宣言の後に、DOCTYPE宣言を書いて、xmlns属性の指定を書くようになります。
私の場合だと（XHTML 1.0 にも3種類のDOCTYPE宣言があるので…）
<?xml version="1.0" encoding="Shift_JIS"?> （XML宣言）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> （DOCTYPE宣言）
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> （xmlns属性）
と書いてます。
２．タグは全て小文字で書く
これはそのまんま、タグは全部小文字で書きましょう。
「HTML」と書いたり、「ID」と書いたりしてはダメです。
「html」「id」といった風に、全部小文字で。
３．終了タグを明示する
終了タグを省略できません。
例えば…
■HTMLの場合
<UL>
<LI>ガンダム
<LI>ケロロ軍曹
<LI>戦国BASARA
</UL>
■XHTMLの場合
<ul>
<li>ガンダム</li>
<li>ケロロ軍曹</li>
<li>戦国BASARA</li>
</ul>
となります。
４．空要素タグの最後に「 /（半角スペースとスラッシュ）」を入れる
これは、昨日のCSSファイルへの指定の仕方に書いた違いもそうですが、よく使う空要素タグは…
■HTMLの場合
<BR>
<HR>
■XHTMLの場合
<br />
<hr />
となります。
あと画像の指定をする場合も、最後に「 /」を忘れずに。
（例） <img src="ファイル名.gif" alt="代替テキスト" width="サイズ" height="サイズ" />
５．属性値は必ず引用符（"）で囲む
■HTMLの場合
width=80%
■XHTMLの場合
width="80%"
といった感じです。
この他にも、入れ子が正しいかとかタグ以外の場所（文書内）で「<」や「>」をそのまま書かないとかありますが、そういうのは実際にやってみて「Another HTML-lint gateway」などでチェックしながら、徐々に自分で直していって覚えた方が早いです。
結局、分かりにくい＆間違ってたらごめんなさい(´Д⊂ｸﾞｽﾝ
- 投稿者:管理人
- 日時:01:07
comments
xhtmlは仕上げに文法チェックが必要なので
制作側は1手間増えますよね。
関係ないかもですが
「出れない」シリーズってキャラ化したらどうでしょうね
すごいです！
きっと何度もこちらに
勉強しにおじゃますると思います♪
例文もナイスです！(≧ω≦)ｂ !!
ヤマダにとってXHTMLはまさに「？」の塊だったので
目を皿のようにしてみてしまいました。
ヤマダ的解釈ですが
「XHTMLはよりルールが厳格なHTML」という事でしょうか？
■加藤先生
>xhtmlは仕上げに文法チェックが必要なので
>制作側は1手間増えますよね。
そうですねー。
できるだけきっちり仕上げないと、せっかくのxhtmlも意味をなさないというか…。
>「出れない」シリーズってキャラ化したらどうでしょうね
ほんとですか！？
今度、描き直してブログキャラでデビューしてみますｗ
■ぷらいどさん
すごくないですよ～。
本買って調べたり、散々読んでやっとかよ！！って感じです(;´∀｀A)
■マネ☆ヤマダさん
>「XHTMLはよりルールが厳格なHTML」という事でしょうか？
ズヴァリ！！
私もそう思ってます。
でも、ちゃんと書いていればIE7になってもさほど心配は無かったようです。