Übeltäter Rendering Engine?

Das hilft bei Rendering-Problemen im Internet Explorer 11

Viele Webentwickler sind nicht gerade der größte Fan vom Internet Explorer – und zwar oft, weil sie immer wieder neue Merkwürdigkeiten auf im IE gerenderten Seiten finden, die sie sich nicht oder nur mit Mühe erklären können. Denn oft helfen die F12 Entwickler-Tools nur bedingt, gerade, wenn die Fehlermeldung den Entwickler in die völlig falsche Richtung schicken will.

So einen Fall beschreibt Yan Yong auch in einem Blogpost und erklärt, wie man am besten mit Rendering-Problemen im Internet Explorer 11 umgeht.

Internet Explorer 11 nutzt Kompatibilitätsmodus

Gibt es ein Problem mit einer im Internet Explorer gerenderten Seite, liegt meist die Vermutung nah, dass JavaScript irgendwo ein Problem verursacht. Selbst wenn die Seite in einem anderen Browser (zum Beispiel einem Webkit-Browser) fehlerfrei aussieht, heißt das nicht, dass sich nicht irgendwo ein JavaScript-Fehler versteckt, der im IE 11 Schwierigkeiten macht.

Wer jetzt denkt, dass das Überprüfen mit den F12-Entwicklertools des Internet Explorers und das Fixen möglicher JavaScript-Probleme des Rätsels Lösung ist, könnte trotzdem falsch liegen. Bei der mit Drupal erstellen Seite, die Yan Yong im genannten Beispiel nutzt, ist nämlich nicht die JavaScript-Datei der Problemverursacher – sondern der Kompatibilitätsmodus des IE 11.

In manchen Fällen nutzt der Internet Explorer nämlich den Kompatibilitätsmodus, der nur über schlechten CSS- und JavaScript-Support verfügt und auf der alten Rendering Engine Trident aufbaut. Gedacht ist er dazu, die Abwärtskompatibilität für Legacy-Seiten sicherzustellen, während der neue Microsoft-Browser Edge über allerhand neue Features sowie einen deutlich besseren JavaScript-Support verfügt.

Welche Rendering Engine nutzt der IE?

Darum sollte man bei Rendering-Problemen im Internet Explorer immer auch überprüfen, welche Engine der Browser nutzt und im Zweifelsfall zur neuen Edge-Engine wechseln, die für ein schnelleres und fehlerfreieres Rendering sorgen soll.

Dafür nennt Yan Yong verschiedene – zum Teil Drupal-spezifische – Methoden. So kann zum Beispiel ein X-UA-kompatibles IE-Edge-Feld in der HTTP-Header-Response gesendet oder die Drupal-HTML5-Tools genutzt werden. Genauso kann ein Meta-Tag im HTML-Source-Header-Bereich eingefügt werden. Allerdings sollte man dabei beachten, dass es in manchen Fällen trotzdem vom Browser ignoriert wird; eine andere Variante ist dann vorzuziehen.

Aufmacherbild: 3D rendering of white cubes. Sci-fi background. Abstract sphere in empty space. Futuristic shape. von Shutterstock / Urheberrecht: VAlex