カテゴリー

キーワード

 
> HTMLのDOCTYPE宣言って何なの...

HTMLのDOCTYPE宣言って何なの?使い方は?書き方は?


2015 年 2 月 4 日 投稿    view: 46261
タグ:
このエントリーをはてなブックマークに追加

DOCTYPE宣言の画像

本日より株式会社SceneLiveのブログを始めます。

 

今日の執筆者はWEBマーケティング部の杉尾成行です。

 

よろしくお願いします。

 

DOCTYPE宣言って?

DOCTYPE宣言とは「Document Type Definition」(DTD)のことで、日本語に訳すと「文書型宣言」となります。

つまり、どのバージョンのHTMLやXHTMLで作成されているかを宣言する役目を担っています。
ですので、ページの先頭に書く必要があります。

 

近年のホームページでよく使われていたHTML 4.01(Transitional)では

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

 

という書き方でした。

 

ですが、昨年(2014年)の10月29日(米国時間10月28日)にHTML5が正式に勧告されたことにより、これからはHTML5でサイトを作成することが標準となります。

そのHTML5のDOCTYPE宣言はあっさりしたもので、

 

<!DOCTYPE html>

 

でOKということになります。
ちなみに大文字と小文字は区別されません。

 

HTML5で書いたサンプル(最低限の要素しか盛り込んでいません)
<!DOCTYPE html>
<html>
<head>
<title>HTML5サンプル</title>
</head>
<body>
<p>HTML5で記述したサンプル</p>
</body>
</html>

 

DOCTYPE宣言がないとどうなるのか

DOCTYPE宣言がない場合、一般的なブラウザではレンダリングモード(表示方法を決めるブラウザの状態)が互換モードになります。 

互換モードだとブラウザがCSSを正しく読み込まない可能性があります。
そうなるとレイアウトが崩れてしまいかねません。

 

ですので、必ずDOCTYPE宣言を書くようにしましょう。

 

 

HTML 4.01とXHTML 1.0には3種類の書き方がある

先ほど、HTML 4.01(Transitional)という言葉を詳しい説明なしに出しました。

 

HTMLは同じバージョンでも、書き方の違いにより分けられています。
Transitionalとはその一種です。

 

(編集部注:HTML5の書き方は一つのみです)

 

これからはHTML5が主流となりますのでもう必要なくなりますが、説明しておきます。

 

HTMLが4.0になったとき、HTMLは文書構造のみを記述することになりました。
見た目の装飾はスタイルシート(CSS)に書き、外部ファイルとして読み込むことになりました。
(それまでは見た目の装飾もHTMLに直接記述していました)

 

それに伴って、一部の要素や属性が非推奨となりました。
HTML4.01やXHTML1.0ではその移行期に当たるものとして、3つのDOCTYPE宣言が用意されています。


1.Strict DTD

非推奨要素と非推奨属性が使用できません。フレームも使用できません。

 

HTML 4.01 Strict DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

XHTML 1.0 Strict DTD

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

2.Transitional DTD

非推奨要素と非推奨属性は使用できますが、フレームは使用できません。

 

HTML 4.01 Transitional DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0 Transitional DTD

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

3.Frameset DTD

全て使用可能です。

 

HTML 4.01 Frameset DTD
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0 Frameset DTD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

 

HTML 4.0移行の非推奨要素は下記のものになります。

applet要素、basefont要素、center要素、dir要素、font要素、isindex要素、menu要素、s要素、strike要素、u要素、iframe要素

 

まとめ

HTML 4.01とXHTML 1.0に存在する3つの書き方については、まだそれを使ったサイトが多数存在しているので知っておくべきではありますが、HTML5が正式勧告された今、現実に自分で使うかどうかは微妙なところです。

 

もし必要であれば、再度このページをご覧ください。(笑)


これからSceneLiveブログをよろしくお願いします。

 

 

 

 

 

杉尾成行 顔写真

この記事を書いた人

杉尾成行

株式会社SceneLive Webマーケティング部長

ウェブマーケティングコンサルタントとして、クライアントのウェブ集客をサポートしている。
また、ウェブ制作、システム制作にも携わり、数々のサイトを手掛けている。
当ホームページ、ブログシステムも制作。

前職:ライター、小説家

ウェブマーケティングコンサルタントとしてのブログ
ウェブ参謀

個人ブログ(オリジナル小説他) ⇒ 35deFA

 


カテゴリー

タグ
この記事が気に入りましたら、是非、他の方にもシェアしてください。
このエントリーをはてなブックマークに追加
関連記事