目的
HTMLの骨組みについて、その役割や意味・背景などの基礎知識を理解すること。
基本構造
※VSCode（コードエディタ）であれば、!キー＋Enterキー押下で下記の最低限の骨組みが
補完されます。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
１行目の<!DOCTYPE html>から順に確認してきます。
１行目：DOCTYPE宣言
DOCTYPEとは
HTML文書の先頭に記述する文書型宣言のことです。
これを記述することで、ブラウザに対し、このHTMLファイルが古いHTML文書でないことを
示します。小文字で記載しても問題なく動作します。
古いHTML文書とは
古いHTML（バージョン4.01以前）はSGML（HTMLの元にである言語）が利用されており、
以下のように文書の先頭でDTD（文書のルール）を参照する記述が必要でした。
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
HTML5以降はSGMLを利用していないため、上記宣言は不要となりました。
しかし、ブラウザは互換性モードかどうかをこの宣言内容により判定しています。
文書型宣言の記述がないと互換性モードと解釈されますが、これを避けるために
DOCTYPE宣言が必要となりました。
ブラウザの解釈モード（レンダリングモード）について
以下の３種類があります。
現在ほとんどのブラウザが③完全標準準拠モードの利用を推奨しています。
① 後方互換 (Quirks) モード
古いHTMLを正しく表示するモード。現在の標準的なHTML・CSSルールを無視して、
古いブラウザの挙動を再現する。
② 準標準 (Almost Standards) モード
基本的には標準ルールで表示するが、古いブラウザとの互換性のため
一部例外があるモード。
③ 完全標準準拠 (Full Standards) モード ◀推奨
最新の標準的なHTML・CSSの仕様通りに解釈・動作するモード。
※ブラウザの表示方法（レンダリングモード）では、以下のような内容が
切り替えられます。
・レイアウトの計算方法（ボックスモデル・table・imgのサイズの計算方法）
・適用するCSSルール（最新仕様または古いブラウザ向けのルールか）
・ブラウザ互換性の確保（古いWebページ表示のために昔のブラウザの挙動を再現）
参考