HTML5の草案が公開
- 2008-01-23 11:04
-
Tweet
W3CがHTML5の草案を公開しました。
うちもW3Cメンバーですが、実務に負われてまったくもって参加できていません・・・早く活動に参加したいですね。
HTML4は1999年から進化が止まっていますが、いまやWEBでは欠かせない存在です。
ホームページビルダーの登場により、HTMLがより身近な存在になったのは事実ですが、ブラウザにデザインを表示するために無理矢理かかれたHTMLが多く、作業効率や無駄を考えると決して良い使われ方をされていませんでした。また、CSSは存在しましたが、ブラウザの再現性が悪く、活用されていませんでした。
ブログの登場により、XHTML1.0が脚光を浴び始めました。ブログのような構造化されたデータをHTMLで表現するには制限が多く、XHTML1.0を用いるサイトが増えたからです。
またブラウザの進化によって、CSSを忠実に再現することが出来るようになり、デザイン制御をCSSで行うサイトが増えてきました。
また、サーチエンジンでの上位表示が重要視されたため、適切なマークアップが求められ、いまでは多くのWEBサイトがXHTML＋CSSで構築されています。
※デザインのためにXHTMLが必要だと勘違いしている人が多く、必要のないところにXHTMLを利用しているサイトが多いのも事実ですが・・・
ところが、XHTML1.0(HTML4)＋CSSの組み合わせでは、デザインを表現するためにdivタグにidやclassをつけてfooterやmenuなどを表現することが多く、使いづらい部分が多いのも事実です。
HTML5は草案段階ですが、
たとえば、一般的なブログをHTML4でマークアップすると下記となります。
<html>
<body>
<div id="header">
<h1>うさうさBlog</h1>
</div>
<div id="contents">
<div class="entry">
<h2>ブログタイトル</h2>
<p class="date">2007年11月1日</p>
<p>ブログ記事の本文です</p>
</div>
<div class="entry">
<h2>ブログタイトル</h2>
<p class="date">2007年10月1日</p>
<p>ブログ記事の本文です</p>
<p><img src="hogehoge.jpg" alt="ほげほげ"><br>画像の注釈です。</p>
</div>
<div id="sidemenu">
<h3>ブログ記事</h3>
<ul>
<li>ブログ記事のタイトル</li>
</ul>
</div>
<div id="footer">
<p>Copyright うさうさBlog</p>
</div>
</body>
</html>
HTML5だと下記のようによりわかりやすく表現できます。
<html>
<body>
<header>
<h1>うさうさBlog</h1>
</header>
<section>
<article>
<h2>ブログタイトル</h2>
<time>2007年11月1日</time>
<p>ブログ記事の本文です</p>
</article>
<article>
<h2>ブログタイトル</h2>
<time>2007年10月1日</time>
<p>ブログ記事の本文です</p>
<figure>
<legend>画像の注釈です。</legend>
<img src="hogehoge.jpg" alt="ほげほげ">
</figure>
</article>
</section>
<nav>
<h3>ブログ記事</h3>
<ul>
<li>ブログ記事のタイトル</li>
</ul>
</nav>
<footer>
<p>Copyright うさうさBlog</p>
</footer>
</body>
</html>
その他にも、「埋め込みメディアaudio , video」「インライン要素 time,meter等」「ブロックレベル要素 dialog , aside等」「対話性 details , datagrid等」などが追加されています。
比較するときりがないですが、W3CがHTML4との違いを公開（日本語訳）していますので、興味がある人は一度見てみると良いですね。
勧告は2010年予定なのでまだまだ先ですが、HTML5を使ったWEB構築が楽しみで仕方ありません（笑
追記：CNETにちょっと詳しく載っています。