文書型宣言と表示モード
文書型宣言
まず、HTML「Hypertext Markup Language（ハイパーテキストマークアップランゲージ）」は、SGML「Standard Generalized Markup Language(文書記述言語)」の一つで、情報を発信するための文書構造を定義するための言語です。HTMLを書く側・読む側で矛盾が起こらぬようW3Cによって標準化された勧告がなされています。
またHTMLは複数のバージョンがW3Cにて勧告されています。 其々のバージョンはバージョンと用途によって、文書型宣言の記述方法がことなります。
下記に、主なバージョンの簡単な説明とDTDの記述例を示します。 より詳しい説明はhttp://www.w3.org/を参照ください。
- HTML4.01
- 1999年12月にW3Cよりリリースされる。1998年5月にリリースされたCSS 2 との連携を照準にHTML 4.0 を全般的に改訂したもの。
- 【Strict】論理的なタグのみで記述する場合のDTD。
- 【transitional】非推奨な要素や属性を記述する場合のDTD。
- 【Frameset】transitionalにフレームの使用を追加したもの。
参照： http://www.w3.org/TR/html401/ - XML
- XML1.0は1998年2月にW3Cよりリリースされる。Extensible Markup Language（XML、拡張可能なマーク付け言語） 参照：http://www.w3.org/XML/
- XHTML1.0
-
2000年1月にW3Cよりリリースされる。XHTMLは、HTMLをXMLの仕様に準拠するようにXMLの文法で再定義したものです。
HTML4.01と同じく【Strict】【transitional】【Frameset】の3つのDTDがあります。
HTML4.01と使用可能な要素はほぼ同じで、HTML4.01との主な相違点は、 XMLでは大文字・小文字が厳密に区別される。 要素名・属性名は小文字で書かなければならない。 要素は必ず開始タグと終了タグをそなえていなければならない（タグ省略は許されない）。 属性値は必ず "" ないし '' で囲まなければならない。などです。
- 参照：http://www.w3.org/TR/xhtml1/
- XHTML1.1
- 2001年5月にW3Cよりリリースされる。機能がモジュール化されカスタマイズが可能。非推奨要素は廃止されています。またTransitional DTDとFrameset DTDは廃止され、Strict DTDのみ。
参照http://www.w3.org/TR/xhtml11/ - XHTML2.0
- 2005年5月、W3Cにてドラフトが公開される。
参照：http://www.w3.org/TR/2005/WD-xhtml2-20050527/
表示モード
そしてそのHTMLの種類によって表示モードは違ってきます。
こちらのサイトでは主にHTML 4.01 Transitionalで記述しています。 それではHTML 4.01 Transitionalでloose.dtdを指定するのと、しないのでは何が違うのかと言うと、ブラウザでのレンダリングが違ってきます。いわゆる「標準モード」と「互換モード」です。
「標準モード」と「互換モード」では何が違うのかと言うと、「標準モード」ではフォントの初期値がmediumになり、「互換モード」ではsmallが初期値になります。
HTML 4.01 Transitionalでloose.dtdを指定した場合「標準モード」となり、指定しないと「互換モード」になります。
下のキャプチャー画像は、
右が「互換モード」
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
左が「標準モード」」
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">です。
左は、初期値の100%が、mediumと同じサイズになり、右では初期値100%がsmallと同じサイズになります。
それ以外にも、スタイルシートを使用した場合、気がつかないようなところで、いろいろ違ってきます。例えばサンプルAのページのサンプルKですが、「互換モード」のopera7 ではボーダーが表示されず、ロールオーバーしても変化しません。また「標準モード」のWin+ieではマージンの指定の仕方では、ロールオーバー時にマージンが無視される等です。
表示モード表
HTMLのバージョンドキュメントの宣言によって、ブラウザごとに表示モードは変わります。
下に表にまとめてみました。左の数字をクリックするとドキュメントの宣言ごとのサンプルファイルが見れます。ファイルはドキュメントの宣言とそれに伴うヘッダーとタグ以外は同じものです。
| DOCTYPE | IE6 | M | O | SF | MI5 | |
|---|---|---|---|---|---|---|
| なし | ||||||
| 0 | なし | 互換 | 標準 | 互換 | 標準 | 互換 |
| HTML4.01 Strict | ||||||
| 1 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> | 標準 | 標準 | 標準 | 標準 | 標準 |
| 2 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> |
標準 | 標準 | 標準 | 標準 | 標準 |
| HTML4.01 Transitional | ||||||
| 3 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> | 互換 | 標準 | 互換 | 標準 | 互換 |
| 4 | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> |
標準 | 標準 | 標準 | 標準 | 標準 |
| XHTML1.0 Strict | ||||||
| 5 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
標準 | 標準 | 標準 | 標準 | 標準 |
| 6 | <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
互換 | 標準 | 互換 | 標準 | 標準 |
| XHTML1.0 Transitional | ||||||
| 7 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
標準 | 標準 | 標準 | 標準 | 標準 |
| 8 | <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
互換 | 標準 | 互換 | 標準 | 標準 |
| XHTML1.1 Strict | ||||||
| 11 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
標準 | 標準 | 標準 | 標準 | 標準 |
| 12 | <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
互換 | 標準 | 互換 | 標準 | 標準 |
HTML 4.01 Transitionalでloose.dtd指定するとIE、Opera、とその他のブラウザでフォントサイズを一致させる事が出来ます。
逆に言うと、loose.dtd指定させないとフォントのサイズが変わります。例えば「互換モード」の表示確認のみで、フォントサイズをx-smallに指定すると、「標準モード」では「互換モード」で表示されるxx-smallと同じサイズで表示されます。
