ＤＯＣＴＹＰＥ宣言は厳密に気にするべきか？？

Question

現在ＷＥＢを独学で学んでおります。そこでＤＯＣＴＹＰＥ宣言についていくつか疑問に思いました。ひとつでもわかる方はご回答頂ければ幸いです。１．と、ソースの頭に記述しておいての内容で記述(XHTML 1.0 Transitionalで記述)することは可能ですか？？つまり、HTML 4.01 Transitionalを宣言して終了タグなど、XHTML 1.0 Transitionalの方式で書いても正確に表示されるかを知りたく思っております。２．ＤＯＣＴＹＰＥ宣言を書いてないサイトが多く見受けられますが、この場合はどのようにＤＯＣＴＹＰＥ宣言と捉えられるのでしょうか？また、この場合のデメリットとかはありますでしょうか？？以上、わかる方いましたらよろしくお願いいたします。

rainbowsix · Accepted Answer

２．について
htmlのレンダリングには大きく分けて「標準モード」と「互換モード」というものが存在します。これら、モードの違いによって、レンダリングの法則が大きく変わります。特に、マージン・パディング・ボーダーあたりの規則が大きく変わるため、標準モードと互換モードではレイアウトが大きく崩れる原因となります。

以下のリンクを参照して欲しいのですが、
http://hxxk.jp/2006/12/19/2100
上記ページの「検証用リソースと検証結果」の部分をご覧ください。一覧につけられたリンクは、そのDOCTYPE宣言ならどんなレンダリングに結果なるかをあらわしています。もしIEをお使いなら、リスト最上段の「なし」と、リスト4段目（html4.01のloose）とを比較してみてください。これらはDOCTYPE宣言以外、htmlのソースも適用しているCSSも全く同一のものです。しかしモードが違うためレンダリング規則が変わってしまっています。

DOCTYPE宣言とは、Webにおける共通ルールの宣言なのです。「食いタン、メンゼンピンフの有り無し」を一番最初に宣言してるわけです。この宣言が無ければ、各ブラウザが「俺ルール（＝互換モード）」に則ってレンダリングをするわけです。みんながIEを使っていた時代は、「俺ルール=みんなのルール」だったのでレンダリングの違いを気にすることもなく、DOCTYPE宣言がなくてもあまり困りませんでした。しかし現在、Firefoxを筆頭にOpera、Safari、Slapenir、Lunascapeに、さらにIEでもMacIEにIE7に・・・といった具合に群雄割拠の様相を呈しています。DOCTYPE宣言はルール統一のための必須条件と考えてよいのではないでしょうか。

Eefedorさんが質問を書き込みした際、書かれたDOCTYPE宣言の一部がリンクになってますよね？そちらをクリックしてみてください。なにやらプログラムチックなものが表示されましたよね。コレがいわゆる「xhtml（transitional）のルールブック」なのです。各ブラウザはこのルールブックに則ったレンダリングをしようと頑張るわけです。このルールブックに則っていれば各ブラウザごとに見た目が変わることなんて無いはずなんです。無いはずなんですが…ブラウザの世界にも出来る子と出来ない子がいる訳でして。IEご兄弟にはもうちょっと頑張って欲しいものです。

DOCTYPE宣言については以上の様な感じです。ただ、この説明は私の意訳や勝手読みも大いに含まれますｗ
ご勉強されているとのことですので、事実関係を一度ご確認してみるのもよいかもしれません。
以下は、W3C勧告のhtml4.01及びxhtml1.0の仕様書邦訳です。ただし、素人にはお薦め出来ませんｗ理解の前に挫折します。私もその口ですｗ
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.html
http://msugai.fc2web.com/web/W3C/xhtml1SE/Cover.html

MAN_MA_RUI · Answer

> XHTMLでしか使えない要素（ruby要素など）やCSSのプロパティを使ってはいけません。
考えてみるとこの表現はおかしい気がするぞ？XHTMLでしか使えないって言うかXHTMLにしたとき解釈が変わるものに気をつけろとかそういう問題になるはず。
例えば標準準拠モードにするとIEのoverflow-xやoverflow-yの解釈が変化します。

rainbowsix · Answer

1.について記述することは可能です。ただ、ブラウザ側はDOCTYPE宣言のあった仕様に則ってレンダリングをします。したがってたとえxhtml方式で書こうが、それをブラウザはhtml4.01として解釈します。しかし、たいていのブラウザでは、それらの記述法の違い(
の/とか)を誤字のように解釈し、「うん、惜しいね。ホントはそうじゃないんだけど…今回は先生、大目にみてあげるよ☆」といった具合に、ブラウザが独自に修正してくれます（多分）。この辺は、ブラウザによって対応状況は違うと思います。 ※確か、IE6先生はCSSでmargin:200;とか書いても「あぁ、コレは200pxって書きたかったんだろうな」って勝手読みしてくれたはずです。しかしコレは、必ずしも正しい先生のあり方ではないかもしれません。間違いを間違いとして指摘することも、教師としての務めだとおもいます。Firefox先生などは完全に無視します。結構厳しい先生ですｗ２．については、すみません、書いてるうちについつい乗ってきちゃったので、分けて書きますｗ

MAN_MA_RUI · Answer

こういう空要素の記述をXHTMLの方式で書くのは問題ありませんが、XHTMLでしか使えない要素（ruby要素など）やCSSのプロパティを使ってはいけません。
<img src="hoge.png" alt="hoge" />

文法チェックなどを使うといいんじゃないでしょうか？
http://openlab.ring.gr.jp/k16/htmllint/
http://validator.w3.org/
http://jigsaw.w3.org/css-validator/

taloo · Answer

> ２．ＤＯＣＴＹＰＥ宣言を書いてないサイトが多く見受けられますが、
> この場合はどのようにＤＯＣＴＹＰＥ宣言と捉えられるのでしょうか？
DOCTYPE宣言なし、と捉えられます。
最近のブラウザは概ねHTML3.2かSGML（HTMLの元となる言語）とみなしているようです。

> また、この場合のデメリットとかはありますでしょうか？？
DOCTYPEを書かずにXHTMLを使うことは出来ません。
HTMLだけで考えるのであれば、文法に則っていてDOCTYPEがない、というだけであれば特別大きなデメリットはありません。
文法に則っていなければDOCTYPEがあろうがなかろうが表示に乱れが出るのは変わりありません。

スタイルシートを使う場合、現在使われているCSS2の定義やそれに基づく解説・サンプル公開サイトと、
実際のブラウザでの表示に違いが発生することがあります。
（DOCTYPEなしでは、CSS1に近い表示になるようです。）

kazumero · Answer

1. 表示されるにはされますがですが、一部文法的には誤りになりますね。
また、逆の場合は表示されないこともあります。

2. 各ブラウザごとの仕様で表示されます。

ＤＯＣＴＹＰＥ宣言は厳密に気にするべきか？？

２．について

この回答への補足

> XHTMLでしか使えない要素（ruby要素など）やCSSのプロパティを使ってはいけません。

1.について

この回答への補足

こういう空要素の記述をXHTMLの方式で書くのは問題ありませんが、XHTMLでしか使えない要素（ruby要素など）やCSSのプロパティを使ってはいけません。

> ２．ＤＯＣＴＹＰＥ宣言を書いてないサイトが多く見受けられますが、

1. 表示されるにはされますがですが、一部文法的には誤りになりますね。

似たような質問が見つかりました

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング