Unerwartet viel Gegenwind bekam ich für meinen Artikel Warum target="_blank" nervt und verboten gehört. Ich dachte, ich würde damit offene Türen einrennen, doch anscheinend werden neue Fenster erzwingende Links (und die Menschen die sie mögen) so bald nicht aussterben. Deswegen mein Appell: Wenn target="_blank" schon sein muss, sollten solche Links gekennzeichnet werden! Dieser Artikel erklärt, wie das mittels CSS ohne zusätzliches Markup sogar im Internet Explorer zu bewerkstelligen ist.

Wie man es nicht machen sollte

Die naheliegendste Lösung wäre es, allen Links mit target="_blank" eine Klasse zu verpassen und über diese per CSS zu gestalten. Das hätte den Nachteil, dass dabei zusätzlicher HTML-Code anfiele, den diese Lappalie eigentlich nicht wert ist. Auch dürfte es nicht immer einfach sein, eine Extra-Klasse zu implementieren, gerade wenn man die Markierung nachrüsten will.

Angriff der CSS32-Selektoren

Mit den schicken neuen Selektoren von CSS32 (danke Greg!) kann man HTML-Elemente anhand beliebiger Attribute auswählen. Damit wird das Markieren von Links mit target="_blank" zur Fingerübung:

a[target=_blank] {
    background:yellow;
}

Wenn man weiß, dass man nie Links haben wird, deren target-Attribut etwas anderes als _blank ist (was außerhalb von Framesets die Regel sein dürfte), kann man auch einfach alle Links mit target-Attribut markieren:

a[target] {
    background:yellow;
}

Mit der Unterstützung für diese Attribut-Selektoren sieht es ausgesprochen gut aus. Alle gängigen Browser kommen mit diesem Teil von CSS32 klar... wie erwartet mit einer Ausnahme.

Der Internet Explorer 6

Der IE6 kann mit element[attribut] nichts anfangen. Möchte man trotzdem bequem Links mit target="_blank" zu markieren, kann man Javascript zu Felde führen. Einfacher macht man es sich in diesem Falle aber mit einer proprietären IE-Spezialität. Die so genannten Dynamic Properties sind eine reichlich perverse Geschichte, denn sie ermöglichen nicht weniger als Scripting in Stylesheets. So ist es natürlich ausgesprochen einfach, a[target] { background:yellow; } für den Internet Explorer zu simulieren.

<!--[if lt IE 7]>
    <style type="text/css" media="screen">
        a {
            background: expression((this.target) ? 'yellow' : 'none');
        }
    </style>
<![endif]-->

Das ist vom Standpunkt des Webstandards-Advokaten aus absolut kriminell, funktioniert aber, wie diese Demoseite zeigt prächtig und ist dabei ausgesprochen handlich.

Fazit

Mit nur wenigen Zeilen CSS (und etwas perversem IE-only-Code) lassen sich Links, die das nicht unstrittige target="_blank" in sich tragen, gesondert auszeichnen. Das sollte man meiner Meinung nach auch dringend tun, denn nur so kann ein Nutzer wissen, ob ihn ein neues Fenster erwartet oder nicht.

Ich bleibe freilich bei meiner Meinung, dass Links, die ein neues Fenster erzeugen, aus den im vorherigen Artikel genannten Gründen eine Seuche sind. Wenn man target="_blank" denn unbedingt benutzen muss, dann doch bitte so.