読者です 読者をやめる 読者になる 読者になる

ふろしき.js

Web + Mobile + UX + Performance Tech

IE11ではDOCTYPE宣言がチェックされない、どうすれば解決できるか?

IE11から、ドキュメントモードは非推奨というステータスに変わっています。
(※参考 : ドキュメント モードの非推奨 - Microsoft)

IEはこれまで、DOCTYPEを確認してQuirksモード(IE5+αなレンダリングエンジン)とEdgeモード(最新のレンダリングエンジン)を切り替えていましたが、11からはこの仕様は削除され、DOCTYPEの記述がドキュメントモードに影響を与えなくなりました。

古いWeb標準に従って記述されていた以下のようなドキュメントは、これまではQuirksモードで動作していましたが、IE11では常にEdgeモード(IE11のレンダリングエンジン)で動作します。

※ DOCTYPE宣言無し

<html lang="ja">
  <head>
    <meta charset="utf-8" />
    <title>test page.</title>
  </head>
  <body>
  </body>
</html>

※ FramesetのURI指定無し

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">

※ TransitionalのURI指定無し

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


f:id:furoshiki0223:20131118233751p:plain

この仕様変更によりWebページが正常に表示出来ない場合、Microsoftの公式の見解としては、コンテンツの制作/開発者が改善を行わなくてはいけないことになっています。

しかし、これを待つことが出来ない状況があるはずです。その場合、以下の方法を参考に解決策を探ってみて下さい。

1. ユーザ側でできる対策

IEには、Webサイトの利用者側で、特定のドメインに対する「互換性モード」の切り替えを行う機能を持っています。

Microsoftでは、IEをエンタープライズ用途(企業内向け)で利用されることを想定しており、ライフサイクルの長いシステムのプラットフォームとして利用されることを前提とした、様々な機能が提供されています。

互換性モードは、IEのバージョンアップを行っても、古いWebサイト・アプリを継続して利用できるよう、古いレンダリングエンジンの動作をエミュレートすることができる機能です。

以下の手順に従い、設定を試してみて下さい。

IEのウィンドウ右上にある「歯車アイコン」をクリックし、「互換表示設定(B)」をクリック。
f:id:furoshiki0223:20131111201907p:plain

ドメイン名を入力し、「追加」をクリック。
f:id:furoshiki0223:20131111202037p:plain

閉じるをクリックすると、IEは再びロードを開始し、古いレンダリングエンジンによる動作を開始します。IE11では、「互換表示設定」にて指定されたドメイン名(URL)のWebサイトは、「IE5」の動作を再現させます。

2. 開発者側でできる対策

★ ApacheでHTTPレスポンスヘッダにX-UA-Compatibleを追加する

RHEL/CentOS/FedoraでApache HTTP Serverを利用している場合は、「/etc/httpd/httpd.conf」にて、一番最後に以下の内容を追記して下さい。

LoadModule headers_module modules/mod_headers.so
<IfModule headers_module>
   Header set X-UA-Compatible: IE=5
</IfModule>

Apacheに「mod_headers.so」がバンドルされていない場合はエラーになります。予め、インストールして下さい。

★ IISでHTTPレスポンスヘッダにX-UA-Compatibleを追加する

MicrosoftのWindows系OSで「インターネット インフォメーション サービス(IIS)」を利用している場合は、以下の手順になります。

「コンピュータの管理」→「インターネット インフォメーション サービス(IIS) マネージャー」
f:id:furoshiki0223:20131112210814p:plain

「HTTP応答ヘッダー」
f:id:furoshiki0223:20131112210923p:plain
表示内で右クリック、「追記」を左クリック
f:id:furoshiki0223:20131112211023p:plain
「名前(N):」へ「X-UA-Compatible」、「値(V):」へ「IE=5」
f:id:furoshiki0223:20131124005122p:plain

広告を非表示にする