気の向くままに辿るIT/ICT
webzoit.netウェブサイトホームページ
XHTMLタグ

XHTML TAG/タグ

ウェブ造ホーム前へ次へ
サイト内検索
カスタム検索
XHTMLのタグの記述方法は?

XHTMLのタグ

XHTMLタグの記述方法

 XHTMLはHTML4とXML1.0をベースとして生まれたハイパーテキストマークアップ言語で、少なくともXHTML1.0またはXHTML1.0/Second Edition共に利用できるタグはHTMLタグと基本的に同じです。

 但し、XHTMLではHTML4とは少しだけ違いがありますので注意が必要です。

XHTML記述のポイント

DOCTYPE宣言

 XHTMLはXMLベースでDOCTYPE宣言はHTMLのDOCTYPE宣言ではなく


XHTMLのDOCTYPE宣言

XHTMLのDOCTYPE宣言

をXHTMLファイル最上段に記述します。

ネスト

 ネストとは、例えばタグの中に更にタグがあるような以下のような場合、ネストしている等といいます。


<div>
  <b>
  </b>
</div>

 ネストはいいのですが、HTMLではこのネストがチグハグになっていてもブラウザがエラーを出さずにフォローするようなケースでも、XHTMLでは、この点は厳格になっていてチグハグは許されません。

要素・属性は小文字で

 xhtmlでは要素名・属性名は


全て小文字

 htmlはタグやエレメント(要素や属性)は、大文字小文字は厳格ではありませんでしたが、xhtmlでなくても、これから書くhtmlがあるのなら小文字で統一しておく方が何かといいでしょう。

タグの省略不可

 HTMLには<p>のように終了タグの省略が可能なものがありますがXHTMLではXMLの考え方同様この省略は許されません。

<p></p>の場合

<p />

 とするか、省略しなければ、<p>省略しないよ。。</p>というような具合に、他のタグと同様、これまで通り開始タグ&終了タグ(<p>~</p>)とすればOKです。

設定値は必ず二重引用符(ダブルクォート)で括る

 例えば、<table cellspacing=1>ではなく、


<table cellspacing="1">

のように必ず""(ダブルクォート)で括る必要があります。

属性の省略不可

 例えば、htmlのform要素にはselectcheckboxなどの既定値として選択状態にしておく場合に利用するselectedやcheckedは、下記のように記述する必要があります。

<input type="select" />の選択状態「selected」の場合

<input type="select" selected="selected" />

<input type="checkbox" />の選択状態「checked」の場合

<input type="checkbox" checked="checked" />

HTMLで終了タグのないタグの場合

 また、HTMLには終了タグがないものがありますがXHTMLではXMLの考え方同様これも省略は許されず、この場合には


<br />
<hr />
<img src="" alt="" />

 また、HEADタグ内のMETAタグなど閉じタグがないものも


<meta name="" />

のように[/]半角スラッシュを続けて入れるか、半角スペース+半角スラッシュ[/]を入れて記述する事になっています。

属性値内の先頭末尾のホワイトスペースは削除

 属性値内に記述された先頭と末尾のホワイトスペースや改行は取り除かれます。

 先頭/末尾以外の属性値内の1つまたは連続した複数のスペースや改行は属性値の1つとして扱われます。

xhtmlホワイトスペースの処理追記

※スーパーセット(親)のXMLでいうホワイトスペースとは、16進表記の以下であり、Unicodeでは識別することになっている全角スペースは含まれません。

文字/16進16進表記文字が表す内容
09/#x9[HT]水平タブ
0A/#xA[LF]ラインフィード
0D/#xD[CR]キャリッジリターン
20/#x20ASCII CODEの空白文字

※スーパーセット(親)のXMLでは要素内や属性値内のホワイトスペースは全て取り除かれ、データ中のホワイトスペースは、XMLではそのままアプリケーションに渡される為、結果的に処理はアプリ次第です。

※xhtml文書を作るだけなら気にする必要はないかもしれませんが、scriptなどで利用する場合には、改行は全て


LF

に変換されるので注意が必要です。(文字コードと改行コード)

scriptとstylesheetの利用

 scriptやstyleは、「#PCDATAで定義されている」為、[&]や[<]の実態参照である[&amp]や[&lt;]は[&]や[<]と解釈され[<]だと開始タグとして認識されてしまうので利用できません。

 これではxhtmlタグやタグ内でscriptやstyleを利用したい場合に支障があります。

 xhtmlでscriptやstyleを利用したい場合

 そこでscriptやstyleを利用する方法としては


script外部ファイル
stylesheet外部ファイル

を使用するか、CDATAを利用する方法があり、例えば


<script>
<![CDATA[

]]>
</script>

として「エスケープしないテキスト」を含められるようにするかのいずれかです。

 ちなみに、マークアップの「属性の値」として[属性="マークアップ"]というようなCDATAをマークアップとする記述はできません。

 また、CDATA内に以下のケースの記述は不可です。


CDATAの終了を表す

  ]]>  

という3つの並びやこれを意味する16進表記の

 5D5D3E (%5d%5d%3e)

進数・進法表記について

 マークアップ文字列を含めても問題なく解釈されるケースとしては、


&lt;tag>

のような開始タグの先頭がエスケープされた終了タグの>や]か


<![CDATA[

<tag>
<xxxxx>&nbsp;xxx&trade; &copy;~</xxxxx>
</tag>

]]>

のようなケースです。

禁則文字・禁則処理記述

 SGMLでは、DTD作者への特定の要素をある要素の中から排除できたりしますが、XHTMLではというより、XMLでは、禁則処理に関する記述をDTDなどで定義する事はできません。

 できないので定義はされませんが、この点は暗黙の了解として望ましくない定義はしないという姿勢で望みましょう。

name属性とid属性

 HTMLでは、name属性とid属性が時期の変遷はあったにしても両方利用できるタグがあります。

 しかし、XMLでは、name属性ではなく、ID型のid属性だけがあり、xhtml文書は基本的にXMLとして利用できるところにメリットがあるのでXMLで利用できないname属性は使用しない方がよいでしょう。


name属性ではなく、id属性に統一

属性値の大文字小文字は全て小文字で

 XHTMLでは属性・属性値は全て小文字で記述することになっています。

 例えば、<input type="">で[type=TEXT]という記述がHTMLでは可能でしたが、小文字に統一すると共に引用符で括り、XHTMLですから[/]を付けて


<input type="text" />

のように記述しましょう。

推奨メディアタイプの変更

 XHTMLではheadタグに記述するmetaタグの内の推奨メディアタイプが変更になっています。

 W3Cでも以前は、


変更前

<meta http-equiv="content-type" content="text/html; charset=euc-jp"/>

を推奨していましたが、現行は


変更後

<meta http-equiv="content-type" content="application/xhtml+xml; charset=euc-jp"/>

が推奨されています。

 尚、[charset=euc-jp]の[euc-jp]の部分は妥当な文字セットを使用します。

その他[shift_jis]など文字コードリストと文字コードについて

ウェブ造ホーム前へ次へ