1. ホーム
  2. Web制作
  3. HTML/Xhtml

DOCTYPE HTMLを使用する理由

2022-01-29 02:13:15
これがないと、ブラウザは風変わりなモードでページを表示します。風変わりなモードでは、個々のブラウザが個々の要素を異なる方法で表示することはご存じでしょう。そこで、次のようなdoctypeを記述することになる。
コピーコード
コードは以下の通りです。

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

最近はあらゆるWeb開発ツールがテンプレートコードの挿入をサポートするほど強力なので、この長くて臭いdoctypeを一文字一文字打ち込む必要はないのが良いところです。でも、もういいやという方は、以下の書き出しを試してみてはいかがでしょうか。
コピーコード
コードは以下の通りです。

<!DOCTYPE html>

わあ、きれいだ!」。1つは、doctypeを間違える心配なく簡単に書けること、2つは、およそ105バイトの文字数を節約できたこと、これは1日のPVが数千万に及ぶサイトにとって、かなりの客観的トラフィックを節約できること、3つは、後方互換性、そう、html5のdoctypeはこのように書かれていて、モダンブラウザはそれを認識していること、などなど、メリットは明らかです。

私のように、ずっとこう思っていた人は dtdを指定しないと、ブラウザの変なモードがオンになる その発言は間違っています。 正しくは、doctypeを定義しないと変なモードが有効になる、つまり、ある種のdtdを指定しなくても、<!doctype html>を定義するだけでブラウザがストリクトモード(標準モード)でページをレンダリングするようになる、ということです。ここで、すべてのブラウザは、変なモードとストリクトモード(一部では標準モードとも呼ばれる)の2つのモードを必要としていることを思い出してみましょう。Windows/Mac版のIE 6、Mozilla、Safari、Operaはいずれも両方のモードを実装していますが、IE 6以下のバージョンでは、常にweird modeに設定されています。ここでは、この2つのモードについて説明します。

<ブロッククオート
  1. 標準化以前に書かれたページにはdoctypeがないため、doctypeのないページは変なモードでレンダリングされます。
  2. 逆に、ウェブ開発者が自分が何をしているかを知っていることを意味するdoctypeを追加すれば、ほとんどのdoctypeはstrictモード(標準モード)をオンにし、ページは標準にしたがってレンダリングされるようになります。
  3. 新しい、あるいは未知のdoctypeは、ストリクトモード(標準モード)がオンになっています。
  4. 変なモードを有効にする方法は、各ブラウザで異なります。このリストを見てみてください。 http://hsivonen.iki.fi/doctype/

注:選択したdoctypeに基づいてページを検証する必要は全くなく、doctypeタグが存在するだけでstrictモード(標準モード)をオンにするのに十分なのです。もし、まだ私の言っていることに懐疑的であれば、次のサイトへどうぞ。 http://www.quirksmode.org/css/quirksmode.html#link2 をご覧になってみてください。必要なのは、その答えを得るための小さなJavaScriptのコードだけで、それは

コピーコード
コードは以下の通りです。

mode=document.compatMode;

このコードは、現在のブラウザがquirkyモードか標準モードかを判断するために使用できます。この属性の互換性は疑う余地もなく、もし疑うのであれば http://www.quirksmode.org/dom/w3c_html.html#t11 . でテストしたいブラウザでアクセスすることができます。 http://wanz.im/demo/doctype-test.html 私の知る限りでは、ie6でも変なモードは発動しません。何か新しい発見がありましたら、お気軽にコメントを残してください。