XHTMLを書いてみましょう(基本形)

2000年11月19日(日)更新


■XHTMLの基本形

たけち: ここではXHTMLの基本形について説明するね。

さらら: ねぇ、たけち。XHTMLって、簡単説明してもらったけど、もう忘れちゃった・・・・ (^ ^;

たけち: XHTMLはHTML 4.0をXMLで表現できるようにしたものだって言ったよね。

さらら: あっ、そうそう・・・じゃぁ、これまでサンプルでみせてもらったXMLテキストのように書けばいいのかしら。

たけち: そうなんだ。XHTMLはXMLだから基本的にはXMLの書き方に沿って書けばいいんだよ。XHTMLの特徴は、XMLテキストの内容がHTML 4.0だってことなんだよ。図で簡単に書いておくね。

さらら: 2行目のDOCTYPE宣言って、なんだかわけのわかんない文字がいっぱいね。

たけち: そうだね。。。でも、ここではこういうものが必要だってことだけ覚えておいて。そのうち少しずつ分かるようになるからね。

さらら: うっ、うん・・・

たけち: それに、僕たちに本当に必要なのは、XHTMLに合致したテキスト部分だからね。それはさららも知っているHTML 4.0のタグで書けばいいんだから、意外と簡単なんだよ。

さらら: そうだったわね!! はやくサンプルが見たいわ、ねっ。

たけち: じゃあ、一番簡単なXHTMLの例を次に書いてみるね。

<?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">
  <head>
   <title>XHTMLの例(1)</title>
  </head>
  <body>
    <p>XHTMLの簡単な例です。</p>
  </body>
</html>

■namespace

さらら: あら。最初の<html>には、見慣れないxmlns="・・・・・"なんてのがあるわ。なぁにこれ?

たけち: このxmlns="・・・・・"はnamespace(ネームスペース:名前空間)って言って、ここでは="http://www.w3.org/1999/xhtml" で規定されているhtmlタグを使いますよっていう意味なんだ。namespace(ネームスペース:名前空間)については、また別に説明するね。

さらら: そうなの。。。でも、それ以外は、私でも知っているhead, title, body, pタグだわ。これならなんとか書けそうね。

たけち: じゃあ、このXHTMLテキストをファイルにしてみよう。

さらら: は〜い。


■XHTMLテキストのファイル拡張子(.xmlと.html)

たけち: XHTMLはXMLだからファイル名に".xml"(ファイルの拡張子)をつければいいよね。

さらら: それは、いままでのサンプルと同じね。そうでしょ。

たけち: そうそう。でも、XHTMLはHTML 4.0の代わりになるように考えられたものでもあるから、ファイル名に".html"(ファイルの拡張子)をつけてもいいんだよ。また、

さらら: あっ、そうなんだぁ・・・

たけち: あっ、それから実際のテキストには次のようなmetaタグをheadタグの下に載せておいてもいいよ。

  • <meta http-equiv="Content-Type" content="text/html; charset=Shift-JIS">

たけち: じゃあ、さっきのサンプルテキストを、xhtml-sample1.xmlxhtml-sample1.htmlとして作ったファイルをIE5.0(IE5.5でもいいですよ)でそのまま表示したときの違いを見てみようね。どうなると思う?

さらら: う〜ん。。。xhtml-sample1.xmlのほうは、一番最初に作った万葉集第1巻抜粋のXMLファイル(IE5.0でね!!)みたいに構造が見えるだけだと思うわ。それで・・・xhtml-sample1.htmlのほうは・・・? う〜ん。じらさないで早く見せて!!

たけち: xhtml-sample1.xmlのほうはさららの言うとおりだね。じゃあ次に二つのファイルを載せておくね。

XHTMLファイル xhtml-sample1.xml

こんな風に構造が表示されます。
こんな風に表示されます・・・

XHTMLファイル xhtml-sample1.html

こんな風にhtmlとして表示されます。
こんな風に表示されます・・・

さらら: あぁ、xhtml-sample1.htmlって普通にhtmlとして表示されるのね。でも、これだけだったら何もわざわざXHTMLにする必要なんて・・・

たけち: あっ、そっ、それはまた後ほど、ということで・・・これなら分かりやすいね。じゃあ、今回はこれくらいにね。 (^ ^;

さらら: うっ、うん。ありがと。。。。。

→次もXHTMLのサンプルについてです (^ ^;