この文書は翻訳中です。他国語のままの部分などがあるのはその為です。
是非お気軽に MDN に登録して翻訳に参加し、私たちの手助けをして下さい!

HTML5 は HTML で定義されている最新の標準仕様の名称です。この用語は、2 つの異なる概念を表しています。

  • 新しい要素、属性、動作を伴う、新しいバージョンの言語のHTML。
  • より多様でパワフルな Web サイトやアプリケーションを可能にする技術のより大きなセット。このセットは HTML5 & friends と呼ばれ、しばしば HTML5 と短縮されます。

すべての Open Web 開発者に向けて、このリファレンスは、機能に基づいていくつかのグループに分類された、 HTML5 の技術に繋がっています。そのコンテンツが何であるかをよりはっきりと表現することを可能にする semantics、新しい方法でサーバーと通信することを可能にする conectivity、 Web サイトがローカルにデータを保存し、ブラウザがオフラインであってもよりよい動作をするよう最適化することを可能にする offline & strage、 Web の第1級の市民であるビデオやオーディオを作ることを可能にする multimedia、ことさらに複雑なプレゼンテーションを達成する 3D, graphics & effects、コンピュータとのより良い融合による、さらにスピーディな Web サイトを可能とする performance & integration、より多くの入力・出力デバイスを使うことを可能にする device access、そして、著者により洗練されたテーマを書かせることを可能にする styling です。

SEMANTICS

HTML5 のセクションとアウトライン
HTML5 ではアウトラインとセクションに関する要素が追加されました: <section><article><nav><header><footer><aside><hgroup>.
HTML5 の audio 要素と video 要素の利用
<audio> 要素と <video> 要素はマルチメディアコンテンツの埋め込みや操作を可能にします。
HTML5におけるWebフォーム
HTML5 では Web フォームに様々な改善が施されています。制約バリデーション API、多数の新しい属性、<input> 要素の属性の新しい type の値の追加。そして新要素として <output> が追加されています。
新しいセマンティック要素
セクションやメディア、フォーム要素のほかに、<mark><figure><figcaption><data><time><output><progress>、 あるいは <meter>のような多くの新しい要素、妥当なHTML5 の要素はますます増えています。
<iframe> の改善
sandboxseamlesssrcdoc 属性を使用することで、著者は今やセキュリティレベルを明確にし、望まれた <iframe> 要素の描画が可能となりました。
MathML
HTML 文書に数式を直接埋め込むことができます。
HTML5 の紹介
この記事では、Web デザインや Web アプリケーションでの HTML5 の利用方法を紹介します。
HTML5 に準拠したパーサ
バイト単位の HTML 文書を DOM に変換するパーサは、拡張され、あらゆるケース、たとえ妥当ではない HTML に直面したときであっても、させるべき明確な動作を定義し、 HTML5 に準拠したブラウザの間ではるかに高い予測可能性と相互運用性へ導きます。

Connectivity

Web Sockets
Web Socketsはページとサーバーが永続的な接続を作成し、 HTML ではないデータを交換することを可能にします 。
サーバーが送出するイベント
サーバーがクライアントからのリクエストに対するレスポンスとしてのみデータを送ることができたという、古典的な枠組みより、サーバーがクライアントにイベントを送出することが可能になります。
WebRTC
この RTC (Real-Time Communication) という技術によって、プラグインや外部のアプリケーション無しに、ブラウザで直接、他者に接続して、テレビ会議を操作することが可能になります。

Offline & storage

アプリケーションのキャッシュとしての、オフラインリソース
Firefox は HTML5 のオフラインリソースの仕様を完全にサポートしています。その他のほとんどは、いくつかのレベルでオフラインリソースをサポートしています。
オンライン及びオフラインのイベント
Firefox 3 は WHATWG の、アプリケーションや拡張機能にアクティブなインターネット接続があるかどうかを検出させ、接続の成功やダウンも検出する、オンライン及びオフラインのイベントをサポートしています。
WHATWG のクライアントサイドセッションと、 DOM Storage として知られる永続的なストレージ
クライアントサイドセッションと永続的なストレージは、 Web アプリケーションが、構築されたデータをクライアントサイドに保存することを可能とします。
IndexedDB
IndexedDB は、インデックスを使って、ブラウザで大量に構造化されたデータの保存と、このデータの高性能な検索のための Web 標準です。
Web アプリケーションからファイルを扱う
新しい HTML5 File API のサポートは Gecko に加えられており、 Web アプリケーションはユーザーによって選択されたローカルファイルにアクセスすることができるようになっています。これは、typefile である  <input> HTML 要素の新しい multiple 属性を使った、複数のファイル選択のサポートを含みます。 FileReader もあります。

Multimedia

HTML5 の audio 要素 と video要素の利用
<audio> 要素と <video> 要素はマルチメディアコンテンツの埋め込みと操作を可能にします。
WebRTC
この RTC (Real-Time Communication) という技術によって、プラグインや外部のアプリケーション無しに、ブラウザで直接、他者に接続して、テレビ会議を操作することが可能になります。
Camera API の利用
コンピューターのカメラの使用、操作、およびカメラ画像を格納することができます。

3D, graphics & effects

Canvas チュートリアル
新しい <canvas> 要素についてと、 Firefox でどのようにグラフや他のオブジェクトを描画するかを学習します。
HTML5 text API for <canvas> elements
HTML5 の text API が <canvas> 要素によってサポートされます。
WebGL
WebGL は、 HTML5 の <canvas> 要素で利用できる、OpenGL ES 2.0 に厳密に従った API を提供することで、 3D グラフィックスを Web にもたらします。
SVG
ベクター画像の XML ベースのフォーマット。HTML5 では SVG を直接文書に埋め込む事が可能になりました。

Performance & integration

Web Workers
JavaScript の評価をバックグラウンドのスレッドに委譲することを可能にして、これらの動作がインタラクティブなイベントを低速にすることを防ぐことを可能にします。
XMLHttpRequest Level 2
ページのいくつかのパーツの非同期に取得することを可能にして、時間とユーザーのアクションによって変化する、動的なコンテンツを表示することを可能とします。これは Ajax の背後にある技術です。
JIT-compiling JavaScript engines
新世代 の JavaScript エンジンは以前よりはるかに強力で、パフォーマンスの向上を導きます。
History API
ブラウザの閲覧履歴の操作ができます。特に対話的に新しい情報を読み込むページに於いて有益な API です。
contentEditable 属性で、あなたの Web サイトが wiki に変身!
HTML5 は contentEditable 属性を標準化しました。この機能についてより学びます。
ドラッグ&ドロップ API 
HTML5 の ドラッグ&ドロップ API は、 Web サイト内部あるいは Web サイト間の、アイテムのドラッグ及びドロップのサポートを可能にします。これはまた、拡張機能や Mozilla ベースのアプリケーションで使用するための、よりシンプルな API 提供します。
HTML でのフォーカスの管理
新しい HTML5 の activeElementhasFocus 属性がサポートされています。
Web ベースのプロトコルハンドラ
navigator.registerProtocolHandler() メソッドを使って、 Web アプリケーションをプロトコルのハンドラとして登録することができます。
requestAnimationFrame
アニメーションのレンダリングのに最適なチューニングが施された新しいメソッド。
Fullscreen API
ブラウザの UI を表示せずに、 Web ページやアプリケーションがスクリーン全体の使用を制御します。
Pointer Lock API
ゲームや類似したアプリケーションが、ポインタがウィンドウの境界に達したときにフォーカスを失わないように、コンテンツにポインタをロックすることを可能にします。
オンライン及びオフラインのイベント
オフラインで有能な良い Web アプリケーションを構築するため、アプリケーションが実際にオフラインであるときのことを知る必要があります。ついでに、アプリケーションが再度オンライン状態を返したときのことも知る必要があります。

Device access

Camera API の利用
コンピュータのカメラからの画像の使用、操作、保存が可能になります。
Touch events
閲覧者のタッチスクリーン押下によって発生するイベントに対応するハンドラ。
Geolocation の利用
ブラウザが閲覧者の現在位置を取得し、これを利用する事が出来ます。
デバイスの方向の検出
ブラウザを起動しているデバイスが方向を変えたときに、その情報を得られるようにします。例えば、デバイスの姿勢に反応するゲームを作るための入力デバイス、あるいは縦長または横長というスクリーンの方向に、ページのレイアウトを適応するために利用できます。
Pointer Lock API
ゲームや類似したアプリケーションが、ポインタがウィンドウの境界に達したときにフォーカスを失わないように、コンテンツにポインタをロックすることを可能にします。

Styling

CSS は、さらに複雑な方法で要素を形成することができるように拡張されてきました。 CSS はもう一枚岩の仕様ではなく、異なるモジュールがすべてレベル 3 ではありませんが、これはしばしば CSS3 として参照されます。いくつかのモジュールはレベル 1 、あるモジュールはレベル 4 で、その中間のすべてのレベルをカバーしています。

背景のスタイリングの為の新機能
box-shadow を使ってボックスに影を付けることや、複数の背景を設定することが可能です。
面白い border 関連 CSS プロパティ
border-image 及びそれに関連付いた非省略形のプロパティを使って枠線の形成に画像を使うことができるだけでなく、 border-radius プロパティを通じて角丸の枠線がサポートされます。
スタイルのアニメーション
異なる状態にアニメーションするための CSS Transitions の使用、またはイベントの引き金無くページのパーツをアニメーションするための CSS Animations の使用により、ページの可動要素を操作することができます。
タイポグラフィの改善
著者には、より良いタイポグラフィに到達するための、より良いコントロールがあります。 text-overflowハイフネーションはもちろん、もコントロールでき、またはその装飾はより明確にコントロールすることができます。新しい @font-face @規則のおかげで、特別な書体をダウンロードし、適用することができます。
新しい表象的なレイアウト
デザインの柔軟性の向上のため、 2 つの新しいレイアウトが加えられました。 CSS マルチカラムレイアウトと、 CSS フレキシブルボックスレイアウトです。

 

ドキュメントのタグと貢献者

 このページの貢献者: tmtarr, teoli, isdh, ethertank, sii, vigia122, Potappo, saneyuki_s, shirayuki, Dwchiang, Marsf
 最終更新者: tmtarr,