Blog

Vor einigen Tagen installierte ich mir den neu erschienenen Internet Explorer Version 9. Die Freude darüber, dass viele der CSS3 und HTML5 Features von meinen Seiten funktionierten, verblasste schnell, als eine Seite überhaupt nicht angezeigt wurde. Es schien als dass der Browser die Seite zwar lud, aber nicht rendert. Die Seite blieb weiß oder die davor angezeigte Seite blieb stehen. In den Entwicklertools wurde allerdings der richtige Quellcode angezeigt.

Nach einigen Tests stellte sich heraus, dass dieser CSS Code das Problem auslöste:

h1 {
  font-family: Helvetica, Arial, sans-serif;
}

Es scheint, dass der IE9 Schriften, die nicht im System installiert sind, nicht ignoriert und dadurch die Seite nicht darstellen kann. Normalerweise wird einfach die nächste im System installierte verwendet.

Die Lösung war die Reihenfolge der Schriften zu verändern. Danach wurde die Seite wieder korrekt dargestellt.

h1 {
  font-family: Arial, Helvetica, sans-serif;
}

Update: Bei einer meiner anderen Webseiten die ich betreue, stieß ich auf ein weiteres Problem. Hier löste folgender Code das gleiche Phänomen aus:

body {
  font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

Eine kleine Modifikation und die Seite wurde wieder angezeigt:

body {
  font-family: "Trebuchet MS", Trebuchet, Verdana, Arial, sans-serif;
}