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

DOCTYPE宣言の役割と使用方法の詳細

2022-01-29 21:44:10

I. ブラウザのレンダリングモードとdoctype

      標準に則って作成されているページもありますが、そうでないものも多くあります。標準に沿ったページを作ることができなくても、そのページをブラウザが標準に従って正しく表示してくれることを望みます。現在、多くのWebページが非標準のコードで埋め尽くされていますが、それでも問題なく動作しています。実際、古いブラウザ用に設計されたコードのほとんどは、新しいブラウザでも正しく表示されます（レンダリングは異なるかもしれませんが）。その理由は何でしょうか。実は、最新の標準に厳密に従うと、それらのページが生き残るための基盤が完全に破壊されてしまうからなのです。これは、違いを生み出そうとするどのブラウザにとっても、確かに容認できないことです。

<スパン ブラウザのレンダリングモデル

      最近のブラウザは、標準に準拠したページと古いブラウザ用にデザインされたページの両方に対応するために、さまざまなレンダリングモードが用意されています。このうち、Standard（別名：ストリクトレンダリングモード）は最新の標準に準拠したページをレンダリングするために使用され、Quirks（別名：ルーズレンダリングモードまたは互換モード）はレガシーブラウザ向けにデザインされたページをレンダリングするために使用されます。また、Mozilla/Netscape 6 には、古いバージョンの標準向けにデザインされたページをサポートする Almost Standards モードが新たに追加されていますので、注意してください。

<スパン doctypeトグルとは何ですか？
      ページの先頭に置かれたdoctype宣言は、ブラウザを正しいレンダリングモードにするためのキーとなるものです。ブラウザは、doctype宣言で指定された種類の文書を正しく表示するために、自動的に適切なレンダリングモードに切り替わります。

理論的には、これは非常に直感的なスイッチになるはずです。もし doctype が現在のページが標準準拠 (つまり HTML 4+ または XHTML 1+) のドキュメントであることを示すなら、ブラウザは標準モードに切り替わります。doctypeが指定されていない場合、またはHTML 3.2以前が指定されている場合、ブラウザはQuirksモードに切り替わります。こうすることで、ブラウザは、古い非標準のページを完全に破棄することなく、標準に準拠した文書を正しく表示することができるのです。

<スパン doctype切り替えの問題点
      しかし、doctypeの切り替えは不完全な解決策です。Web ドキュメントで doctype 宣言を使用しても、ブラウザはページを表示するために希望するレンダリングモードをとらないことがある。その理由は、doctypeの形式が間違っていたり、<?xml version="1.0" encoding="UTF-8"? >) スタで、XHTMLページも含まれていたり、多岐にわたります。しかし、IE、Opera、Safariの古いバージョンでは、ドキュメントの最初の行がdoctype宣言であることが期待されています。そのため、その前に何か（XMLプロローグを含む）があると、doctypeが認識されません。したがって、XMLプロローグがあると、IE、Opera、SafariはQuirksモードになります。XMLプロローグは必須ではありませんので、XHTMLページからは安全に省くことができます。注：XML prologに含まれないencoding属性を補うために、http-equiv metaタグにcharset属性を必ず含めてください。

URLがない、または相対URLである。
     完全なdoctype宣言に、対応する文書型定義（DTD）ファイルのURLを含める。URLがない場合、または（完全修飾インターネットアドレスではなく）相対パスが指定されている場合、doctype宣言で指定されているモードにかかわらず、ほとんどのブラウザがQuirksモードになる。

<スパン doctype の形式が正しくない : は、その
      ブラウザはdoctype宣言の形式やフォーマットに非常に敏感で、不正確な形式のdoctypeを認識できない場合は強制的にQuirksモードにします(このため、正しいことが分かっているdoctypeは自分で入力するのではなく、文書にコピー&ペーストすることをお勧めします)。誤った形式のdoctypeの一般的な理由は、doctypeの最初の部分とURLの間にスペースがないことです。2行のdoctypeを1行に折りたたむと、しばしばこのスペースが欠落することになります。

移行中のdoctype。
      IEとOperaは標準モード、Netscape 6と古いバージョンのSafariはQuirksモード、Netscape 7、Mozilla 1と新しいバージョンのSafariはNetscapeのAlmost Standardsモード、これは標準モードのより耐障害性の高いバージョンであるを使用します。
Doctype が不明です。
      IE と Opera は標準モードになります。言い換えれば、認識されない doctype はまだブラウザに統合されていない新しい標準であると見なします。.
      doctype スイッチは、ブラウザ間の不整合を認識し、問題を未然に防ぐことができれば、ブラウザを適切なレンダリングモードにし、ウェブページを正しく表示させるための有効な手段となりえます。

II. 正しいdoctype宣言の使用

      普段、ページを作るときにこの点を無視しがちだが（私も含め、普段は書かず、ブラウザのデフォルトを使うほど怠惰）、現在のウェブコーディング仕様ブームでは、この詳細を知っておく必要がある、役に立つはずである。諺にもあるように、ルールはないのです。

      ほとんどのWebドキュメントの冒頭にはdoctype宣言がありますが、多くの人はそれを気にしません。これは、新しいドキュメントを作成するときにウェブオーサリングソフトウェアが無造作に扱う多くの詳細のうちの一つです。doctype は多くの人に見落とされていますが、標準に従ったウェブ文書では必須の要素です。doctype はコードの検証に影響し、ブラウザがウェブ文書を最終的にどのように表示するかを決定します。

<スパン doctypeの機能

      doctype 宣言は、文書内のマークアップを解釈するために、読み手がどのような規則のセットを使用すべきかを示します。ウェブ文書の場合、quot;reader" は通常ブラウザや検証プログラムなどのプログラムであり、quot;rules" はW3Cによって公開された文書型定義 (DTD) に含まれるものです。

      各 DTD には、Web ドキュメントのコンテンツをマークアップするタグ、属性、プロパティのセットと、どのタグが他のどのタグの中に出現できるかを指定するルールが含まれています。各ウェブ推奨規格（HTML 4 Frameset や XHTML 1.0 Transitional など）には独自の DTD があり、文書内のマークアップが doctype 宣言で指定された DTD に従っていない場合、文書はコード検証に合格せず、ブラウザで正しく表示されないことがあります。ブラウザはチェッカーよりもマークアップの不整合に寛容です。しかし、Doctype宣言が正しくない場合、ページが正しく表示されなかったり、まったく表示されなかったりすることがよくあります。

<スパン 正しいdoctypeの選択

      正しいdoctype宣言を行うには、その文書が準拠している規格にDTDを対応させることがポイントです。例えば、文書が XHTML 1.0 Strict 標準に準拠していると仮定すると、文書の doctype 宣言は対応する DTD を参照する必要があります。一方、doctype宣言でXHTMLのDTDを指定しているのに、文書に旧来のHTMLマークアップが含まれていれば不適切ですし、同様にdoctype宣言でHTMLのDTDを指定しているのに、文書にXHTML 1.0 Strictマークアップが含まれていれば、これも不適切です。

      また、doctype宣言を全く使用しないことも可能な場合があります。有効なdoctype宣言が指定されない場合、ほとんどのブラウザは組み込みのデフォルトDTDを使用し、その場合、ブラウザは組み込みのDTDを使用して、指定されたマークアップを表示しようとします。その場しのぎで、急ごしらえで作った文書（そういうものはたくさんあります）については、確かにdoctype宣言を省略して、ブラウザのデフォルト表示を受け入れることを検討してもよいかもしれません。

しかし、ほとんどのWeb文書は、W3Cが発行した国際的に認められたWeb標準に従う必要があるため、それらの文書には通常、以下の標準的なdoctype宣言のいずれかを含むことが期待されます。

HTML 2: <!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">

HTML 3.2: <!DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 3.2 Final//EN">

HTML 4.01 Strict: <!DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 4.01//EN" "。 <フォント http://www.w3.org/TR/html4/strict.dtd ">

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

HTML 4.01 フレームセット: <!DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 4.01 Frameset//EN" "。 http://www.w3.org/TR/html4/frameset.dtd ">

XHTML 1.0 Strict: <!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Strict//EN" "です。 <フォント http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd ">

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

XHTML 1.0 フレームセット: <!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Frameset//EN" "。 http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd ">

XHTML 1.1: <!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.1//EN" "。 <フォント http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd ">

XHTML 1.1 plus MathML plus SVG: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN" "です。 <フォント http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd ">

      上記のdoctype宣言の他に、特殊な要件を持つ文書では、いくつかの宣言を使用します。

      doctype宣言は通常、文書の最初の行で、<html>タグと残りの文書内容の前に置かれます。XHTML文書では、doctypeの前にXML処理指示文(XML prologとしても知られています)が置かれることがあることに注意してください： <?xml version="1.0" encoding="utf-8"?

      正しいdoctypeを使用することは、ページを正しく表示し、バリデーションを正常に通過させるための鍵です。コンテンツと正反対のdoctype、不正確なもの、誤った形式は、多くの問題の元凶となります。

      DWでWebページをデザインする場合、新しいファイルを作成し、コードの先頭を見ると、必ず次のような記述があります。
DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 4.01 Transitional//EN" " http://www.w3.org/TR/html4/loose.dtd "> DWがページファイルのページに自動的に追加するDTD情報で、削除することも可能です。削除後にブラウザが使用するデフォルトのDTDです。
III. どのようなDOCTYPEを選択するか

      標準に準拠したサイト作りを始めるために、まず必要なことは、ニーズに合ったDOCTYPEを宣言することです。

      このページの元のコードを見ると、最初の行が <!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Transitional//EN" " となっていますね。 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">

      ウェブデザインソフトウェアの開発者として有名なマクロメディアや、デザインの第一人者であるゼルドマンの個人サイトなど、いくつかの標準準拠のサイトを開くと、同じコードが表示されます。他の標準準拠のサイト（k10k.netなど）には、次のようなコードがあります。

<!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Frameset//EN" "。 http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Transitional//EN" "。 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">br >。コードの全文は以下の通りです。


<!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Transitional//EN" "。 http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Transitional//EN" "。 <フォント http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd ">

どのようなDOCTYPEを選択するか
      理想はもちろん厳密なDTDですが、Web標準に慣れていない私たちデザイナーの多くは、今のところtransitional DTD（XHTML 1.0 Transitional）が理想です（このサイトもtransitional DTDを使用しています）。このDTDでは、プレゼンテーション層のロゴ、要素、属性も使えるので、W3Cのコード検証もパスしやすくなっています。注：上記の"プレゼンテーション層のロゴ、属性"は、レイアウト用のテーブル、背景色のロゴなど、純粋にタグの性能を制御するために使用されるものです。XHTMLでは、ロゴは構造を表すために使われるのであって、プレゼンテーションを実装するために使われるのではありません。私たちの移行の目標は、最終的にデータとプレゼンテーションを分離することです。

      例えるなら、マネキンが服を着替えるようなものです。マネキンはデータのようなもので、服はプレゼンテーションのようなものです。マネキンと服が分かれているからこそ、自由に着替えることができる。当初のHTML4では、データとプレゼンテーションが混在しており、プレゼンテーションを一度に変更することは非常に困難でした。ああ、ちょっと抽象的ですね。この考え方は、応用の過程で徐々に理解していく必要があります。

     追加
     DOCTYPE宣言は、すべてのXHTML文書の最上部に、すべてのコードとロゴの上に置かなければなりません。

第四に、DOCTYPE HTML PUBLICはこのように公式に定義されています。

!DOCTYPE

--------------------------------------------------------------------------------

HTML文書が従う文書型定義（DTD）を指定します。

マイクロソフトの新機能？インターネットエクスプローラー6。この宣言を使用すると、Internet Explorer 6 およびそれ以降のバージョンを標準の互換性モードに切り替えることができます。

<スパン 構文

      HTMLトップレベル要素の使用可能性 "登録/整理/タイプタグ/言語定義""URL"。

可能な値

      トップレベル要素。DTDで宣言されているトップレベル要素の種類を指定する。これは、宣言されたSGML文書タイプに対応する。デフォルトではHTML。

      可用性：形式的公開識別子（FPI）が、一般にアクセス可能なオブジェクトであるか、システムリソースであるかを指定する。PUBLIC デフォルト。一般にアクセス可能なオブジェクト。  SYSTEM ローカル・ファイルや URL などのシステム・リソース。

      REGISTRATION：組織が国際標準化機構（ISO）に登録されているかどうかを指定する。+ デフォルトです。組織名が登録されている。- インターネット技術タスクフォース（IETF）およびワールドワイドウェブコンソーシアム（W3C）は、ISOの組織として登録されていません。

      組織 DOCTYPE文が参照するDTDの作成と保守に責任を持つことを示すグループまたは組織の名称、すなわちOwnderIDを指定する。IETF IETF。W3C W3C。

      タイプ：公開テキストクラス、すなわち参照するオブジェクトの種類を指定する。DTD デフォルト。

      tag: パブリックテキストの説明、すなわち参照されるパブリックテキストの一意の記述名を指定する。その後にバージョン番号が続くこともある。HTML デフォルト。HTMLです。

      定義：文書型の定義を指定する。Frameset フレームセット文書。Strictは、スタイルシートが既に確立されているため、W3Cの専門家が段階的に廃止したい代表的な属性や要素をすべて除外しています。transitionalは、frameSet要素以外のすべてを含んでいます。

      言語。参照されるオブジェクトの作成に使用された自然言語コーディングシステムであるパブリックテキスト言語を指定します。言語定義は、ISO 639言語コード（大文字2文字）として記述されています。EN デフォルト。英語です。

      URLを指定します。参照するオブジェクトの位置を指定します。

<スパン アノテート

      この宣言は、文書の先頭で、html タグの前に表示されなければならない。

      DOCTYPE要素には終了タグは必要ありません。

      この要素は、HTML for Microsoft? Internet Explorer 3.0に対応しています。

      この宣言を利用することで、Internet Explorer 6以降では、Strict standard compatibility modeに切り替えることができます。このスイッチをオンにするには、文書の先頭に !DOCTYPE 宣言を記述し、その宣言の中で有効なタグと、場合によっては定義と URL を指定します。

      注意 標準互換モードでは、他のバージョンのInternet Explorerとの互換性は保証されません。標準互換モードをオンにした場合、ドキュメントは将来のバージョンのInternet Explorerとは異なる方法で表示される可能性があります。このモードは、コンテンツがすでに固定されている（CDに焼かれているなど）場合は使用しないでください。

<スパン 例

      次の例は、!DOCTYPE宣言を使って文書準拠のDTDを指定し、Internet Explorer 6以降を標準互換モードに切り替える方法を示しています。次の例の宣言は、いずれもHTML 4.0 DTDへの準拠を指定しています。2番目の宣言では "Strict" を指定しています。1つ目の宣言では指定されていません。どちらもInternet Explorer 6以降を標準互換モードに切り替えます。

DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 4.0//EN">.DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 4.0/EN">
<!DOCTYPE HTML PUBLIC "-/W3C//DTD HTML 4.0 Strict///EN">

     次の例の宣言は、どちらも "Transitional" HTML 4.0 DTD に準拠していることを指定しています。2番目の宣言は DTD の URL を指定していますが、最初の宣言にはありません。2番目の宣言は、Internet Explorer 6以降を標準互換モードに切り替えます。1番目の宣言はそうしません。

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

関連

最新

おすすめ

について
/
プライバシー・ポリシー
/
お問い合わせ
© 2022 BinaryDevelop. すべての権利は、それぞれの所有者に帰属します