Geld verbraten mit Google Adwords Wordpress 2.8 verfügbar
Mai 15

Der neue Internet Explorer 8 im Kompatibiliätsmodus

Yeah! Endlich ist er da! Der lange herbeigewünschte, superschnelle und beinahe firegefoxte Internet Explorer 8. Endlich dürfen alle Webseitenersteller auf ein verbessertes Verhalten des Browser hoffen. Aber… der Schein trügt, denn viele Webseiten wurden für die eine oder andere Version des Internet Explorers optimiert und liefen einfach prima – jetzt nicht mehr!


Das neue Zauberwort heißt Dokumentenkompatibiltätsmodus und fand seine Einführung mit dem IE8. Zuerst kam der DOCTYPE-Switch im IE6 und jetzt das. Da der neue Internet Explorer in der Standardeinstellung so eingestellt ist, dass höchstmögliche Kompatibilität gegeben ist, haben viele Seitenersteller so ihre Probleme.

Abhilfe schafft jetzt der Dokumentenkompatibilitätsmodus, der sowohl für einzelne Seiten als auch übergreifend festgelegt werden kann. Damit wird dem IE8 gesagt, wie er die Seiten darstellen soll.
Für einzelne Seiten greift die Methode der Meta-Tags am stärksten. Das Meta-Element muss unbedingt im Kopfbereich platziert werden und vor allen anderen als dem title stehen.

1
2
3
4
5
6
7
8
9
10
 <html>
   <head>
      <title>Website-Titel</title>
      <meta http-equiv="X-UA-Compatible" content="IE=8" />
   </head>
   <body>
      <h1>Titel</h1>
      <p>#seiteninhalt.</p>
   </body>
</html>

Das http-equiv-Attribut wird von IE8 mit dem besonderen Wert X-UA-Compatible problemlos geschluckt und das content-Attribut kann dann mehrere Werte besitzen:

IE5= Quellcode wird durch den Quirksmodus von IE7 angezeigt
IE7= Anzeige im Standardmodus OHNE Berücksichtigung des der DOCTYPE-Angabe
IE=EmulateIE7 Anzeige wie IE7, jedoch Berücksichtigung des DOCTYPE
IE=EmulateIE8 Ist im Quellcode eine standardkonforme DOCTYPE-Angabe, findet die Anzeige im IE8-Modus statt, wenn nicht Quirks-Modus IE5
IE=8 Standardanzeige für den IE8
IE=edge hier wird der IE8 angewiesen, den nhöchsten Modus zur verwenden, der zur Verfügung steht – empfehlenswert nur für Tests.
  1. Liegen keine Meta-Angaben zu X-UA-Compatible-Modus vor, sucht IE8 nach DOCTYPE-Angaben und versucht diese auszuwerten und schaltet in den IE8-Standard-Modus, andernfalls in den IE5-Modus.
  2. Benutzt man eine Meta-Angabe zum X-UA-Compatible wird die benutzerdefinierte Einstellung zur Kompatibilitätsansicht überschrieben.
  3. Wenn man die neuen CSS-Eigenschaften des IE8 nutzen will, muss die Seite im Modus IE8 gerendert werden, wie zum Beispiel durch Angabe eines Meta.-Elements.

Andere Möglichkeiten im X-UA-Compatible-Modus, um den nächstmöglichen Modus im IE8 auszuwählen wären folgende:
als IE5-Modus: <meta http-equiv=”X-UA-Compatible” content=”IE=foo”>
als IE7-Modus: <meta http-equiv=”X-UA-Compatible” content=”IE=7.5″>
als IE(-Modus: <meta http-equiv=”X-UA-Compatible” content=”IE=9″>

Natürlich kann auch mehrere Modi angeben und muss dabei die unterschiedlichen per Semikolon trennen: <meta http-equiv=”X-UA-Compatible” content=”IE=5; IE=8″>

Bedingte Kommentare (Conditional Comments)

Will man für den IE8 oder höhere einen Code mit bedingten Kommentaren schreiben geht man wie folgt vor: <!–[if gte IE 8]> … code oder Text …<![endif]–> und im IE7 so: [if gt IE 7]

JavaScript

Neu ist der documentMode als proprietäre eigenschaft des Document-Objekts – der zurückgelieferte Wert entspricht dem Dokumentkompatibilitätsmodus der Seite.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
var IE = null;
if (window.navigator.appName == "Microsoft Internet Explorer") {
   if (document.documentMode) {  
      // Internet Exploter 8
      IE = document.documentMode; // documentMode = 8
   } else {
      // Internet Explorer 5-7
      IE = 5; //setzt sozusagen den Quirks-Modus
      if (document.compatMode) {
         if (document.compatMode == "CSS1Compat")
            IE = 7; // IE7 Modus
         }
     }
   }
}

Die aus dem IE6 bekannte Eigenschaft compatMode wurde dem documentMode geopfert. Funktionieren tun sie ja noch im IE8, sollten aber um späteren Problemen aus dem Weg zu gehen abgeändert werden.

HTTP-Header

Meist ist es praktischer, für den gesamten Webauftritt den Dokumentkompatibilitätsmodus im IE8 einzuschalten und man sollte im Apache-Webserver folgende Änderungen im benutzerdefinierten Header vornehmen:
X-UA-Compatible: IE=EmulateIE7
Damit werden die Webseiten so dargestellt, wie es der IE7 tun würde. Im Apache 2.2 kann man auch das header-module für diese Zwecke laden – es muss aber sichergestellt sein, dass es geladen wird:
LoadModule headers_module modules/mod_headers.so
in der httpd.conf-Datei hinter den LoadModule-Zeilen einfügen:
Header set X-UA-Compatible “IE=EmulateIE7″
Wenn man genau steuern will, welche seiten in welchem Modus dargestellt werden sollen, kann man die einträge auch in <Location>, <Directory>,<Files> und <VirtualHost> wiederholen.

Websitecheck in verschiedenen IE-Versionen

Multiple IE: doch leider unterstützt Multiple IE noch nicht den IE8, zudem gibt es immer wieder ein paar kleine Darstellungsfehler zur Orginalversion z.b. IE6 (Unterstütze Versionen - IE3 IE4.01 IE5 IE5.5 and IE6).

Eine gute Alternative zu Multiple IE ist der IE Tester. Der zwar noch in der Alpha-Version vor liegt, aber dafür jetzt schon den IE8 unterstützt. Zudem arbeitet der IE-Tester sauberer als Multiple IE. Aber auch der IE-Tester stellt die Webseiten nicht immer so da wie es die Orgnialversion tun würde. Aber für schnelle Checks bei kleineren Änderungen kann ich beide Programme nur Empfehlen.

Wer 100% sicher gehen möchte kommt um eine virtual machine (Virtual PC) nicht drum rum. Der Nachteil ist nur das man bei der letzten Möglichkeit eine ältere Windows-Version benötigt. Ich empfehle hier Win2000 und/oder WinXP in Orginalversion, also ohne jegliche Sicherheitsupdates/patches und natürlich mit dem IE6. Denn wer heute noch mit dem IE6 surft hat entweder keine Rechte upzudaten (Arbeit) oder hat die Funktion deaktiviert und weiß vielleicht bis heute noch nicht das es einen IE7/ IE8 gibt :) .

written by Maik \\ tags: ,

Leave a Reply