HTML5 の概要

なし HTML5ブラウザのサポート

各章の HTML5 の例

例

<!DOCTYPE html>
<html>
<body>

<video width="420" controls>
  <source src="mov_bbb.mp4" type="video/mp4">
  <source src="mov_bbb.ogg" type="video/ogg">
 Your browser does not support the video tag.
</video>

</body>
</html>

自分で試してみる

[Try It Yourself] をクリックして、この例がどのように機能するかを確認してください。

HTML5 とは何ですか?

HTML5 は最新の HTML 標準です。

HTML5 は、追加のプラグインを必要とせずにリッチな Web コンテンツをホストできるように特別に設計されています。

HTML5 には、新しいセマンティック要素、グラフィック要素、およびマルチメディア要素があります。

HTML5 は、Web アプリケーションの構築を簡素化する新しい要素と新しい API を提供します。

HTML5 はクロスプラットフォームであり、さまざまな種類のハードウェア (PC、タブレット、電話、テレビなど) で実行できるように設計されています。

注: 次の章では、古いブラウザでの HTML5 の処理を​​「支援」する方法を学習します。

HTML5 の新機能は何ですか?

HTML5 の新しいドキュメント タイプ (DOCTYPE) 宣言は非常にシンプルです。

<!DOCTYPE html>
The new character encoding (charset) declaration is also very simple:

<meta charset="UTF-8">

HTML5 の例:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>

<body>
Content of the document......
</body>

</html>

注:HTML5 のデフォルトの文字エンコーディングは UTF-8 です。

HTML5 - 新しい属性構文

HTML5 標準では 4 つの異なる属性構文が許可されています。

この例は、<input> タグで使用されるさまざまな構文を示しています。

タイプ 例
Empty <input type="text" value="Bill Gates" disabled>
Unquoted <input type="text" value=Bill Gates>
Double-quoted <input type="text" value="Bill Gates">
Single-quoted <input type="text" value='Bill Gates'>

HTML5 標準では、属性の必要性に応じて 4 つの構文すべてを使用できます。

HTML5 - 新機能

HTML5 の最も興味深い新機能のいくつか:

  • 、
    、
    、
    などの新しいセマンティック要素。
  • 数値、日付、時刻、カレンダー、スライダーなどの新しいフォーム コントロール。
  • 優れた画像サポート (<canvas> および <svg> 経由)
  • 優れたマルチメディア サポート（<video> および <audio> 経由）
  • Cookie をローカル ストレージに置き換えるなど、強力な新しい API。

HTML5 - 削除された要素

次の HTML 4.01 要素は HTML5 から削除されました:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>
なし HTML5ブラウザのサポート