HTMLとHTML5の違いとは?主要な5つの相違点をわかりやすく解説

Webページ制作の基礎となるHTMLについて学ぶ前に、まず「マークアップ言語」という概念を理解しておきましょう。HTMLは「Hyper Text Mark-up Language(ハイパーテキスト・マークアップ言語)」の略称で、タグ(tag)を使ってテキスト文書の構造を定義する言語です。このタグによって、Webページ全体の構造が決定されます。つまりHTMLとは、「ハイパーテキスト」と「マークアップ言語」を組み合わせたものなのです。

HTML5はHTMLの発展版(上位バージョン)にあたるため、新たに追加された機能を中心として、両者にはいくつかの顕著な違いが存在します。以下の表は、HTMLとHTML5の重要な違いをまとめたものです。

HTMLとHTML5の主な違い一覧

各項目の詳細解説

1. 音声・動画(AV)への対応

HTMLはこの言語の初期バージョンであるため、Flash Playerなどの外部プラグインを使用しない限り、音声や動画を再生できませんでした。一方のHTML5では、「<audio>」タグと「<video>」タグが導入され、プラグインに依存することなく音声・動画を扱えるようになりました。

2. データの保存方法

HTMLでは、サーバーからクライアント側へ送られるデータの保存に、ブラウザのCookieやセッションが利用されます。これに対してHTML5では、SQLデータベースやアプリケーション自身のキャッシュを用いて、クライアント側にアプリケーションデータを保存できます。その結果、HTMLよりも拡張性の高いデータ保存が実現しました。

3. JavaScriptの実行

従来のHTMLでは、JavaScriptはサーバーサイドで動作する言語として扱われており、そのコード実行はサポートされていませんでした。しかしHTML5では「JS Web Worker API」が登場し、HTMLのコード実行と並行して、JavaScriptをバックグラウンドで動かすことが可能になりました。

4. 図形の描画

HTMLでは、ブラウザ側で三角関数などを用いた図形をコードによって描画することができません。一方HTML5では、CanvasやSVGを活用することで、円・長方形・三角形など、さまざまな図形を自由に描画できます。

5. ブラウザ互換性

HTMLは長い歴史を持つ言語であるため、最新ブラウザはもちろん、すべての旧式ブラウザでもサポートされており、互換性の面で優れています。一方HTML5は、Firefox、Chrome、Safari、Edgeといった新しいブラウザでのみサポートされており、旧ブラウザでは表示や動作に制限が生じる場合があります。

まとめ

HTMLとHTML5の違いは、「音声・動画対応」「データ保存」「JavaScript実行」「図形描画」「ブラウザ互換性」の5つの観点で整理できます。現在ではHTML5が事実上の標準となっており、新規のWebサイト制作はHTML5ベースで行うのが一般的です。ただし、レガシー環境への対応が求められるケースでは、旧HTMLとの互換性も考慮に入れるとよいでしょう。