• ベストアンサー

DOCTYPE宣言は厳密に気にするべきか??

現在WEBを独学で学んでおります。 そこでDOCTYPE宣言についていくつか疑問に思いました。 ひとつでもわかる方はご回答頂ければ幸いです。 1.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> と、ソースの頭に記述しておいて <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> の内容で記述(XHTML 1.0 Transitionalで記述)することは可能ですか?? つまり、HTML 4.01 Transitionalを宣言して終了タグなど、XHTML 1.0 Transitionalの方式で書いても正確に表示されるかを知りたく思って おります。 2.DOCTYPE宣言を書いてないサイトが多く見受けられますが、 この場合はどのようにDOCTYPE宣言と捉えられるのでしょうか? また、この場合のデメリットとかはありますでしょうか?? 以上、わかる方いましたらよろしくお願いいたします。

  • HTML
  • 回答数6
  • ありがとう数5

質問者が選んだベストアンサー

  • ベストアンサー
回答No.5

2.について 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宣言については以上の様な感じです。ただ、この説明は私の意訳や勝手読みも大いに含まれますw ご勉強されているとのことですので、事実関係を一度ご確認してみるのもよいかもしれません。 以下は、W3C勧告のhtml4.01及びxhtml1.0の仕様書邦訳です。ただし、素人にはお薦め出来ませんw理解の前に挫折します。私もその口ですw http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.html http://msugai.fc2web.com/web/W3C/xhtml1SE/Cover.html

eefedor
質問者

補足

回答ありがとうございます。 なるほど~大変ご丁寧に説明して頂きありがとうございます! 標準モードと互換モードはつい最近知ったのですが、 推奨タグと非推奨タグの表示・非表示の違いかと解釈して いたのですが、マージン・パディング・ボーダーあたりの規則 も変わるのですね。 私はIEしか使っていなかったのでURLの表は大変参考になります。 しかし、DOCTYPE宣言ひとつとっても色々と難しいですね、、、 私はHTML+CSSでWEBサイトを作ろうと思っているのですが、 その場合はHTML4.01 Strictの方がよいですかね?? 連投すいません、、、 面接用にと思い試行錯誤しております。汗w どうもありがとうございました。

その他の回答 (5)

  • MAN_MA_RUI
  • ベストアンサー率41% (426/1024)
回答No.6

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

eefedor
質問者

お礼

回答ありがとうございます。 なるほどそのタグは初めて見ましたがご進言通り気をつけたい と思います。 どうもありがとうございました。

回答No.4

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

eefedor
質問者

補足

回答ありがとうございます。 なるほど、後々XHTMLに変える場合を想定してhtml4.01で宣言して xhtml方式で書こうと思いましたがやめたほうがいいですよね?? 割とHTML+CSSにしておけば移行はそんなに難しくないと聞きましたし、、、 どうもありがとうございました。

  • MAN_MA_RUI
  • ベストアンサー率41% (426/1024)
回答No.3

こういう空要素の記述を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/

eefedor
質問者

お礼

回答ありがとうございます。 空要素の記述はよいのですね、安心しました。 imgもスペースとスラッシュが必要でしたね。 どうもありがとうございました。

回答No.2

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

eefedor
質問者

お礼

回答ありがとうございます。 なるほど書いてないとHTML3.2かSGMLととらえられるのですね。 CSS2で表示したけらばDOCTYPE宣言をしないといけない ようですね。 どうもありがとうございました。

  • kazumero
  • ベストアンサー率40% (20/49)
回答No.1

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

eefedor
質問者

お礼

回答ありがとうございます。 どうもありがとうございました。

関連するQ&A

  • html 「DOCTYPE記述」について

    こんにちは。 タイトルの件ですが html4.01 Transitionalで宣言する場合、 <1> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> のように記述しますね。 上記に「http://www.w3.org/TR/html4/loose.dtd」を付け加えて <2> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">とも書きますね。 <1>と<2>差異は何でしょうか? <1>はスタンダードモード、<2>は互換モードであるとは理解していますが、そうだとすれば、<2>はStrictで宣言した場合と同じ結果になるのでしょうか? 詳しい方、教えていただけますか。 どうぞ宜しくお願いします。

    • ベストアンサー
    • HTML
  • DOCTYPE は何で宣言すればいいのか

    DOCTYPE は何で宣言すればいいのかどうやって決めればいいですか? とりあえずネットからコピペしてきた <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> で、宣言してるのですが、果たしてこれがどういう意味かさっぱり分かりません。 とりあえず問題なくブラウザで閲覧できればいいのでしょうか?

    • ベストアンサー
    • HTML
  • DOCTYPE宣言とdocument.body.clientHeight

    お世話になります。 ブラウザのサイズを取得するにはどうすればよいのでしょうか? document.body.clientHeightで取得出来るのは分かりましたが DTDにより動作したり、しなくなるのも分かりました。 ×動作しない <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ○動作する <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 後者のものですとIEでは動作しますが、firefoxでは動作しません。 何か対処法は、御座いませんでしょうか? 一番望む形は <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> の宣言で、ブラウザサイズが取れるようになるのがベストです。 CSSを使用しているので<?xml version="1.0" encoding="UTF-8"?>を入れると 表示モードが互換になるので・・・。 対応したいブラウザはIE6.0、firefox,Safariです。 一応ソース <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script> function init(){ var bodyHeight = document.body.clientHeight; alert(bodyHeight); } </script> </head> <body onload="init();"> <div> ほげ </div> </body> </html>

  • DOCTYPE宣言のURLって何?

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> このDOCTYPE宣言ですが "http://www.w3.org/TR/html4/loose.dtd" が入っているのと入ってないのとで、若干表示に違いが出てくることがあります。今やろうとしていること(長くなるので省略)は、このURLを入れないほうが思った結果になるのですが、なんとなく漠然と「より厳密にHTMLの仕様を定義づける記述」だと思ってたので安易に削除してしまって良いものか躊躇しています。 べつに省略してもたいして問題ないとは思うんですが、そもそもこのURLって何なのですか?細かく取り決めみたいなのが書いてありますが、これを宣言に加えるか加えないかで表示に違いが出るということは、前半の !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" のさらに細密な定義ということなのでしょうか。そうだとしたら別の定義のURLもあるのですか? 詳しいことをご存知の方がおられましたら教えてください。 ※環境はXPpro SP2、エディターはHTMLproject2、ブラウザはIE6、FF1.5です。まあ見られる方の環境は様々なのでウチのを言っても詮無いことですが一応。

    • ベストアンサー
    • HTML
  • DOCTYPE宣言について

    自分はXHTML1.0を参考通り <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> このように二列で入力しているのですが、一列で入力しても大丈夫なのでしょうか?また、オススメの宣言タイプ?があったら教えてください。お願いします。

  • DOCTYPE 宣言

    最初のHTMLの宣言の各部分の意味を教えてください。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 最初のDOCTYPEはタグだということはわかるのですが それ以外、例えばPUBLICや『-』や『//』DTD,EN、最後のURLなどの意味がわからないです。

    • ベストアンサー
    • HTML
  • <ruby>を使う時のDOCTYPE宣言は?

    HPのことで質問です。 <ruby>タグを使ったホームページをAnother HTML-lint gatewayにかけたところ、「他のHTML用」だと言われてしまいました。どうやらDOCTYPE宣言が原因のようです。そのページは<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> で作成しました。<ruby>タグを使えるDOCTYPE宣言は何になるでしょうか?

    • ベストアンサー
    • HTML
  • DOCTYPE宣言を変更するとjavaが機能しない

    ミスティーネットさんの「JavaScript 活用編 ポップアップメニューの表示」 の サンプルを使ってみたのですが、 http://java.misty.ne.jp/popup_menu.html DOCTYPE宣言を <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> に変更すると、ポップアップが固定となり、同じところにしか表示されなくなります。 該当ページのサンプルは、XHTMLでは機能しないのでしょうか。 それとも、javascriptの記述をどこか変更すれば動くようになるのでしょうか。 詳しい方がおられましたら教えていただきたいのですが、よろしくお願いいたします。

  • DOCTYPE宣言をするとstyleが適用できない

    webサイト作りの初心者です。 初め、ドキュメントタイプ(DOCTYPE)の宣言を書かずに<html>タグからコードを書いていたのですが、 全体がある程度形になってから、1番上に <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> を追加し、<html>を <html xmlns="http://www.w3.org/1999/xhtml"> に変えると、デザインが変わってしまいました。 具体的には、 <div style="height:960;">~</div> と書いて作っていたブロックの高さが、 DOCTYPE宣言を書く前はちゃんと960になっていたのですが、 書いた後は、中に入っているコンテンツ(テキスト)の高さまで縮み、style部分の数字をいくらいじっても変わってくれません。 他にも、style属性のmargin-leftなどが適用されなくなっていました。 なぜ、DOCTYPEの宣言をするとstyleが適用されなくなったのでしょうか? また、どうすれば適用されるようになるのでしょうか? よろしくお願いします。

    • ベストアンサー
    • HTML
  • XHTML宣言についてですが自分のものでどこがおかしいのか解りません。

    XHTML宣言についてですが、 私はライブドアブログでブログを作っています。 ブログのチェッカーで引っかかりました。 現在の宣言内容です。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> XHTML1.0 では XML宣言をすることが強く求められています。 と指摘されましたがどうしたらいいかわかりません

専門家に質問してみよう