HTML5対応：意味と機能をマークアップ

HTML/CSS

HTML5が迫ってきました。そんな中「HTML5対応：divで乗り切れ: 万象酔歩」というエントリがあると聞き閲覧してみたところとても黙ってはいられずこのエントリを書き始めました。釣りなんじゃないかという疑念もありますが。まぁ釣られてみます。

それはHTML3.2だ。古すぎる。

まず、目についたのは「HTML5対処法メモ」のなかに現れる「CENTERが無くなる」「FONTが無くなる」「 Bがボールドでなくなる 」「Aがアンカーでなくなる 」といった文言です。これらはすべてHTML4の時点で非推奨となっていたり代替手段が提供されているもので、とっくに用済みとなっているべきものたちで、HTML4が後方互換のために残さざるを得なかったHTML3.2の負の遺産にすぎません。そもそも"HTML5対処法"以前にHTML4にすらまともに対応していなかったことになります。

まずはHTML4を知るべし。

HTML3.2の考え方が抜けきっていないのであればHTML5を知る前にHTML4を知るべきです。HTML3.2からHTML4への重要な変化は「html文書から見た目に関する事柄を排除すること」につきます。つまり、HTML3.2にあるCENTER,FONT,Bと言った見た目のための要素は無くし見た目はCSSなどののスタイル定義に任せようということです。こうすることで"見た目を変えるためにマークアップをし直す"というようなことが起こらなくなります。簡潔にスタイル定義さえ書き換えれば良いのです。
さて、このことについて件のエントリには下記のような興味深い記述があります。

また、これまでは文の定義そのものとその表示形式指定はかなり分離されていましたが、 HTML5では文の定義に形式を持たせる形になります。

文章中にcenter要素やb要素などが入っているのが「表示形式指定はかなり分離されていた」と主張するのは道理に合いません。そのうえ、根拠として示して次のような説明をしています。

例えば、文とは別レベルであった<center>などが廃止され代わりに文の定義<table>などで style="margin-left:auto;margin-right:auto;text-align:center"などというとんでもない寿限無指定するのが標準となります。

確かにstyle属性によってスタイル定義を行うことは出来ますが本当に標準なのでしょうか？HTML4の仕様書*1を見てみると、次のようにあります。

スタイルシートを別ファイルにすることで、容易に再利用できるようになる。一方、文書の始めの部分にレンダリング命令をまとめておいたり、本文の各要素の属性として記しておくなどして、文書にスタイルシートを含めることが便利な場合もある。サイト単位でのスタイル管理が容易にできるよう、本仕様では、文書に適用するスタイルシート情報をHTTPヘッダで設定する方法を説明する。

Style Sheets in HTML documents (ja)

多くの場合、著者はひとまとまりの文書には共通のスタイルシートを利用する。この場合、スタイルルールを文書内部に分配することは、1つの外部スタイルシートにリンクすることよりも実際に効率が低下する。なぜなら外部スタイルシートにリンクした場合、大部分の文書にとっては、ローカルのキャッシュにスタイルシートが既に存在するからである。優れたスタイルシートが公有されることで、この効果は増大するだろう。

Style Sheets in HTML documents (ja)

つまり多くの場合は共通の外部スタイルシートを使うけれど、利便性のために属性指定もできるようにしてあるということです。なので属性による記述は"標準"などではありません。また、多くの場合使うとされている外部スタイルシートでは"容易に再利用ができる"という利点まで明記されています。
つまり、根拠も主張もHTML5以前にHTML4の仕様書すら読んでいないと思えるほどの内容です。このあたりの斜め上な説明を見てると釣りなのではという疑問がわいてくるわけです。
また、次の項でもとりあげるclassの指定についてもHTML4の仕様を理解していない記述がありました。

classは多重派生させることはできませんので、中央寄せのこの色、左寄せのこの色といった具合に無数のclass定義をすることになりかねません。

このように書かれていますが、仕様書を見てみるとclass属性には複数の値持たせることができると書いてあります。

class = cdata-list [CS]
この属性は、ある要素に1つのクラス名を割り当てるか、または複数のクラス名を設定する。幾つの要素に対してでも、同じクラス名あるいはクラス名群が割り当てできる。複数のクラス名については、空白文字によって区切らねばならない。

http://www.asahi-net.or.jp/~SD5A-UCD/rec-html401j/struct/global.html#adef-class

また、CSS2にも複数指定されたクラスを選択するセレクタが存在します。詳しくはSelectors(邦訳)をご覧ください。

class,idの使い方。

これもやはりHTML4の話につきるわけですが、件のエントリで頻繁に登場する"divで乗り切れ"の項でのclassやidの使い方がとても正しいとは言えないものです。

たとえばfont要素の代替手段として次の例が示されています。

.red{color:red}
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
<p>XHTMLは<span class=red>機械向け仕様</span>であって人間向けではありません

このようにclassにredという見た目に関する名前を付けてしまうとよろしくありません。この辺はHTMLの仕様の裏側まで読み解く必要があり詳しく説明するのも一苦労なので、細かいことは神崎氏の「ごく簡単なHTMLの説明」をご覧ください。

「ＨＴＭＬ６に望むこと 」のはずがCSSに望んでる

ここまでHTML5について全く触れていないんですが、ＨＴＭＬ６に望む事があるというので見てみると、中身はほとんどCSSについてです。CSSはHTMLとは独立した仕様であって、また仕様上HTMLから利用できるスタイルシートはCSSだけではありません。
HTMLに関することがらである「HTML記述のincludeが欲しい。 」についてもHTML4から仕様としてはobjectでhtmlを読み込んだり出来ますし、XHTMLではxincludeを併用することでも実現できます。

結論

HTML5の話題ではなく、まるでHTML4が出てきたときに批判した文章をsed -i s/HTML4/HTML5/g に通したような内容でした。HTML5の新規機能には全く触れてませんし…
HTML5を前にしてHTML4を復習する教材としては面白いかもしれませんね。

HTML5への自動変換(2010-06-01 20:54 追記)

触れるのを忘れていましたが、件のエントリにはHTML5への自動変換のためのbuild.xmlが掲載されています。この変換ではdoctypeも指定していないようですし変換後にHTML5な要素が出てこないようですのでまぁよくてできの悪いHTML4にしかなりません。そもそも意味論的なマークアップをしていないHTML3をHTML4や5に自動変換するのはナンセンスだと個人的には思います。
ただ、そんなことは実はどうでもよくて、そもそも現在使われている一般的なブラウザは既存のHTML3な文書についてもそれなりに解してレンダリングしてくれるし、この先も特別な事情でもない限りこの互換性は当分の間保たれると思います。となると、無理して質の悪いHTML4や5に変換しなくてもそのままHTML3でいいんじゃないでしょうか。

*1:ここでは日本語を使う人のため日本語訳を参照します。正確性を求める場合は原文をお確かめください。