DTD宣言とは【HTML初心者向けに解説】

DTD宣言とは【HTML初心者向けに解説】

「DTD宣言とはなに?」
「なぜDTD宣言が必要なのか?」
「DTD宣言の記述方法が知りたい」

この記事を読んでいるということは、上記のようなお悩みがあるのではないでしょうか?

DTD宣言は、HTMLの一番初めに記述されている文書ですが、なんとなくコピペで使っている方も多いのではないでしょうか?

DTD宣言を行い正しいタグで記述することはSEO対策にも繋がりますので、本記事でDTD宣言について詳しく学びましょう!

DTD宣言とは

DTD宣言とは

DTD宣言とは、HTMLを記載する際にどのバージョンで記述するかをHTMLファイルの冒頭で宣言することです。

HTMLには下記のようなバージョンがあり、それぞれルールに従ってDTD宣言をする必要があります。

HTML4.01 1999年に勧告されたHTML
XHTML1.0 2000年に勧告されたHTML
HTML5 2014年に勧告された現在の最新バージョン

HTMLのバージョンごとに使用できる要素(タグ)や属性の名前などの情報が定義されており、ルールに従ってDTD宣言を行うことでレイアウトが崩れるリスクを減らすことができます。

HTMLは非営利団体「W3C」が管理をしている

HTMLは非営利団体「W3C」が管理をしています。

「W3C」とは、1994年に設立された非営利団体で、WEB技術の標準化を目的としています。

HTMLの他にもXHTML、CSS、DOM(Document Object Model)やXML(Extensible Markup Language)など多くの仕様が公開されています。

HTML5以降のDTD宣言

HTML5以降のDTD宣言

仕様が「HTML5」以降のバージョン場合のDTD宣言は下記の通りです。

DTD宣言には、ブラウザ表示モードを切り替える機能もあります。

ブラウザ表示モードには、「完全標準準拠モード」「互換モード」の2種類があり、HTML5以降でDTD宣言を行うと「完全標準準拠モード」にてブラウザの表示が可能となります。

2つの表示モードの違いは下記の通りです。

完全標準準拠モード

完全標準準拠モードは新しい仕様に準拠している表示モードです。

仕様書通りに動作します。

完全標準準拠モードは、HTMLにおいて、新しい仕様に準拠しているため異なるブラウザでもレイアウトが統一されることが多くなるモードです。

互換モード

互換モードとは、古いブラウザと互換をする表示モードです。

言語の解釈が正しくされず、レイアウトが崩れる可能性があります。

HTML5以前のDTD宣言

HTML5以前のDTD宣言

HTMLのバージョンがHTML5以前の場合のdtd宣言を紹介します。

現在、HTML5が主流となっているため、昔に作られたホームページの編集をする際に必要となるので理解しておきましょう。

HTML5以前のHTMLには、Strict(厳密)、Transitional(緩め)、Frameset(フレーム設定可能)の3つの種類があり、それぞれDTD宣言の記述が異なります。

Strict(厳密)

Strictは、ルールに厳格なDTDです。

非推奨とされている要素・属性については使用できず、フレーム(1ページに2つ以上のページを同時表示するタグ)も使用することができません。

記載するDTD宣言は下記の通りです。

HTML4.01

XHTML1.0

Transitional(緩め)

Transitionalは、Strictよりも緩やかな指定のDTDです。

非推奨とされている要素・属性が利用できますが、フレームに関しては使用することができません。

記載するDTD宣言は下記の通りです。

HTML4.01

XHTML1.0

Frameset(フレーム設定可能)

Framesetは、非推奨とされている要素・属性の仕様に加え、フレームも使用できるDTDです。

記載するDTD宣言は下記の通りです。

HTML4.01

XHTML1.0

HTMLでのホームページ制作に苦戦している方は、HTMLのテンプレートを使うのも有効です。

詳しくは、下記記事を参考にして下さい。

関連記事:ホームページテンプレートサイト11選【HPテンプレートの全てが分かります】

まとめ

「DTD宣言とは」について紹介しました。

今回のポイントは下記の通りです。

  • DTD宣言とは、どのHTMLのバージョンで記述するかを冒頭で宣言すること
  • HTMLにはバージョンがあり、使える要素が異なる
  • HTMLは非営利団体「W3C」が管理をしている
  • ブラウザ表示モードは「完全標準準拠モード」と「互換モード」の2種類に分かれる
  • HTML5以前のHTMLには、Strict、Transitional、Framesetの3つの種類がある

今回紹介したポイントを抑えて、HTMLのバージョンを理解し、正しいDTD宣言を行いましょう。

HTML使ったホームページ制作でお悩みの方は、是非弊社まで一度ご相談下さい。

弊社では、コンセプト設計も兼ねた0からのホームページ制作が可能となっています!

アドトラへの無料相談はこちら!