スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

FC2ブログは「X-UA-Compatible」を条件付きコメントで囲ってはいけない

記事タイトルですべて言い切ってしまった気がするが、意図的にIE7モードを設定してない限りそうした方がいいですよ、という話。理由は意図せずIE10(恐らく以降も含む)がIE7互換モードで動くようになってしまうから。

これに気がついたのはアクセス解析をチェックしていて以下のようなUAを見つけ「なんだこりゃ」と思ったことからだった。

Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.2; Trident/6.0)

Windows 8(NT 6.2)に標準で搭載されているのはIE10のはずで、IE7を使っていることは普通ありえない。本来は以下のようになるはず。

Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)

しかも1件や2件なら意図的に変更している可能性もあるが、Windows8 + IE10のアクセスがみんなこのUAになっていた。不思議に思い早速検索して調べみたら、マイクロソフト公式の以下のページを発見した。

Web ページが互換表示で表示されると、Internet Explorer 10 には IE7 標準モードのページが表示されます。これは、Internet Explorer 9 と Windows Internet Explorer 8 の動作と一貫性があります。 これにより、ユーザー エージェント文字列にも影響が出ます。

Internet Explorer 10 のユーザー エージェント文字列

要するにIE10がIE7モードで動いているということのようだ。

Web管理者の間で評判が悪いIEも、9以降でやっと多くのバグ潰しやHTML5への対応が進んできたのだから、ここはぜひ最新のIE10モードで動いていただきたい。しかもOSは最新のWindows 8なわけで、何が悲しくてIE7のような古めかしいエミュレートモードで動かさなきゃいけないの!といったところだ。(記事執筆時点では、Windows 7用の正式版IE10はまだ提供されいない。)

FC2ブログでIE10がIE7モードで動くわけ

理由のひとつは簡単で、FC2ブログは何年も前からHTTPレスポンスヘッダに「IE=EmulateIE7」を設定しているから。恐らく古いブログテンプレートへの対応として採用したのだと思うが、チェックしたところ2012年末の現在でもこの仕様は変わっていない。

この挙動を避けるため、FC2ブログでIEを最新の(というかIE8以降の)モードで動作せたい場合は、ブログテンプレートのメタタグに「X-UA-Compatible」を設定する必要がある。設定方法は実は色々あるのだが、面倒な場合はとにかく最新のモードで動くように以下を設定すればいい。(ただしマイクロソフトはきちんと動作確認が取れたモードを記述するように推奨している。)

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

このブログでもこのX-UA-Compatibleを設定していて、IE9までは適切に最新のレンダリングモードで動作していた。だからIE10が登場しても、特に何かしなくてもそのままでいいだろうと思っていたのだが……。

IE10は「条件付きコメント」を無視する

「X-UA-Compatible」を使うにしても、普通は上記のメタタグを設定してそれで終わりなのだが、実はこのブログでは諸事情があってこれを条件付きコメントで囲っていた。これはそもそもIEにだけ読み込めればいいタグだったのと、Chrome Frameの動作チェックのためにタグをいじっていたのがその理由。(それとHTML5では正しくない構文になるため、サイトによっては正当なHTMLを目指すため条件付きコメントにする場合があるようだ。)

するとどうやらこの条件付きコメントこそが、IE10がIE7モードで動いていた原因らしい。なんとIE10からは条件付きコメントがサポートされなくなってしまったようなのだ。

相互運用性の向上と HTML5 準拠のため、Internet Explorer 10 の標準モードと Quirks モードでは、条件付きコメントのサポートが削除されました。 これは、条件付きコメントが、その他のブラウザーの場合と同様に、通常のコメントとして扱われることを意味します。

条件付きコメント - Internet Explorer デベロッパー センター

これにより条件付きコメント内のX-UA-Compatibleのメタタグが無視され、FC2ブログのサーバ側のHTTPレスポンスヘッダで設定されている「IE=EmulateIE7」が優先され適用されてしまう。IE9までならX-UA-Compatibleは条件付きコメント内に記述しても普通に動作していたが、IE10からはこの方法が使えないのだ。

FC2ブログ以外への影響

FC2ブログ以外の普通のサイトやブログサービスの場合は、IE7モードで勝手に動くような心配はない。繰り返すがそもそもの原因は、FC2ブログにHTTPヘッダでIE7モードへのエミュレートが設定されているからで、他のブログではサービスごとこんな設定をしていることはまずないからだ。例えIE10の利用者が増えていっても、勝手に最新のIE10モードで動いてくれるだろう。

ただ、IE10から条件付きコメントが機能しなくなったのは事実なので、FC2ブログに限らずその辺りの修正が必要になるページは結構あるかもしれない。例えば[if IE]などで完全にIE用のCSSやHTMLを切り分けている場合などがあげられる。

実はマイクロソフトは条件付きコメントの使用をあまり推奨していなかったらしいので、今回のIE10の仕様変更を踏まえて、古いIEへの対応を除けば条件付きコメントは使わない方向性に行くしかないのは間違いないだろう。とはいえIE10でもIE9以前の互換モードを使えば機能するようなので、時間がない場合は上記の記事で書かれているように、とりあえずIE9モードを設定してしのぐ……という手を使うしかないかもしれない。