HTML5には技術的に8つの特徴があり、それぞれの技術にシンボルマークも定義されています。
それぞれのシンボルマークがどういう意味を持っているのか順番に見ていきましょう。
セマンティクス
より明確に文書構造を定義することができます。例えばこれまでWebページでヘッダー、本文、サイドバー、フッターと４つのブロックを表現するには以下のように記述していました。
<div id="header">ヘッダー</div>
<div id="main">本文</div>
<div id="side">サイドバー</div>
<div id="footer">フッター</div>divタグを使いブロック要素として記述していました。これをHTML5では新たなタグを追加して以下のような文書構造を表します。
<header>ヘッダー</header>
<article>本文</article>
<aside>サイドバー</aside>
<footer>フッター</footer>他にも‹aside›や‹section›、‹nav›、‹mark›、‹meter›、‹address›などのタグがあります。
オフラインストレージ
ブラウザ上にデータを保持できるデータベースを持つことができます。
これまでブラウザにユーザのデータを保持できる仕組みはクッキーのみでしたが、このローカルにデータを保存できる仕組みが大幅に強化されています。
デバイスアクセス
Geolocation(ジオロケーション)などデバイスが持っているGPSや加速度センサなどに対してアクセスできるようになります。
コネクティビティ
これまではクライアント側のブラウザがサーバに対してデータをリクエストするだけでした。
HTML5ではWebSocketによりサーバ側からクライアントへデータを送信することができます。
マルチメディア
オーディオやビデオなどのマルチメディアファイルを扱うことが可能となります。
グラフィック
CanvasやSVGなどグラフィックスを扱うことができます。
2Dグラフィックスだけでなく、3Dグラフィックスも扱うことが可能です。
パフォーマンス
Web Worksとよばれるマルチスレッドプログラミングがブラウザ上で可能になります。
スタイリング
CSS3によりスタイル機能が大幅に強化されています。
HTML5＋CSS3によりアニメーションや色のグラデーションなどが簡単に表現することが可能です。
これらの8つの要素技術によりHTML5は成り立っています。