HTMLのDOCTYPE宣言とは?基本の書き方と各バージョンの宣言方法を解説
HTML文書を作成する際、必ず最初に記述するのがDOCTYPE宣言です。
DOCTYPEは、そのページがどのバージョンのHTMLで書かれているかをWebブラウザに伝える重要な役割を担っています。なお、大文字・小文字は区別されないため、どちらで記述しても問題ありません。
それでは、DOCTYPEを文書の先頭に記述した具体例を見ていきましょう。
記述例
<!DOCTYPE html> <html> <head> <title>ここにドキュメントのタイトルが入ります</title> </head> <body> <h1> デモ用の見出し </h1> これはデモ用のテキストです。 </body> </html>
表示結果

続いて、代表的なDOCTYPE宣言の種類を確認していきましょう。
HTML5のDOCTYPE宣言
現在主流となっているHTML5では、宣言が非常にシンプルになりました。バージョン番号やURLを含む長い文字列は不要で、以下の1行だけで済みます。
<!DOCTYPE html>
HTML 4.01 Strict(厳密型)
Strict DTDは、非推奨(廃止予定)とされた要素や属性、フレームセット関連の要素を除く、すべてのHTML要素を含む文書型です。構造と見た目を厳密に分離する考え方に基づいており、CSSによるスタイル指定が前提となります。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional(移行型)
Transitional DTDは、非推奨とされた要素や属性も含むすべてのHTML要素を利用できる文書型です。古いブラウザへの互換性を保ちながら段階的に移行したい場合に使用されてきました。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd">;
まとめ
DOCTYPE宣言を正しく記述しない場合、ブラウザが「後方互換モード(クワークスモード)」で動作し、意図した通りにページが表示されないことがあります。現在のWeb制作では、シンプルな<!DOCTYPE html>を文書の先頭に記述するのが標準的な手法です。新しいプロジェクトでは、HTML5形式の宣言を使用することをおすすめします。
-
HTMLレイアウト入門:セマンティック要素と主要なレイアウト手法を徹底解説
HTMLレイアウトとは HTMLレイアウトとは、Webページ上に配置される各コンポーネント(ヘッダー、ナビゲーション、本文、フッターなど)の配置構造を定義する仕組みのことです。HTMLには、ページ内のさまざまなセクションを意味的に示すためのセマンティック要素が数多く用意されており、これらを活用することで、検索エンジンやスクリーンリーダーにも伝わりやすい、アクセシブルなページ構造を作れます。 HTMLレイアウトで使用される主なセマンティック要素 以下は、HTMLレイアウトでよく使われるセマンティック要素の一覧です。 タグ説明 <header>セクションまたはドキュメント全体
-
HTMLエディターとは?代表的な無料エディターの特徴を徹底解説
HTMLエディターとはHTMLエディターとは、HTMLドキュメントの作成・編集を行い、場合によってはその場で実行までできるツールのことです。現在では、無料・有料を問わず、プロフェッショナル向けの高機能なHTMLエディターが数多く提供されています。Windows標準のメモ帳(Notepad)にはない、テーマのカスタマイズやターミナル連携といった付加機能を備えたエディターも多く、用途やスキルレベルに合わせて選ぶことができます。ここでは、特によく使われている代表的なHTMLエディターをご紹介します。Notepad(メモ帳)最も基本的な無料HTMLエディターの一つです。Windowsに標準搭載されてお