この記事は XHTML 1.0 入門としてのタグの書き方についての記事です。
HTML 5 入門に於ける該当記事は、マークアップとは何かをご覧ください。
ここでは、XHTMLに於けるタグの書き方について解説します。
HTMLでは、文書内にある要素をタグと呼ばれる目印でマークアップして行きます。
文書中の要素には概ね起点と終点があり、
をそれぞれ打つ事でコンピュータがこの文字列を特定の要素と認識出来るようになる訳です。
例えば、文書中に堀北真希についてと言う大見出しがあったとします。
このとき、この大見出しそのものが"第一等級見出し"と言う要素となるのですが、HTMLとしてコンピュータが認識出来るようにするためにはこれを<h1>要素としてマークアップしなければなりません。
具体的には、以下のようになります。
堀北真希ちゃんのボシュロム社コンタクト洗浄液コマーシャルへの出演に因んで描いた、レンズを着けている堀北真希うさぎの仮想CM動画<h1>堀北真希について</h1>このとき、
<h1>堀北真希について</h1>と言う事になります。
開始タグは要素の起点に打たれるタグで、「<」と「>」で要素名を挟んだものとなります。
一方、終了タグは要素の終点に打たれるタグで、「<」と「>」の間に「/」に続けて要素名を記述します。
<」と要素名の間には空白を入れないで下さい。<」と「>」及び要素名は全て半角文字で書かなければなりません。要素に依っては、内容となるテキストとは別の情報となる属性が与えられる場合があります。
HTMLに於いては、属性は以下のように開始タグの中に書かれます。
<要素名 属性名1="属性値1"…>
属性を与えるにはこのように開始タグに属性名と属性値を記述します。
属性名の後に「=」のあと「"」で挟んだ属性値が入ります。(※1)
属性は必要に応じて複数の属性を併記出来ます。
その場合、順番は特に問いませんが、同じ属性名の属性を二つ以上記述する事は出来ません。
=」及び属性値を囲む「"」、全て半角文字で書かなければなりません。属性値については、以下のようになります
=」の前後には空白を入れないようにしましょう。つまり、属性名と属性値の間は「=」のみにしましょう。(※2)"」で挟む際、属性値の前後に空白が入っても構わないのですが、稀に正常に認識されない場合がありますので入れない方が安全でしょう。要素に依っては、内容となるテキストが存在し得ない要素もあります。
このように内容が存在しない要素の事を空要素と言います。
XHTMLでは空要素の開始タグについては、終了タグに相当する「/」を開始タグの最後の「>」の直前に記述する事で終了タグを省略出来ます。
例えば、
alt="堀北真希ちゃん"属性src="Homaki.JPG"属性width="240"属性height="320"属性を持つ<img>要素(画像を埋め込む要素で空要素の一つです)は以下のようにマークアップします。
<img alt="堀北真希ちゃん" src="Homaki.JPG" width="240" height="320" />このとき、「/」の直前には必ず空白文字を入れて下さい。(※3)
以下、HTMLの知識がある方への補足です。
仕様上、属性値は「"」でなく「'」で挟んでも良い事になっておりますが、制作者は以下の理由から属性値は「"」で挟む事を勧めております。
'」で挟んだ属性値を正しく認識出来ないものがある。'」で属性値を挟むと、属性値に「'」が入れられなくなる。XHTMLでは「'」に対して &aops; と言う実体参照が定義されたため記述が可能になったが、旧式のユーザエージェントではこの実体参照が正常に認識出来ない恐れがある。=」の記述について=」の前後には空白文字を入れても構わないのですが、稀に空白が入る事で属性値が正しく認識出来ないユーザエージェントがありますので、空白は入れない方が安全と言う事です。/」の前に空白文字を入れる事について/」の前に空白文字を入れなくても構わない事となっておりますが、旧式のユーザエージェントの中には、要素名や属性値の直後に「/」があるとそれも併せて要素名なり属性値なりと認識してしまうものがあるため、そのような誤認を避けるために空白で区切る事が推奨されております。
