先日のエントリーでFlashからHTML5へ移行って話の続きになりますが、
結局というかやっぱりというか、HTML5に移行したアニメーションを顧客に見てもらったら
「IE9以下で見れないのでどうにかして下さい」
というお言葉をもらった。
だから言ったじゃん。散々言ったじゃん。古いIEじゃ見れないって。それでもいいか？って聞いたらいいよっていうから移行するんじゃん。
まったくもー。
というわけで、IE用の条件付きコメント
<!--[if lt IE 9]>～<![endif]-->
とか使って、IE8以下の場合はFlashを表示することになったのですよ。
但しWindowsXPのサポートが切れる4/9まで。4/9以降はHTML5のみに切り換える模様。
まぁ判断としてはアリだと思う。
で、
FlashとHTML5両対応のテストページを顧客に見てもらったんだけど、
「IE9で見れないのでどうにかして下さい」
というお言葉をもらった。
IE10やIE8ではアニメーションが再生されるけど、IE9だけ再生されずに、HTML5未対応ブラウザ時に表示される画像が表示されるらしい。
どうも開発者モードのドキュメントモードが勝手にQuirksになるとのこと。
適当にググると
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
を突っ込めばとりあえず解決するって出てくる。
試してみると確かに一応解決するっぽい。
でもこの方法はMicrosoft非推奨なんだよね。
META タグと将来の互換性のロック
エッジ モードでは、Windows Internet Explorer が利用できる最も互換性の高いモードでコンテンツを表示します。これは、実際には “ロックイン” パラダイムに違反します。Windows Internet Explorer 8 の場合は、IE8 モードと同じ動作になります。仮に、Windows Internet Explorer の将来のリリースでさらに互換性の高いモードがサポートされた場合、エッジ モードに設定されたページは、そのバージョンでサポートされている最も互換性の高いモードで表示されます。ただし、それらのページを Windows Internet Explorer 8 で表示した場合には、IE8 モードで表示されます。Windows Internet Explorer の将来のバージョンでページのコンテンツをレンダリングしたときに予期しない結果が起こる可能性があるため、Web 開発者はエッジ モードの使用をテスト ページや他の実用以外の目的に限定することをお勧めします。
じゃぁどうするか。
というか、なぜIE9だと勝手にQuirksになるのか。
顧客の閲覧環境を疑ったりしたんだけど、別に問題なさそう。
更にググった結果、htmlの先頭の<!DOCTYPE ～>に問題があることが判明。
今まで
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
としていたのですね。多分Adobe Dreamweaver CSあたりで適当に作ると勝手に書かれるのをそのまま使ってたんだと思うけど。
で、これを
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
に修正したところ、勝手にQuirksにされる現象は止まりました。
ホントはHTML5なんだから
<!DOCTYPE html >
とするのが正しいんだろうけど、実際のHTMLにはHTML5のタグは一つも書かれていないんだよね。
どうするのが正しいのか分からないけど、とりあえず今はコレで。
実はうちにIE9の環境は無かったので、サーバ用マシンのIE10をアンインストールしてIE9にしたんだよね。だるぅ。
そーいやIE11はドキュメントモードの変更はできるけどブラウザーモードの変更はできなくなったんだよね。
暫くはIE11にアップグレードできねぇなぁ。