【2022年】HTMLの最新バージョンを紹介!歴史やCSSの最新情報も

プログラミングの学習をしている時に「HTMLの最新バージョンってどれ?何を使えば良いの?」と思ったことはありませんか?
そもそも「HTMLのバージョンが何かもわからない」という方もいるでしょう。
しかし、HTMLのバージョンはエンジニアやプログラマーにとって非常に重要なもの。
今まで使えていたタグが、実は現在では廃止になっていた…なんていうこともあり得ます。
そこで今回は、2021年のHTML最新バージョンについて解説します。
この記事でわかる内容は以下の通りです。
- HTMLのバージョンについての基礎知識
- 2021年最新バージョンの「HTML Living Standard」について
- HTMLバージョンの歴史
最新のHTMLバージョンを把握しておくことで、ルールに基づいたコーディングをすることができるようになります。
また、以前にはなかった便利なタグも登場してきているので、しっかり確認しておきましょう!
そもそもHTMLのバージョンとは?
「HTMLにバージョンがあること自体知らない」という方のために、HTMLのバージョンとは何か解説していきます。
HTMLにおけるバージョンとは、HTMLの正しい仕様やルールを確認するためのもので、仕様が新しくなるたびに「HTML4.0」「HTML5.0」など、バージョンの名称も変わっています。
末尾についている数字が大きいほど最新のバージョンになります。
2021年最新のHTMLバージョンとは?
2021年11月現在のHTML最新バージョンは「HTML Living Standard」です。
「あれ?バージョンの数字がない?」と思った方も多いでしょう。
実は、2021年1月にHTML5が廃止になり、名称もHTML Living Standardに変更されました。
今後、仕様が更新された場合も、新しいバージョンではなく、HTML Living Standardの仕様が更新される形で統一されています。
HTML Living Standardの仕様は基本的に英語ですが、日本語訳もされているので、日本語で新しい仕様を確認することが可能です。
なぜHTML5は廃止されたのか?
ではなぜ、突然HTML5が廃止となり、HTML Living Standardに統一されたのでしょうか?
このことを知るためには、まず、以下の内容を理解する必要があります。
- 広義・狭義のHTML5について
- WC3とWHATW
では、それぞれについて見ていきましょう。
広義と狭義の意味のHTML5
一言でHTML5といえど、人によって内容が異なる場合があります。
広義とは、広い方の意味というとらえ方。
「HTML5でWebサイトを作ってみた」「HTML5で便利な属性が増えた」など、一般的な人々が話す内容が広義のHTML5に当てはまります。
狭義とは、狭い方の意味というとらえ方。
W3Cという機関が定めたHTMLの勧告が、狭義のHTML5に当てはまります。
今回解説するのは、後者の狭義のHTML5です。
W3Cとは
正式名称「World Wide Web Consortium」のW3Cは、Webの標準を策定している国際的な機関で、初めてWebサイトを設立したティム・バーナーズ=リーが設立した組織です。
HTMLだけでなく、CSSやDOMといったWebサイトに関わる全ての仕様を決めています。
HTMLのバージョンを管理しているのもW3Cで、HML5.0は2014年10月28日に勧告されました。
WHATWG
WHATWGとは、W3Cが考えるHTML仕様に反発した人々で結成された新しい組織です。
実は、HTML5が生まれるきっかけになった組織でもあり、HTMLの改善を求め、W3Cに圧力を掛けたことがきっかけでHTML5が誕生しています。
HTML5の誕生により、一度は協力体制にありましたが、その後の方向性の違いから一時的に「W3CのHTML5」と「WHATWGのHTML」の2つのHTMLが標準として併存する時代がありました。
2019年5月にようやく停戦協定が結ばれ、WHATWGの作ってきたHTML Living Standardが標準として勧告されたという訳です。
2つの組織についてもっと詳しく知りたい方は、以下の記事を参考にしてみてください。
【今更聞けない】HTML6は実在するの?エンジニアなら知っておきたいWeb技術の基準
HTML Living StandardにとHTML5の違いについて
HTML5もHTML Living Standardも、実は、HTML書く上でそこまで大きな違いはありません。
ただし、細かい点では新たに追加や変更されたカ所もあるので、HTML Living Standardの仕様を確認してみることをおすすめします。
- 開始タグはこれまで通り「!DOCTYPE html」
- sectionタグを併用することで、h1タグの複数使用が可能になった
- imgタグに遅延読み込みを行うloadingを追加
HTML5から登場した便利なタグも使用できる
HTML Living Standardでは、HTML5から登場した便利なタグも同じように使用することができます。
HTML5から登場した新しいタグには、以下のようなものがあります。
名称 | 意味 |
headrタグ | ヘッダー部分を表すタグ |
canvasタグ | JavaScriptなどと組み合わせることで、プラグインなしでも図の描画を行えるタグ |
timeタグ | 日付や時刻を指定できるタグ |
videoタグ | プラグインなしでビデオファイルを再生できるタグ |
HTML誕生からLiving Standardになるまでの歴史
2021年のHTML最新バージョンは、HTML Living Standardであると解説しました。
では、現在のHTML Living Standardに至るまで、HTMLはどのような歴史をたどってきたのでしょうか?
HTMLの誕生から、年代ごとに勧告された新しいバージョンを時系列で見ていきましょう。
HTML+は上位互換(同年にリリース)
HTML3.2が別物としてリリース
HTML Living StandardがHTML統一の仕様に決定
HTMLバージョンを表示するDOCTYPE宣言の現状
DOCTYPE宣言とは、このページは「HTML〇バージョンの仕様に基づいて記述しています」という宣言のことです。
HTML5よりもバージョンには、各バージョンごとにW3CがWebサイト内で管理している、DTDと呼ばれるファイルがあります。
DTDには、各バージョンで使用できる要素や属性、配置カ所の情報などが記されているので、W3Cが把握できるようにDOCTYPE宣言が必要なのです。
HTML5以降のバージョンには、このDTDがないため、HTML5以降のHTMLには、DOCTYPE宣言が不要ということになります。
しかし、ブラウザの表示モードの切り替えにもDOCTYPE宣言を使用しているので、必要最低限のDOCTYPE宣言はつけなければなりません。
DOCTYPE宣言をつけない場合、「標準モード」ではなく「互換モード」というモードで表示されることになり、レイアウト崩れとなる可能性があります。
HTML5以降のDOCTYPE宣言は、以下のように記述しましょう。
<!DOCTYPE html>
DOCTYPE宣言の記述場所は、HTMLコードの一番上です。
おまけ:以前のDOCTYPE宣言の方法
HTML5以前に使われていたDOCTYPE宣言の記述方法を紹介します。
現在は、HTML5以降、なおかつバージョンが統一されたHTML Living Standardが最新なので、使用する機会は少ないかもしれません。
昔のホームページなどを修正する場合などに登場する可能性があるので、念のため確認しておきましょう。
HTML5以前のバージョンで使われていたDOCTYPE宣言は、以下の3種類があります。
- Strict
- Frameset
- Transitional
同じバージョンの中に3種類のDTDがあることから、それぞれのDTD別にDOCTYPE宣言の種類も異なります。
Strict
Strictは、DTDの中でも仕様に厳密な種類です。
W3Cが非推奨としている要素や属性、フレームワーク機能を使用することができません。
下記は、HTML4.01をDOCTYPE宣言する場合の記述方法です。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Frameset
Framesetは、最も仕様がゆるいフレーム用のDTDです。
W3Cが非推奨としている要素や属性だけでなく、フレーム機能も使用できます。
下記は、HTML4.01をDOCTYPE宣言する場合の記述方法です。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
Transitional
Transitionalは、Framesetと同じく文法がゆるいDTDですが、フレーム機能までは使用できません。
W3Cが非推奨としている要素や属性のみ使用することができます。
下記は、HTML4.01をDOCTYPE宣言する場合の記述方法です。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML Living Standardが最新!HTMLのバージョンはシンプルになった
今回は、HTMLバージョンの歴史と最新バージョンの「HTML Living Standard」について解説しました。
以下は、この記事のまとめです。
- 2019年以降のHTML最新バージョンはHTML Living Standardに統一
- HTML Living StandardはW3Cから生まれたWHATWGが策定
- バージョン管理ではなく、ブラウザ表示モード用にDOCTYPE宣言は必要
HTMLの仕様を定めている組織内の分裂などにより、これまで様々なバージョンが散在していたHTMLですが、2019年から「HTML Living Standard」に統一されました。
今までちょっと面倒だったDOCTYPE宣言もシンプルになり、HTMLコードを効率的に書くことができるようになっています。
これからも、より便利にシンプルに進化し続ける「HTML Living Standard」の最新情報を常にチェックして、正しいHTMLコードを記述していきましょう!