Browserweichen für IE6, IE7...
Eine auf Conditional-Comments basierende – versionsgesteuerte – Browserweiche für IE7 oder andere Versionen des Internet Explorer kann browserspezifischen CSS- oder HTML-Code für die jeweilige Browserversion definieren. Hierdurch hat der Webentwickler einen recht eleganten Mechanismus auf vorhandene Besonderheiten einzelner Browser einzugehen. Auch die Übersichtlichkeit der Quellen wird verbessert, so dass die spätere Weiterentwicklung und Betreuung der Homepage erleichtert wird.
Geht man auf die einzelnen Browserversionen ein, so funktioniert die einfachste Unterscheidung auf Basis der Major-Version des Internet Explorers. Hier müssen keine weiteren Operatoren angegeben werden, da eine IF-Abfrage der Form IE 8 gleichbedeutend mit IE == 8 ist. Folgendes Beispiel enthält die dafür nötigen Zeilen:
<span>Browserweiche für IE7!</span>
<![endif]-->
<!--[if IE 8]>
<p>Erkennt IE8!</p>
<![endif]-->
Hier wird – in Abhängigkeit der IE-Version ein HTML-Element mit entsprechendem Textinhalt angegeben. In „IE” ist bei Internet Explorern die Browserversion abgelegt. Der Inhalt dieser Variablen wird durch den IE automatisch mit ihrer Versionsnummer gefüllt. Auf Basis dieser Angabe erfolgt die Fallunterscheidung. Der Inhalt der Codeblöcke aller zutreffenden Fälle wird letztlich in das HTML-Dokument übernommen, während die anderen verworfen werden. Auch können mehrere zutreffende Abfragen hintereinander notiert werden, die jeweils einen eigenen CSS- oder HTML-Block enthalten. In nächsten Code-Abschnitt werden die Operatoren zur Unterscheidung angewandt.
<p>Browserversion unterhalb IE7</p>
<![endif]-->
<!--[if gt IE 7]>
<p>Browser in Versionen oberhalb von IE7</p>
<![endif]-->
<!--[if gte IE 6]>
<p>Browserweiche für IE6 oder größer!</p>
<![endif]-->
<!--[if lte IE 6]>
<p>Browserweiche für IE6 oder kleiner!</p>
<![endif]-->
Neben diesen Varianten zu den Vergleichsoperatoren ist auch eine Klammerung sowie eine logische Verknüpfung einzelner Bedingungen umsetzbar. Im nächsten Beispiel sollen die logischen Operatoren und die Negation demonstriert werden.
<p>Browserweiche für nicht IE7!</p>
<![endif]-->
<!--[if (gt IE 5) & !(IE 8)]>
<p>Größer als IE5 aber nicht IE8</p>
<![endif]-->
<!--[if (IE 6) | (IE 8)]>
<p>Browserweichen für IE6 oder IE8</p>
<![endif]-->
Die hier aufgeführten Varianten schlagen an, wenn der jeweils angegebene Ausdruck zur Prüfung der Bedingungen den Werte „True” liefert. Innerhalb des jeweiligen Bedingungsblocks steht die Voraussetzung, unter der das zugehörige P-Tag ausgegeben wird. Eine Schachtelung von Conditional-Comments ist übrigens nicht vorgesehen. Allerdings dürfte es dadurch ohnehin nicht zu bedeutenden Performance-Steigerungen bei deren Verarbeitung kommen.
Durch diesen Mechanismus kann zumindest auf die Eigenarten des IE gezielt eingegangen werden. Einen Else-Teil gibt es hier übrigens nicht: Aufgrund der Tatsache, dass Conditional-Comments nur durch IEs verarbeitet werden, würde das ohnehin nicht funktionieren, da alle anderen Browser diese Angaben ohnehin ignorierten. Schade eigentlich, denn gerade bei im Stylesheet eingebetteten Base64-kodierten Bilddaten wäre das sehr praktisch. Der IE könnte dann einen Style ohne integriertes Bildmaterial laden. In derartigen Anwendungsfällen muss man leider per Default das größere Stylsheet laden und in Kauf nehmen, dass die Bildinformationen umsonst übertragen wurden, da der IE nichts mit ihnen anzufangen weiss. Alternativ kann hier eine serverseitige Browserweiche zum Einsatz kommen, was die negativen Effekte auf den Download-Traffic zumindest minimiert.