XHTMLとHTMLの違い

厳格なHTMLを書き始めることで、XHTMLに向けて準備できます。

XHTMLに向けて準備する方法

XHTMLとHTML 4.01標準には大きな違いはありません。

したがって、コードを4.01にアップグレードすることは良いスタートです。私たちの完全な《HTML 4.01 参考マニュアル》がこれを実現するのに役立ちます。

また、すぐに小文字でHTMLコードを書き始め、</p>タグなどの無視する悪習慣を身に付けることは絶対にしないでください。

楽しいコーディングをお楽しみください！

最も重要な違い：

  • XHTML 要素は正しくネストされる必要があります。
  • XHTML 要素は閉じる必要があります。
  • タグ名は小文字でなければなりません。
  • XHTML ドキュメントはルート要素を持たなければなりません。

要素は正しくネストされる必要があります

HTMLでは、一部の要素は以下のように不適切にネストされることができます：

<b><i>このテキストは太字とイタリックです</b></i>

XHTMLでは、すべての要素は以下のように正しくネストされる必要があります：

<b><i>このテキストは太字とイタリックです</i></b></b>

ヒント：ネストリスト内でよくある間違いは、内部リストがli要素内に位置する必要があることを忘れることです、以下のように：

これは間違っています：

<ul>
  <li>コーヒー</li>
  <li>ティー</li>
    <ul>
      <li>ブラックテー</li>
      <li>緑茶</li>
    </ul>
  <li>Milk</li>
</ul>

これは正しいです：

<ul>
  <li>コーヒー</li>
  <li>ティー
    <ul>
      <li>ブラックテー</li>
      <li>緑茶</li>
    </ul>
  </li>
  <li>Milk</li>
</ul>

注意：正しいコードの例では、</ul>の後に</li>タグを挿入しています。

XHTML 要素は閉じる必要があります

非空タグは終了タグを使用する必要があります。

これは間違っています：

<p>これは段落です
<p>これは別の段落です

これは正しいです：

<p>これは段落です</p>
<p>これは別の段落です</p>

空タグも閉じる必要があります

空タグも終了タグを使用する必要があります、またはその開始タグは/>終わり。

これは間違っています：

改行: <br>
水平線: <hr>
画像: <img src="happy.gif" alt="Happy face">

これは正しいです：

改行: <br />
水平線: <hr />
画像: <img src="happy.gif" alt="Happy face" />

XHTML 要素はすべて小文字でなければなりません

XHTML 規範は定義しています：タグ名と属性は大文字小文字を区別します。

これは間違っています：

<BODY>
<P>これは段落です</P>
</BODY>

これは正しいです：

<body>
<p>これは段落です</p>
</body>

XHTMLドキュメントはルート要素を持ちます

すべてのXHTML要素は<html>ルート要素にネストされなければなりません。他のすべての要素は子要素を持つことができます。子要素は成対で、親要素にネストされる必要があります。基本的なドキュメント構造は以下の通りです：

<html>
<head> ... </head>
<body> ... </body>
</html>