
最近、クーシーラボでHTML5の研究を始めました。
次世代のHTMLとして注目されながら、 まだまだ謎が多いHTML5。
クーシーラボでは2012年の勧告(W3C)を待たず、積極的にhtml5の導入を考えています。
まずはHTML4.0やXHTML1.0との違いを理解し、新しいタグの意味や使い方を学んでいこうと思います。
その際、CSS3もできるだけ使用していきたいと思います。
目指すは『HTML5+CSS3でもレイアウトが崩れないコーディング』です!
段々と広まりつつある Android や iPhone といったスマートフォンや、IE9 や Firefox などの主要ブラウザでも対応してきているHTML5。 いったいどういうものなのか?ということで、簡単なサンプルと解説を交えて、HTML5の機能を紹介したいと思います。
ややこしかったHTMLヘッダ宣言の記述が簡潔になったり、ヘッダー、フッター、ナビゲーションなどの、どのサイトにもあるようなエリアに対してタグが追加されました。
「文法の変化」を詳しく見る
簡単な記述で、フォームを装飾することができるようになりました。
「フォームがパワーアップ」を詳しく見る
今までFlashや、QuickTimeプラグインがなければ再生できなかったビデオやオーディオファイルが、HTML・JSの記述で再生が可能になりました。
Video タグサンプル
Audio タグサンプル
今まで、HTML・Javascript内での保存先といえば Cookie でしたが、より大容量のデータを保存することができるようになりました。
「オフライン対応」を詳しく見る
今まで、アニメーションといえばFlashが主流でしたが、HTML5になり、HTML+Javascript で簡単なアニメーションが記述できるようになりました。
「Canvas タグ」を詳しく見る
タグだけではなく、Javascript もパワーアップしました。
ここでは、そのパワーアップした内容の片鱗を紹介いたします。
File API
Drag & Drop API
PostMessage API
Web Workers API