Fehlerursache
Ursache ist ein Metatag, dessen Bedeutung kaum bekannt ist, dass aber immer wieder auftaucht – vor allem in gekauften Themes für Content Management Systemen von WordPress über Drupal bis zu Joomla.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
Das Metatag diente zwei Zwecken:
- IE=edge:
- besagt, dass IE im höchsten verfügbaren Modus laufen soll – im Gegensatz zum Kompatibilitätsmodus. IE8 beherrscht aber natürlich nur IE-Modi, IE9 nur IE9-Modi.
- chrome=1:
- ist die Anweisung, den Google Chrome-Frame zu starten, wenn es beim Benutzer installiert ist.
Das IE=edge-Flag war für IE10 und ältere Versionen von Internet Explorer relevant. In IE11 ist dieser Modus per se als Vorgabe gesetzt.
Und das Chrome-Flag? Kann man stehen lassen für die letzten Benutzer, die mit IE10 und älter surfen und den Chrome-Frame installiert haben. Wie viele mögen das sein? Das letzte Update war 2014, aber die letzte Version steht tatsächlich immer noch für den Download zur Verfügung.
Korrekter wäre es, chrome=1 zu entfernen, aber dann würde der Chrome-Frame nicht aktiviert, auch wenn er installiert ist. Auf alle anderen Browser hat chrome=1 keinerlei Wirkung.
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
Und das Metatag direkt unter das head-Tag setzen …
Selbst das ist überflüssig, denn der vereinfachte HTML5 Doctype (<DOCTYPE html>) aktivierte den Standards-Modus in IE sowieso.
Hinweis auf moderne Browser
Besser wäre es natürlich, die letzten Besucher mit antiken Browser um ein Update zu bitten, aber selbst die Conditional Comments für die alten Schätzchen sind heute in Vergessenheit geraten. Conditional Comments sind HTML-Kommentare, die nur von Internet Explorer ab IE5 bis einschließlich Version 9 interpretiert wurden.
<!--[if (IE 8)|(IE 9)]> <p> Dieser Browser ist veraltet. Wie wäre es mit einem Update auf einen zeitgemäßen Browser? </p> <![endif]-->
Sie verbergen oder laden CSS-Daten, aber auch HTML oder Javascript vor vorsintflutlichen IE-Version oder beschränken HTML-Tags auf IE.
Mehr zu Metatags
- meta name=“viewport“ – so wichtig für die mobilen Geräte
- Das HTML meta-Tag und seine Attribute – meta character set, meta description, meta robots und mehr …
- HTML doctype, head und body Grundgerüst für HTML-Seiten – Seitenkopf (head), Seitenkörper (body)
Externe Quellen
- Was ist der Unterschied, wenn eine Webseite mit http-equiv=“X-UA-Compatible“ beginnt vs ohne?
- Chromium Blog Retiring Chrome Frame Thursday, June 13, 2013