はじめに
<!DOCTYPE html> は、HTML ドキュメントの最初に記述される宣言であり、Web ブラウザに対して HTML のバージョンを明示する役割を持ちます。
個人の備忘録程度の走り書きとなっておりますが、温かい目で見守っていただければ幸いです。
本記事では、その役割や歴史について詳しく解説します。
書こうと思ったきっかけ
Web 開発において、<!DOCTYPE html> の記述は基本的なものですが、その重要性を意識していない方も多いかもしれません。
特に、HTML5 では DOCTYPE の記述が簡素化されたため、なぜ必要なのか疑問に思うこともあるでしょう。
本記事では、その意義を改めて整理し、理解を深めることを目的としています。
<!DOCTYPE html> の役割
-
HTML のバージョンを指定する
-
<!DOCTYPE html>は HTML5 の文書型宣言であり、HTML5 に準拠していることをブラウザに伝えます。 - 以前の HTML4 や XHTML では異なる
DOCTYPE宣言が必要でしたが、HTML5 では<!DOCTYPE html>だけで済みます。
-
-
標準モードの適用
-
DOCTYPE宣言が適切に記述されていない場合、ブラウザは「互換モード」や「クイークスモード（Quirks Mode）」でレンダリングすることがあります。 -
<!DOCTYPE html>を記述することで、「標準モード（Standards Mode）」が適用され、HTML5 の仕様に準拠した適切な描画が行われます。
-
以前の HTML における DOCTYPE 宣言との違い
HTML 4.01 の DOCTYPE 例
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
このように、HTML4 では DOCTYPE 宣言が長く、DTD（Document Type Definition）を指定する必要がありました。
XHTML 1.0 の DOCTYPE 例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML では XML のルールに基づき、より厳密な文法が求められていました。
HTML5 でのシンプルな DOCTYPE
HTML5 では、よりシンプルな形で宣言できるようになりました。
<!DOCTYPE html>
このシンプルな宣言によって、ブラウザは自動的に HTML5 の標準モードでレンダリングを行います。
まとめ
-
<!DOCTYPE html>は HTML5 の標準的な宣言方法であり、ブラウザに HTML5 を適用するために必要です。 - 以前の HTML4 や XHTML では複雑な DOCTYPE 宣言が必要だったが、HTML5 では簡潔になった。
- DOCTYPE を適切に指定することで、ブラウザの標準モードを適用し、正しい表示が保証される。
Web ページを作成する際は、必ず <!DOCTYPE html> を記述し、正しくレンダリングされるようにしてみてください！