インターネットでほとんどの情報を見つけたので、すぐに予約します。ソースへのリンクは記事の下部にあります。 情報の一部は、Google翻訳と一緒に翻訳されました。
だから:
DOCTYPEがなぜそんなに重要なのですか?
あなたはすべてを正しく行ったようですが、何らかの理由で、ブラウザの最新バージョンでサイトが見られないか、期待どおりに動作しません。
正しい標準XHTMLコードと標準CSSを作成しました。 DOM(ドキュメントオブジェクトモデル)を操作するための標準仕様を使用して、ページ上の動的要素を制御しました。 それでも、これらの標準に正確に準拠して作られていると思われるブラウザでは、サイトは機能しません。 ほとんどの場合、エラーは間違ったDOCTYPEヘッダーにあります。
この短い記事では、動作するDOCTYPEヘッダーについて説明し、この一見混乱したタグの実用的および理論的な重要性についても説明します。
DOCTYPEとは何ですか?
HTMLおよびXHTML仕様によると、DOCTYPEタグ(「ドキュメントタイプ宣言」を意味する)は、ページで使用している(X)HTMLのバージョンをバリデーターに通知します。 このタグは、各ページの最初の行に常にある必要があります。 DOCTYPEタグは、標準に準拠したWebページの重要なコンポーネントです。これがないと、コードとCSSはバリデーター検証に合格しません。
DOCTYPEタグは、標準に準拠したブラウザー(Mozilla、IE5 / Mac、およびIE6 / Win)でページを正しく表示および操作するためにも重要です。
属性が完全なURI(完全なWebアドレス)を指定するDOCTYPEタグは、特定の標準またはこの標準の亜種に従ってページを表示する必要があることをブラウザに伝えます。
不完全なDOCTYPEタグを使用したり、外観が古くなったり、それを忘れたりすると、ブラウザは「ミステリアス」(奇妙な)モードに移行し、エラーが発生してページコードを記述し、標準から自由に離れたという前提から進みます。 。 90年代後半に書いたように。
このモードでは、ブラウザーは下位互換性と表示の規則に従ってページを解析しようとします。たとえば、Internet Explorerバージョン4が表示するCSSはこのブラウザーで機能した方法で動作します(IEは古いDOM、およびMozillaとNetscape 6が一般的に神に切り替わることを知っています)。
あなたにとってこれらのトリックが望ましくないことは明らかです。 しかし、これは、不完全または誤ったDOCTYPEタグを使用した場合に得られるものです。
問題
NN4が作成されたとき、IE4は標準に準拠したCSSルールに従いませんでした。 Netscapeの実装はひどく、IE4は標準の実装により良くアプローチしましたが、それでも、完全には実装していませんでした。 IE 5 Windowsは多くのIE 4エラーを修正しましたが、他のCSSクラッシュは(主にウィンドウモデルで)残りました。
したがって、コンプライアンスが重要になったとき、W3Cはブラウザーメーカーを厳しい選択にしました。
W3C仕様へのアプローチは問題の解決策の1つでしたが、ブラウザーの製造元がCSSの実装を単に標準に完全に準拠するように変更した場合、多くのWebサイトが多かれ少なかれクロールするか、完全に動作しなくなります。 標準に準拠したこのような収束には、問題が伴います。 一方、標準に準拠していないと、ブラウザ戦争時代に永続的な混乱が生じる可能性があります。
解決策
したがって、この問題の解決策は
- 標準を知っているWeb開発者が使用するモードを選択できるようにします。
- 古い(互換性のある)ルールに従って古いページを表示し続けます。 (癖モード)
つまり、すべてのブラウザーは、 2つのモードで動作する必要がありました。古いルールの互換モードと、標準の厳密モードです。
IE Macは、両方のモードを使用する最初のブラウザーであり、Windows IE 6、Mozilla、Safari、Operaおよびそれに続くスーツです。
IE 5 Windows、およびNetscape 4などの古いブラウザーは、互換モードで常にブロックされます。
呼び出す表示モードを選択する決定は、「DOCTYPE」スイッチの使用中に見つかりました。 標準では、すべての(X)HTMLドキュメントには、使用する(X)HTMLドキュメントの種類を世界に伝えるDOCTYPEが必要です。
有効なDTD
DOCTYPE | 説明 |
HTML 4.01 | |
<!DOCTYPE HTML PUBLIC "-// W3C // DTD HTML 4.01 // EN" " www.w3.org/TR/html4/strict.dtd"> | 厳密なHTML構文。 |
<!DOCTYPE HTML PUBLIC "-// W3C // DTD HTML 4.01 Transitional // EN" " www.w3.org/TR/html4/loose.dtd"> | 過渡的なHTML構文。 |
<!DOCTYPE HTML PUBLIC "-// W3C // DTD HTML 4.01 Frameset // EN" " www.w3.org/TR/html4/frameset.dtd"> | HTMLドキュメントはフレームを使用します。 |
XHTML 1.0 | |
<!DOCTYPE html PUBLIC "-// W3C // DTD XHTML 1.0 Strict // EN" " www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> | 厳密なXHTML構文。 |
<!DOCTYPE html PUBLIC "-// W3C // DTD XHTML 1.0 Transitional // EN" " www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | XHTML移行構文。 |
<!DOCTYPE html PUBLIC "-// W3C // DTD XHTML 1.0 Frameset // EN" " www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> | ドキュメントはXHTMLで記述されており、フレームが含まれています。 |
XHTML 1.1 | |
<!DOCTYPE html PUBLIC "-// W3C // DTD XHTML 1.1 // EN" " www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> | XHTML 1.1開発者は、徐々にHTMLに取って代わることを提案しています。 この定義には種への分割はなく、構文は1つであり、明確な規則に従っています。 |
HTML 4.01 DTD
- HTML 4.01 Strict-プレゼンテーション(デザイン)マークアップを許可しません。CSSはこれを行うべきだと主張します。
- 暫定DTDでは、一部の非推奨の属性と要素が許可されます
- フレームを使用する場合は、frameset doctypeを使用する必要があります。
XHTML 1.0 DTD
- XHTML Strict DTD は最も厳しい既存のDTDです。廃止された(以下を参照)タグはサポートされていないため、コードを正しく記述する必要があります。
- XHTML Transitional DTDはXHTML Strict DTDと同じですが、古いタグは許可されます。 これは現時点で最も人気のある DTDです。
- XHTML Frameset DTDは、フレームをサポートする唯一のXHTML DTDです。
XHTML 1.1 DTD
これは、XHTML 1.0 Strictの厳密さを備えた新しいDTDであり、XHTMLのモジュール化で説明されているフレームワークとモジュールに基づいています(それが何であるかを探さなかった:)。
さまざまなDTDの使用に関する統計
もちろん少し古い(2004年から2008年)が、新しいものは見つかりませんでした。
www.qindex.info/Q_get.php?g_clss=forum&g_prcss=thrd&g_tmplt=&g_brd=5&g_thrd=128
サイトの50%以上が奇抜なモード、つまりIE4モードで動作していることがわかりました!
非推奨のタグと属性
アルファベット順の古いタグ
- <applet> <object>タグを使用します。
- <baseuseはCSSを使用します。
-
<blockquote>はCSSを使用します。 - <center> CSSを使用します。
- <dir>は<ul>を使用します。
-
<em> CSSを使用します。 - <font> CSSを使用します。
- <isindex>
- <listing>は<pre>またはCSSを使用します。
- <menu>は<ul>またはCSSタグに置き換えます。
- <nextid>
- <plaintext>は<pre>または<a href='view-source:http://somesite.com'>ソースコード</a>を使用します。
- <s>は<del>または<ins>を使用します。
- <strike>は<del>または<ins>を使用します。
- <u> CSSを使用します。
- <xmp>は<pre>とCSSスタイルを使用します。
非推奨のHTML / XHTMLタグ属性。 それらはすべてCSSスタイルに置き換えることができます。
- 揃える
- alink
- バックグラウンド
- bgcolor
- 色
- hspace
- リンク
- サイズ
- テキスト
- タイプ
- vlink
- vspace
HTMLとXHTMLの違い(XHTMLに指定されたルール)
- タグは、<IMG SRC = "resource / frankisboat.gif" WIDTH = "389" HEIGHT = "227" BORDER = "0" ALT = "boat">の代わりに、小文字で記述する必要があります。 :<img src = "resource / frankisboat.gif" width = "389" height = "227" border = "0" alt = "boat" />
- たとえば、段落(<p> </ p>)のようにペアでスラッシュを含むタグを使用するか、(<br />)などの自己終了タグを使用して、すべてのタグを閉じる必要があります。
- すべてのタグは、オーバーラップせずに適切にネストする必要があります
- 古いタグは使用しないでください
- すべての属性は小文字でなければなりません
- すべての属性値は、単一引用符または二重引用符で囲む必要があります。
- すべての属性は、短い形式ではなく、長い形式で使用する必要があります。disabled= XHTMLでは「disabled」、HTMLではDISABLEDです
- 構造はコンテンツから分離する必要があります。 たとえば、<p>タグはコンテンツ(段落)の一部であり、テーブルは構造の一部(書式設定)であるため、テーブルを配置することはできません。
互換性とIE8
IE8には、IE 5.5互換モード、IE 7標準モード、IE 8標準モード、およびIE 8互換モードの4つのモードがあります。
方法の選択は、DOCTYPE、メタ要素、HTTPヘッダー、Microsoftから定期的にダウンロードされるデータ(!)、イントラネット、ユーザーが行った設定、管理者が行った設定、Microsoftブラックリストでのサイトの可用性など、さまざまなソースからのデータに依存します!
スキーム(それは壊れます)IE8ブラウザーが動作するモードを決定します
http://hsivonen.iki.fi/doctype/ie8-mode.pdf
情報源
http://hsivonen.iki.fi/doctype/-動作モードを選択するための詳細な表(すべてのブラウザー)
http://en.wikipedia.org/wiki/Doctype
http://www.htmlbook.ru/html/!doctype.html
http://www.webmascon.com/topics/coding/25a.asp
http://www.quirksmode.org/css/quirksmode.html-Quirksモードとは
http://www.quirksmode.org/css/box.html-モデルボックスの修正
最後のマッチテーブルhttp://hsivonen.iki.fi/doctype/
http://htmlfixit.com/tutes/tutorial_XHTML_and_HTML_-_The_differences.shtml HTMLとXHTMLの違い
http://htmlfixit.com/tutes/tutorial_XHTML_and_HTML_Validation__Deprecated_tags_and_attributes.php非推奨のタグと属性、およびそれらを置き換える方法
http://www.w3.org/TR/html401/appendix/changes.html HTML 4.01で廃止された正確なタグ情報
upd:いくつかのエラーを修正しました