XHTML やめて HTML5 で書いてみたよ！（画像をクリックで原寸表示）
サイトの内容も足したり引いたりしてますので、よろしければご覧になってみてください。まともに更新したの2年ぶり；

http://site-ichijo.net

今回から Internet Explorer 7 以下のブラウザをご利用になっている方にはモダンブラウザにしてみない？ なお誘いを表示させています。

IE7 以下をお使いの方へのお知らせ。（画像をクリックで原寸表示）

HTML5 と関係ないところでは、上記スクリーンショットを見比べていただくと分かるかと思いますが、罫線が本来は綺麗な画像なんですけれども、IE6 & 7 ではただの灰色の線になっています。IE8 は OK です。

HTML5 に対応していない Internet Explorer 8 以下への対応に関しては後述しますが、フォローしていますので表示崩れなどはないはずです。

去年辺りから「HTML5」という単語をウェブデザイン界隈でよく見かけるようになりました。簡単に言えば、HTML で現在主流の Version 4.01 の次のやつ、ということです。いろいろ新しく出来るようになるらしいですよ、5 になると。
HTML4.01 だけでなく、XHTML っていうのも現在主流なんですけれども、最近は何はともあれ HTML5 が熱くなっています。ちなみに site-ichijo.net 以外の僕のサイトはまだ XHTML です。順次 HTML5 に移行予定。

Flash との関係とかその辺の話は置いといて、僕が今回 HTML5 をちょっと触ってみて「これはすごい」と思ったのは、Twitter につぶいやいたことでもあるんですが、

#HTML5 、これはおもしろい。なんかすごく文学的なものを感じるのですが。各コンテンツの役割を認識し、それぞれが持つ意味にふさわしい居場所を与える。このまま行けばHTML5は人間的な優しさにあふれた仕様になるんじゃなかろうか。
10:16 PM Apr 17th

逆に言えば、制作者は今まで以上にコンテンツを愛する必要がある。愛のないコードは完結しない。
10:18 PM Apr 17th

コンテンツが持つ意味、コードが持つ意味、それを大事にしようよっていう流れを感じるけど、そうするとますます配置先行型作成ツールは立つ瀬がなくなるんでは。僕はコード書きだから関係ないけど…。コンピュータもコンテンツの意味を自ら推測し、把握することができるようになっていくんだろうか。
10:25 PM Apr 17th

自分のサイトもリニュついでにHTML5っぽく書いてみよ。うひひひひ。（ぁゃιぃ
10:31 PM Apr 17th

むむむ。 #HTML5 、IE8も対応まだまだだったのね…。仕方ない、html5.js導入しますか。IE9はやくこいこい。
約10時間前

html5.js 素晴らしすぎですの！！さすがおねえさｍ（ｒｙ
約10時間前

更新完了。すっきりさっぱり。 http://site-ichijo.net/ とりあえず #HTML5 で書いてみた。ならではのコンテンツは皆無だけれど。コードレヴェルで意味を与えたという点ではこの変化はやっぱり大きい。それとIE7以下にはブラウザのお知らせを表示。
約2時間前

なんかアレなトゥイートも混じってますが（笑）、そういうことを思った次第。

例えば今までは

[xml]
<div id="header">
<h1>site-ichijo.net</h1>
</div>
[/xml]

などと div さんを万能選手とばかりに酷使していました。囲むためだけに div、目印のためだけに div。もう div 氏涙目。
ここで問題なのは、id=”header” という ID 付けに、「ヘッダーである」という意味はないことです。あるのは我々作り手のための目印としての意味、と言っていいでしょう。ユニークなものであれば別に

[xml]
<div id="aqwsedfrtgyhujikolp">
<h1>site-ichijo.net</h1>
</div>
[/xml]

でもいいわけです。でもこれでは生身の人間である我々にとっては「分かりづらい」ので「ヘッダーのところだからそのまま “header” という ID にしましょうかね、分かりやすいもんね」としているだけ。
コードとして「ここがヘッダーである」という意味を付与するわけではありません。制作者の認識に過ぎません。

それが HTML5 には「ヘッダーのとこの ID にみんな “header” ってよく使ってるよね。ならもうそれを作っちゃうYO!!」ということで <header> というそのままなネーミングの要素が出来てしまいました。
これはすごいです。<header> ～ </header> で囲んだところが「ヘッダーである」という意味を持つようになったのです。

[xml]
<header>
<h1>site-ichijo.net</h1>
</header>
[/xml]

これで思ったのが、制作者は今まで以上にコンテンツをよく知り、吟味する必要が出てきたこと。コンテンツへの愛なくしては出来ない気がします。ここは <nav> で囲むべきか。ここは <footer> にするべきかそれとも <section> にするべきか。どこからどこまでを <article> にするべきか。
よくよくコンテンツの意味と優先順位を把握していなければ、美しいコーディングができなくなる気がします。今まではそもそも意味なんてないから便宜性優先で <div> で囲って適当に分かりやすい ID やクラスをつけてればよかったんですけどね（笑）。

でもこれはいい変化が生まれていきそうです。なにが一番大事なのか、各コンテンツの相互関係とページ内での立ち位置。それらを把握し配置する。そうすればそれらコンテンツがソースレヴェルで明らかな役目（要素）を負って、立場を与えられて表現出来るようになった。
「文学的になった」と僕が表現したのはそういうところからです。

最後に有益な情報を与えてくださったサイトさんをご紹介します。どれもとても役立ちました。ありがとうございます。

とりあえずこれ読めばHTML5コーダーになれるかも資料集 | UMLAND
なれたかは分かりませんが、HTML5 の楽しさをかじることが出来ました。紹介してくださったサイトがみな本当に役立ちました。多謝。

HTML5 についての Q&A – めざましTech
とっても分かりやすい紹介です。HTML5 って何？難しそう…と思ったらぜひ一読を。やってみよう！ という気になります！

HTML5 基礎知識 – web探検隊
わかりやすくまとめられていて素晴らしい。書き始めるときにはぜひ。

HTML5.JP – 次世代HTML標準 HTML5情報サイト
リファレンスサイト。分かりやすくて素晴らしい。タグリファレンスは必携。

最初の方で IE8 以下は HTML5 に対応していないと書きましたがその対処はこちら。

HTML5 下位ブラウザへの対応 – シャンディ・ガフを飲みながら
こちらに書いてあることをなぞるだけでもうサポートは万全（笑）。サポートに関する考察もとても賛同できるものでした。
その HTML5.js はこちらですが、素晴らしすぎですの！！ さすがおねえさｍ（ｒｙ

あと CSS3 についてはまだなにも知らないので、また近いうちに調べてみたいと思います。