[(X)HTML] IE8におけるページの互換モード指定
IE8 の正式版がリリースされたので、その特徴のひとつである互換モードの指定について記載する。
IE8のWeb標準準拠
IE は、独自の解釈やタグが多く、他のブラウザと比べてHTMLやCSSのWeb標準から外れている部分が多いとよく指摘されている。この問題の解決のため、IE8 ではWeb標準準拠への対応により力が入れられており、IE8 標準のレンダリングにはWeb標準準拠モードが使用されている。
Web標準準拠モードによる弊害
しかし、Web制作においてはクロスブラウザ対応が基本であり、IE8 リリース前に制作された大抵のサイトでは、IE6 や IE7 の表示に対応するため、IE にだけ有効な CSS の記述を用いるなど、以前のバージョンの IE への対応を行っている。これによって、一部のサイトでは IE8 の Web標準準拠モードでサイトを閲覧すると、 レイアウトやデザインが崩れることがある。
互換表示モード
この問題に対応するために、IE8 には「互換表示モード」と呼ばれるモードが搭載されている。 このモードを使用することで、サイトの閲覧者は以前のバージョンの IE の描画モードを使用して該当サイトを閲覧することが可能となる。
具体的には、IE8 には次の三つの描画モードが存在する。
- IE8標準モード(IE8標準、完全な標準CSS)
- IE7互換モード(IE7標準、IE7互換の標準CSS)
- Quirksモード(IE5標準、MS-CSS 5/6/7対応)
Quirksモード は該当ページの HTML コード内に DOCTYPE の宣言がない場合や、DOCTYPEで HTML 2.0 や 3.0 などの古いバージョンが指定された場合などで使われる。それ以外の場合で DOCTYPE 宣言があれば、基本的にIE8標準モードが使われる。IE7互換モードは、明示的に使うように指定しない限りは使われない。
互換表示モードの指定方法
互換表示モードは、基本的にはブラウザの設定からユーザにより指定されることで使用されるが、 サイト制作者側で事前に IE8 で該当サイトの表示が崩れることが分かっている場合は、Webページが IE8 で閲覧されたときには、常にIE7互換モードで表示するよう設定することができる。設定方法には以下2種類がある。
- Webページ単位で設定する方法:タグ利用
- サイト全体に一括設定する方法:HTTPヘッダ利用
今回は、metaタグによる対応方法のみを以下に記載する。(HTTPヘッダを利用した方法は後日追記する)
metaタグによる互換表示モードの指定
metaタグにより互換表示モードを指定する場合は、以下のメタタグを html のhead要素内に追加する。
<meta http-equiv="X-UA-Compatible" content="IE=emulateIE7" />
尚、「IE=」の後の部分を編集することで、描画モードを指定することができる。
描画モード | 値 |
---|---|
最新 | edge |
IE8標準 | emulateIE8 or 8 |
IE7互換 | emulateIE7 or 7 |
Quirks | 5 |
IE8標準 と IE7互換 を指定する際に、バージョンの前に「emulateIE」を付ける場合と付けない場合があるが、付ける付けないで微妙に動作が変わってくる。
詳しくは参考サイトで。
トラックバックURL
http://mashimonator.weblike.jp/mt/mt-tb.cgi/81
コメント投稿フォーム