World Wide Web Guide

DOCTYPEスイッチ

現在リリースされている視覚環境のUAには、宣言された文書型に応じてレンダリングモードを標準準拠(standard)モードか後方互換(quirk)モードに切り替えるDOCTYPEスイッチ(DOCTYPE Switching)の機能が備えられています。

これは、全ての制作者が宣言した文書型に定義されている仕様（ルール）に沿った文書を作成していれば、その仕様通りの動作や表示が期待できるので問題は起こりませんが、中には問題のある記述をしている制作者もいるために、UA側で宣言されている文書型に応じてレンダリングモードを切り替えるようになっています。後方互換(quirk)モードでは、勝手な拡大解釈をすることになったり、仕様で定義されている内容とは異なる独自の解釈をすることがあり、UAによってはDOCTYPEスイッチ機能が問題を引き起こすこともあるので注意が必要な機能です。

Internet Explorer 6には要注意

宣言された文書型に応じて自動的にレンダリングモードを切り替えるDOCTYPEスイッチ機能によって、Windows版Internet Explorer 6では深刻な問題を引き起こすことがあります。たとえば、XHTML1.0の規格で文書を作成する場合に、1行目がXML文章であることを宣言するXML宣言から開始されていると、本来は標準準拠(standard)モードでレンダリングされるべきはずが、Windows版Internet Explorer 6のみ後方互換(quirk)モードに切り替わってレンダリングされてしまうという問題を抱えた実装となっているためです。

XML宣言省略で回避可能

なお、この問題はHTMLシリアライゼーション(text/html配信)の文書であれば、XML宣言自体を省略することが許可されているので、XML宣言を省略することで、Internet Explorer 6だけが勝手に後方互換モードに切り替わってしまう問題を回避することが可能です。

後方互換(quirk)モードの際に問題となりそうな実装例

上記で取り上げたのは一部ですが、このように標準準拠(standard)モードと後方互換(quirk)モードとでは解釈やCSSの振る舞い方が異なります。

たとえば、頻出しそうな問題の事例としては、段組みを行うために次のようなスタイルシートを記述して、XHTML文書の1行目が XML宣言で開始されている文書の場合です。このとき、通常のUAは標準準拠(standard)モードでのレンダリングですが、Internet Explorer 6のみ自動的に後方互換モードに切り替えたレンダリングとなるため、表示に差異が発生してしまうのです。

div.main{width:80%; float:right; border-left:1px;}
div.menu{width:20%;}

paddingプロパティ, borderプロパティで指定された値は widthプロパティ, heightプロパティに内包して計測する独自のレンダリングが行われ、これにより上記の "width : 80% ;" に加えて "border-left : 1px ;" の指定があるはずなのに、枠線の "1px" 分の指定は "width : 80% ;" に含んで計測することになります。このためInternet Explorer 6で表示確認を行うと、この文書は問題なくきれいにレンダリングされているように勘違いしてしまうことが想定されます。そして、通常通り標準準拠(standard)モードでレンダリングしている他のUAでは "width : 80% ; + border-left : 1px ;" と指定された値を正確に解釈できるので、最終的なボックスの幅は "width : 80% ; + 1px + width : 20% ;" と算出でき、"100%" を "1px" 分オーバーするために当然二つのボックスが並んで表示されるのではなく、片方のボックスが下に落ちたような状態で表示されます。

上記のような事態が起こり得るのは、制作者がInternet Explorer 6だけに偏った表示確認しか行っていなかった場合ですが、ユーザの観覧環境を問はずとも、どのような環境でも快適に観覧できるように配慮して制作することは大事なことですので、ウェブコンテンツ制作者は、基本となるXHTMLとCSSの仕様についてはしっかりと理解しておく必要があります。

文書型宣言に応じた主要ブラウザのレンダリングモード一覧表

文書型宣言(DOCTYPE宣言) IE6 IE7/8 IE9Beta Opera8+ Firefox1+ Safari1+
Chrome1+
HTMLバージョンやDTDの指定なし、または HTML2.0、及び3.2の場合 quirk quirk quirk quirk quirk quirk
HTML4.01(!DOCTYPE HTML PUBLIC部分はcase-insensitivelyで大文字・小文字の区別なし)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> standard standard standard standard standard standard
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> standard standard standard standard standard standard
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict //EN"> standard standard standard standard standard standard
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict //EN" "http://www.w3.org/TR/html4/strict.dtd"> standard standard standard standard standard standard
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> quirk quirk quirk quirk quirk quirk
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> standard standard standard standard standard standard
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> quirk quirk quirk quirk quirk quirk
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> standard standard standard standard standard standard
HTML5(MIMEタイプ:text/html) (!DOCTYPE htmlの部分はcase-insensitivelyで大文字・小文字の区別なし)
<!DOCTYPE html> standard standard standard standard standard standard
XHTML5(MIMEタイプ:application/xhtml+xml)
<!DOCTYPE html> error* error* standard standard standard standard
XHTML1.0(MIMEタイプ:text/html)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> standard standard standard standard standard standard
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> standard standard standard standard standard standard
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> standard standard standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">		 quirk standard standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">		 quirk standard standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">		 quirk standard standard standard standard standard
XHTML1.1(MIMEタイプ:text/html)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> standard standard standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">		 quirk standard standard standard standard standard
XHTML Basic（MIMEタイプ:text/html）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd"> standard standard standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">		 quirk standard standard standard standard standard
XHTML1.0(MIMEタイプ:application/xhtml+xml)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> error* error* standard standard standard standard
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> error* error* standard standard standard standard
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> error* error* standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">		 error* error* standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">		 error* error* standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">		 error* error* standard standard standard standard
XHTML1.1(MIMEタイプ:application/xhtml+xml)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> error* error* standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">		 error* error* standard standard standard standard
XHTML Basic(MIMEタイプ:application/xhtml+xml)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd"> error* error* standard standard standard standard
<?xml version="1.0" encoding="文字コード"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">		 error* error* standard standard standard standard
errorについて
IE8以前のバージョンにapplication/xhtml+xmlの文書を送ると、application/xhtml+xmlのMIMEタイプを認識できないために、その文書を保存するかどうかを尋ねられます。この問題はIE9で改善済み。

HTML5の文書型宣言は優秀

HTML5の文書型宣言には従来のようなDTDが存在しないため非常に短く、そもそもの目的がHTMLシリアライゼーション(text/html配信)の文書において標準準拠(standard)モードを有効にするための手段として用いられることになっています。そのため過去にリリースされているブラウザから現段階でリリースされているブラウザまで幅広く、<!DOCTYPE html>を標準準拠(standard)モードのトリガーとして解釈します。

これはあまり好ましい説明ではありませんが、DOCTYPEスイッチ問題に時間を費やしてしまうような非効率な事態を避けるためにもDOCTYPEスイッチ云々そのものがよくわからないという場合はHTML5の文書型宣言を用いておけば、HTML5の仕様に準拠する・非準拠であることは問はず、DOCTYPEスイッチ問題に悩まされることは、まず起こりえないので、それはそれでひとつの有効な手段と言えるでしょう。

現にHTML5仕様に非準拠であっても、HTML5の文書型宣言の目的どおり、標準準拠(standard)モードを有効にするための手段としてHTML5の文書型宣言を用いているウェブサイトは多数存在します。