Browser, die wenig oder schlechten CSS-Support bieten

(Auszug aus "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" von Rachel Andrew & Dan Shafer)

Während Browser ohne CSS-Unterstützung nicht groß beachtet werden müssen, sind solche mit einer eigenen oder fehlerhaften Unterstützung wesentlich problematischer. Die größten Schwierigkeiten auf diesem Gebiet hat Netscape Navigator Version 4 (Anmerkung: beim Netscape 4 meinen wir alle Versionen ab 4.0 bis 4.8) gemacht. In solchen Browsern kann es passieren, dass perfekt gestaltete und validierte Seiten so schlecht dargestellt werden, dass sie für den Benutzer unlesbar sind.

Viele Webdesigner ärgern sich nicht mehr über Netscape 4, weil sein Marktanteil inzwischen verschwindend klein geworden ist. Es ist jedoch möglich, die Unterstützung von CSS in Netscape 4 komplett abzuschalten, sodass seine Benutzer das gleiche Ergebnis zu sehen bekommen wie mit Browsern, die überhaupt kein CSS verstehen. (Anmerkung: Sie könnten Ihre Seite auch für Netscape 4 tauglich machen, aber damit wollen wir uns in diesem Buch nicht befassen.)

Stylesheets vor Netscape 4 verbergen

Es gibt zwei Methoden, um Netscape 4 gar nicht erst auf eine CSS-Datei zugreifen zu lassen. Beide Herangehensweisen bewirken, dass der Browser alle externen Stylesheets ignoriert und die Seite normal ausgibt.

Mit der @import-At-Regel

Im ersten Fall wird die CSS-At-Regel @import benutzt. Die »At-Regel« ist eine spezielle CSS-Direktive (oder ein Kommando, falls Sie das lieber mögen), beginnend mit einem @-Zeichen. Sie wird normalerweise in einem Dokument innerhalb von <style>-Tags benutzt, oder, weitaus seltener, in externen Stylesheets, die mit dem Dokument verlinkt sind. Netscape 4 kennt diese Befehle nicht und ignoriert sie.

Um beispielsweise das externe Stylesheet corpstyle.css mit einem Dokument zu verlinken, fügen wir die folgende Zeile im Seitenkopf ein:

<link rel="stylesheet" type="text/css" href="corpstyle.css"/>

Damit Netscape 4 das externe Stylesheet nicht erkennt, benutzen wir stattdessen ein eingebettetes, in dem wir das externe mit der @import-Regel referenzieren:

<style type="text/css">@import url(corpstyle.css);</style>

Beachten Sie, dass der Name der CSS-Datei das Argument des url-Operators ist.

Stylesheets vor dem Internet Explorer Version 4 verstecken
Zwar ist die CSS-Interpretation von Netscape 4 am weitesten vom CSS-Standard entfernt, aber die CSS-Implementation im Internet Explorer 4 ist nicht sehr viel besser. Auch hier können Sie mit der @import-Regel ein Stylesheet verbergen, allerdings ein bisschen anders:

<style type="text/css">@import "corpstyle.css";</style>

Mit dem media-Attribut

Die zweite Methode, um ein externes Stylesheet vor Netscape 4 zu verstecken, macht sich einen Fehler des Browsers bei der Interpretation des media-Attributs im <link>-Tag zunutze. Das media-Attribut ist zwar optional, wenn wir ihm jedoch einen anderen Wert als screen zuweisen, wird es von Netscape 4 ignoriert. So auch im folgenden Beispiel:

<link rel="stylesheet" type="text/css" href="corpstyle.css" media="all"/>

Normalerweise sollten Sie den Wert all als Wert für das media-Attribut angeben, wenn Sie beabsichtigen, dass Netscape 4 das Stylesheet ignoriert. Vielleicht ist es Ihnen lieber, als Wert screen oder auch print einzusetzen, damit erreichen Sie denselben Effekt.

Probleme erkennen und behandeln

Um die CSS-Elemente herauszufinden, die in älteren Browsern Probleme bereiten, geht fast kein Weg daran vorbei, eine Kompatibilitätsliste zur Hand zu nehmen und damit das Dokument nach fehlerhaften Attributen zu durchsuchen. Eine umfassende Referenz der CSS-Eigenschaften mit Hinweisen zur Browserkompatibilität finden Sie unter Referenz der CSS-Eigenschaften.

Schaut man sich dort die Anmerkungen zu Netscape 4 an, erkennt man schnell, womit dieser Browser Schwierigkeiten hat. Die wenigsten Übereinstimmungen mit dem Standard gibt es mit den folgenden Eigenschaften:

Andere, weniger offensichtliche Fehler gibt es reichlich. Werden relative Schriftgrößen verwendet, dann übernimmt Netscape 4 fälschlicherweise die Werte vom übergeordneten Element, anstatt die relative Schriftgröße zu benutzen (siehe Schriften einsetzen mit CSS).

Wie Sie sehen, bringt Netscape 4 große Probleme mit sich und es lohnt nicht, sich lange damit aufzuhalten und Energie in die Behebung der Fehler zu investieren, um Ihre Seite einigermaßen gut (aber nicht perfekt) in diesem fehlerhaften Browser anzuzeigen.

  

<< zurück vor >>

 

 

 

Tipp der data2type-Redaktion:
Zum Thema CSS bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an:

Copyright © 2006 der deutschen Übersetzung dpunkt.verlag GmbH
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "CSS − Anspruchsvolle Websites mit Cascading Stylesheets" denselben Bestimmungen, wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.

dpunkt.verlag GmbH, Ringstraße 19, 69115 Heidelberg