ISO-HTML: DIVと見出し要素のお話

(本稿は、以前、雑記の中の一文として書いた文章です。見通しが悪いために、当コーナー向けに書き直しました。)

ISO/IEC 15445:2000(以下、ISO-HTML)において、見出し要素をDIV要素に入れることはできない。

何で気づいたかって言うと、以前、ISO-HTMLを使ってページを書いていた時に、例えば、長文テキストの脇に、常にナヴィゲーションリンクがリストになった位置固定したボックスがついて回るような、そんなページを考えていて、位置固定したボックスをdivで作って何とかしようと発想したわけなんだけど、そのボックスの中身に見出し要素(H1~H6)を入れてあるという理由で、validatorからお叱りを喰らったのだ。

DTDを見てみよう

不思議に思って、同文書型のDTD( 出典:ISO/IEC 15445:2000(E) ISO-HTML: Annex B Entities, element types and attributes)を見る。

<!ELEMENT DIV - - %section.content; >

ISO/IEC 15445:2000(E) ISO-HTML: Annex B Entities, element types and attributesより引用。以下、同様。

ここで参照されている%section.contentは何だ。

<!ENTITY % section.content "(%block; | %text; | ADDRESS)+" >

さらに見ていく。%blockを展開。

<!ENTITY % block "BLOCKQUOTE | DIV | DL | FIELDSET | FORM | HR | OL | P | PRE | TABLE | UL" >

次は、%text。

<!ENTITY % text "#PCDATA | %physical.styles; | %logical.styles; | %special; | %form.fields;" >

それぞれの参照を展開してゆく。

<!ENTITY % special "A | BDO | BR | IMG | OBJECT | MAP | Q | SPAN" >

<!-- Logical character styles -->

<!ENTITY % logical.styles "ABBR | ACRONYM | CITE | CODE | DFN | EM | KBD | SAMP | STRONG | VAR" >

<!-- Physical character styles -->

<!ENTITY % physical.styles "B | I | SUB | SUP | TT" >

<!-- Form fields - input elements that should appear only within forms -->

<!ENTITY % form.fields "BUTTON | INPUT | LABEL | SELECT | TEXTAREA" >

ダメ押しでaddress要素はって言うと、以下。

<!ELEMENT ADDRESS - - (%text;)+ -(IMG|OBJECT|MAP) >

この様に、見出し要素の入る隙など、DIVの中にはないのである。

参考:HTML4の場合

ちなみに、W3Cによる、HTML4.01の場合( 出典:HTML 4.01 Specification: 21 Document Type Definition)はというと……。

<!ELEMENT DIV - - (%flow;)* -- generic language/style container -->

HTML 4.01 Specification: 21 Document Type Definitionより引用。以下、同様。

<!ENTITY % flow "%block; | %inline;">

<!ENTITY % block "P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT | BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

<!ENTITY % heading "H1|H2|H3|H4|H5|H6">

<!ENTITY % list "UL | OL">

<!ENTITY % preformatted "PRE">

ここで%headingの内容として、H1〜H6要素が出てきたので、入れられるという事になるんだけど、せっかくなんで、全部見てみよう。

<!-- %inline; covers inline or "text-level" elements -->

<!ENTITY % inline "#PCDATA | %fontstyle; | %phrase; | %special; | %formctrl;">

<!ENTITY % fontstyle "TT | I | B | BIG | SMALL">

<!ENTITY % phrase "EM | STRONG | DFN | CODE | SAMP | KBD | VAR | CITE | ABBR | ACRONYM" >

<!ENTITY % special "A | IMG | OBJECT | BR | SCRIPT | MAP | Q | SUB | SUP | SPAN | BDO">

<!ENTITY % formctrl "INPUT | SELECT | TEXTAREA | LABEL | BUTTON">

ということなので、見出しを含むまとまりをDIVコンテナでくくり、何らかのレイアウトをするという方法を使うには、ISO-HTMLではダメで、HTML4以降、ないし、XHTMLを使用するべきだということである。

そう思うと、ISO-HTMLでシンプルに書いていくのもいいかなと思うけど、今んところ、アウトラインの考え方も(おそらくISO-HTMLからではなく、XHTML2から)継承していて、最新のページも作れる、HTML5を勧めるのが現実的か。だったら、なんで、僕ぁ、ISO-HTMLの話しなんかしてるんだ?w いやいやいや、破棄されたわけでも何でもないから、使いたい人は使えばいいのだ。