最新のWeb開発のチュートリアル

HTMLとXHTML


XHTMLはXMLとして書かれたHTMLです。


XHTMLとは何ですか?

  • XHTMLは拡張可能ハイパーテキストマークアップ言語の略
  • XHTMLはHTMLとほぼ同じです
  • XHTMLはHTMLよりも厳しいです
  • XHTMLは、HTML、XMLアプリケーションとして定義されています
  • XHTMLは、すべての主要なブラウザでサポートされてい

なぜXHTML?

インターネット上の多くのページが含まれている"bad" HTMLを。

このHTMLコードは、ほとんどのブラウザでは正常に動作します(even if it does not follow the HTML rules)

<html>
<head>
  <title>This is bad HTML</title>

<body>
  <h1>Bad HTML
  <p>This is a paragraph
</body>

今日の市場では、異なるブラウザ技術で構成されています。 一部のブラウザでは、コンピュータ上で実行され、一部のブラウザでは、携帯電話や他の小型デバイス上で実行します。 より小型のデバイスは、多くの場合、解釈するためのリソースやパワーが不足している"bad"のマークアップを。

XMLは、文書が正しくマークアップされなければならないマークアップ言語である(be "well-formed")

あなたがXMLを勉強したい場合は、私たちのお読みくださいXMLのチュートリアルを

HTMLとXMLの強みを組み合わせることにより、XHTMLを開発しました。

XHTMLはHTMLをXMLとして再設計です。


HTMLからの最も重要な違い:

文書構造

  • XHTMLのDOCTYPEは必須です
  • xmlns属性で<html> 必須です
  • <html> <head> <title> 、および<body> 必須です

XHTMLの要素

  • XHTMLの要素がなければなりませんproperly nested
  • XHTMLの要素は常にしなければならないclosed
  • XHTMLの要素がでなければなりませんlowercase
  • XHTML文書は持っている必要がありますone root element

XHTMLの属性

  • 属性名は、である必要がありますlower case
  • 属性値がなければなりませんquoted
  • 属性の最小化はされてforbidden

<!DOCTYPE ....>必須です

XHTML文書はXHTMLのDOCTYPE宣言を持っている必要があります。

すべての完全なリストXHTMLのDoctypeは、私たちのHTMLタグリファレンスで発見されました。

<html> <head> <title> 、および<body>要素も存在していなければならない、とxmlns属性で<html>文書のXML名前空間を指定する必要があります。

この例では、必要なタグを最小限に抑えてXHTML文書を示しています。

<!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">

<head>
  <title>Title of document</title>
</head>

<body>
  some content
</body>

</html>

XHTMLの要素は正しく入れ子にする必要があります

HTMLでは、いくつかの要素が不適切にこのように、互いの内にネストすることができます。

<b><i>This text is bold and italic</b></i>

XHTMLでは、すべての要素が適切にこのように、互いの内にネストする必要があります。

<b><i>This text is bold and italic</i></b>

XHTMLの要素は必ず閉じなければなりません

これは間違っています:

<p>This is a paragraph
<p>This is another paragraph

これは正しいです:

<p>This is a paragraph</p>
<p>This is another paragraph</p>

空の要素も閉じなければなりません

これは間違っています:

A break: <br>
A horizontal rule: <hr>
An image: <img src="happy.gif" alt="Happy face">

これは正しいです:

A break: <br />
A horizontal rule: <hr />
An image: <img src="happy.gif" alt="Happy face" />

XHTMLの要素は小文字である必要があります

これは間違っています:

<BODY>
<P>This is a paragraph</P>
</BODY>

これは正しいです:

<BODY>
<P>This is a paragraph</P>
</BODY>

XHTML属性名は小文字である必要があります

これは間違っています:

<table WIDTH="100%">

これは正しいです:

<table WIDTH="100%">

属性値は引用符で囲む必要があり

これは間違っています:

<table width=100%>

これは正しいです:

<table WIDTH="100%">

最小化は禁止されている属性

違う:

<input type="checkbox" name="vehicle" value="car" checked />

正しい:

<input type="checkbox" name="vehicle" value="car" checked="checked" />

違う:

<input type="text" name="lastname" disabled />

正しい:

<input type="text" name="lastname" disabled="disabled" />

HTMLからXHTMLに変換する方法

  1. XHTMLを追加します<!DOCTYPE>すべてのページの最初の行に
  2. 追加xmlnsすべてのページのhtml要素に属性を
  3. 小文字にすべての要素名を変更します
  4. 空の要素をすべて閉じます
  5. 小文字にすべての属性名を変更します
  6. すべての属性値を引用

W3Cバリデータで検証XHTML

下のボックスにあなたのウェブアドレスを入れてください: