Sprung (zurück) zu: Gestaltung (Übersicht)

Defektes Auto ohne Rückruf – der Internet Explorer (IE)

Elchtest für Browser?

Die bemerkenswerte Fahrtüchtigkeit eines schwedischen Autofahrers im Jahr 1997 ist Ihnen bekannt? Mit bummelig 80 km⁄h und einem Schlenker links und wieder rechts ein modernes Automobil aufs Dach hinzulegen – wie eine Schildkröte auf ihren Panzer – ist ein beliebter und durchaus praxisnaher Test, um die Fahrstabilität eines Fahrzeugs zu überprüfen. Dies bedarf schon einer gewissen Fahrtüchtigkeit und ist insoweit praxisnah, weil es Elche und anderes in freier Wildbahn gibt, dem auszuweichen den Autofahrern mitunter ratsam erscheint.
Nun ja, im Laufe der Jahre bestanden diverse moderne Automobile diesen standardisierten Elch-Text[1] nicht – und parkten entsprechend unsanft. Der Elch-Test – oder Kindertest, wie es ursprünglich hieß – ist ein guter Test, erhöht er doch die Fahrsicherheit. Und er brachte so manchen Automobilkonzern in die Pflicht: Rückrufaktion und Nachrüstung (etwa durch ESP)!
Wovor man auch immer im Straßenverkehr ausweicht: auf dem Dach landen sollte man dabei halt nicht! Und welche Automarke auch immer beim Elch-Test doch auf dem Dach landet: die Kosten und die Arbeit einer angemessen Nachrüstung liegt – bitte schön! – beim jeweiligen Autokonzern. Dies gilt insbesondere dann, wenn deren Vehikel auf öffentlichen Wegen schon längst unterwegs sind. Die Konzerne müssen dann zusehen, dass ihr (guter) Ruf wieder hergestellt wird. Und niemand sonst!

Eigentlich alles ganz einfach und selbstverständlich. Verantwortung für das eigene Produkt.

Und was hat das alles mit den Darstellungsprogrammen von Internetseiten auf Ihrem Computerbildschirm zu Hause zu tun, sprich mit dem Browser, den Sie nutzen?
Datenverkehr im Internet und der Straßenverkehr ist in vielerlei Hinsicht dasselbe! Es gibt Standards hier wie da, die eingehalten sein wollen. – So weit die holde Theorie!

Im World Wide Web gibt das World Wide Web Consortium (W3C) die Standards für den Datenverkehr im Internet vor: Sozusagen die Kriterien für diesen und jenen Elch-Test für eine gewisse Stabilität des WWW[2] Wer diese Tests nicht besteht, rüstet sein fehlerhaftes Produkt nach; ist das Produkt schon auf dem Markt, wird eine Rückrufaktion auf eigene Kosten gestartet und … Ach, wäre es mal so!

Die Lebenswege des Internets sind dann doch ganz andere als die Lebenswege umgekippter Automobile.

Ein Szenario aus der virtuellen Welt: Verkaufe Schrott (lies: ein mangelhaftes Produkt, aktualisierter: Sondermüll), überlasse die Nachrüstung anderen und verdiene Geld, sehr viel Geld, das Du wieder für Werbung einsetzen kannst, um noch mehr Schrott zu verkaufen. Kennen Sie nicht? Gibt es nicht? Aber ja, insofern Sie zum Beispiel einen Browser – bevorzugt der älteren Kategorie – nutzen, um diese Zeilen zu lesen, nutzen Sie möglicherweise genau diesen Schrott eines Konzerns, der sich seit Anbeginn des Internet-Zeitalters darauf verlässt, dass ein hoher Marktanteil (also: das eigene Produkt in möglichst vielen guten Stuben und Büros weltweit) schon dafür sorgen wird, dass andere ausbügeln, was er selbst verbockt hat: Was interessieren mich die Empfehlungen eines W3C!
Diese Haltung dieses Schrottproduzenten ist konsequent, durchzieht die Produktreihe und ist vergleichbar, als ob ein Autokonzern beschließt – ebenfalls gut situiert auf dem weltweiten Markt – ein mangelhaftes Fahrzeug und seine Folgemodelle auf dem Markt zu belassen: Sollen sich doch die freien Werkstätten und Verkaufshäuser um die Nachrüstungen kümmern! Elch-Tests? Pah! Diese blöden Standards … notfalls mach’ ich mir meine eigenen … ohnehin, sollten wir nicht alle fehlertolerant sein?
(FÜr »InSideeer«: Quirks, Quarks, Quorks.)

Der Internet Explorer ist der Browser, der am weitesten von allen Standards entfernt ist …

… und dennoch wird er beworben, verkauft und gekauft wie »frisches Brot«[3] Ignoriert man einmal das sich eher selbst offenbarende IE-Team, kümmert sich aber nicht der Konzern – in diesem Fall Microsoft – um das Fehlerhafte seines Produkts. Es sind im Kern andere, die sich kümmern: Ein Heer von Webseiten-Machern, von Menschen also, die davon leben, im Auftrag dritter Webseiten zu schreiben, damit Sie etwas auf dem heimischen Bildschirm zu sehen bekommen. Eine undankbare Aufgabe hat diese Zunft! Die Standards verbiegen für den Schrott, den ein Konzern werbestrategisch geschickt ins Netz, sprich ins WWW schmeißt.

Dass der IE einen solchen Markt von Elch-Testern erschaffen hat, somit wohlmöglich einen Arbeitsplatz für den einen oder anderen, versöhnt nicht! Die wahrlich Zeit, Nerven und Geld raubende Arbeit, die Standards derart umzuschreiben, dass auch der blödeste IE sie versteht, mag man anhand folgender Links selbst ermitteln. Diese Handvoll Links geben einen winzigen Einblick in diese einzigartigen Mühen. Nochmals:

In Eigenleistung wird ein mangelhaftes Produkt eines Konzerns fit gemacht für den Gebrauch Dritter, nämlich für all jene, die das World Wide Web mit diesem IE nutzen wollen.

Die Links:

Bugs in MSIE7. Eine stattliche Ansammlung von sogenannten Bugs allein der Version IE7.
Wer das nicht lesen mag (was jeder versteht!), schaue wenigstens auf die Bilder: traurig-schöner Galgenhumor all derer, die es lesen müssen.[4]

Wer es lieber farbig mag: CSS contents and browser compatibility. Ein Vergleich der IE-Versionen mit anderen Browsern bezüglich der Umsetzung standardisierter CSS-Deklarationen. Die sorgen dafür, dass Webseiten hübsch daherkommen. Was der IE im Vergleich zu seinen Kollegen alles nicht kann, sieht man dort sogleich, selbst wenn man keine Ahnung hat, was im einzelnen gemeint ist.
Anders gesagt: Schöne Webseiten verdanken Sie nicht (niemals und nie!) dem IE (insofern Sie diesen Browser nutzen).

Ein virtuelles Programm, eigens für die Überprüfung, wie die nach den Standards zusammengebauten Webseiten wohl von den IE-Varianten dargestellt werden dürften: netrenderer.de. Mit entsprechenden Hinweisen, was dann extra für den IE noch alles zu tun ist.
Muss eine Heidenarbeit gemacht haben, dieses Programm zu schreiben …

Der Eindruck, bei dem »IE« handelt es sich um ein Schrott-Automobil ohne Rückruf, verfestigt sich, wenn die gesamte Firmenpolitik von »Microsoft« mit in die Betrachtung fällt. Einblicke hinsichtlich Datenschutz und »proprietären« Ideen finden Sie unter: Im Kontext – meine Arbeitsumgebung.

Wer es gar nicht so genau wissen will …

… gebe in seiner Suchmaschine nur dies ein: Bugs IE. Er kapituliert ohnehin vor den (in 0,31 Sekunden) angebotenen Einträgen: Ungefähr 32.600.000 Ergebnisse. Vielleicht gelten nicht alle diese Ergebnisse dem IE, vielleicht nur die erste Millionen … weiß der Himmel, auch schon egal. Bugs icab liefert (in 0,33 Sekunden) Ungefähr 175.000 Ergebnisse. Offenbar stutzt über diese Differenz selbst die Suchmaschine (für exakt 0,02 Sekunden).
Na ja, es mag ja sein, dass dieser Vergleich IE – icab selbst mit erblindeten Augen hinkt. Jedoch: Es lohnt, die diversen Browser auf dem freien Markt zu vergleichen (auch und zumal für diejenigen, die sich nicht mit dem Zusammenbau von Webseiten beschäftigen müssen, weil sie weder Brot noch Haus davon bezahlen. Ich bezahle dergleichen durch den Verkauf meiner Rosen, habe aber diese Webseiten selbst geschrieben und kann Ihnen sagen, wenn ich vorher auch nur geahnt hätte, was auf mich zukommt …).
Jetzt aber Schluss! – Nur noch dies:

Einen schönen Tag

… für die Nutzer des IE?

Klar, in noch anzupassenden Farben. Will hier aber nicht übertreiben …

Mein Geschmack wäre es – wenngleich fern jeglicher Realität:

Ignoriert den IE, Ihr Webseiten-Macher und Web-Designer der Welt; und vereinigt Euch!

Schützt die Nutzer (neudeutsch User, Client, Surfer) und lasst diesen Browser auf sein virtuelles Dach landen (krachen, bumsen)! Schreibt konsequent auf Euern Seiten:

Standards eingehalten! Sie sehen aber nur diesen Satz, sonst nichts? Sie nutzen also einen IE? Dann beschweren Sie sich bitte bei ‘Microsoft Windows …’

(optional: … und beschweren Sie sich bitte nicht beim Inhaber dieser Seiten, der kann am wenigsten dafür, aber auch nicht bei uns, den freien Werkstätten, die diese Seiten ordentlich geschrieben … und im Validator des W3C … alle Elch-Tests erfolgreich bestanden haben …)

… Einen schönen Tag!

(optional aber ziemlich freundlich und nützlich: Tipps, wie Sie einen anderen Browser herunterladen …
Und das Ganze schreibe man mit der einfachsten HTML[5]

Für alle, die Details lieben

… eine Fussnote zu der voran stehenden Fussnote Nr. 4:

Der Quell-Text (der eigentliche Inhalt der Website) wird geschrieben in HTML, dessen Gestaltung (Farben zum Beispiel) erfolgt per CSS.

[Infobox] HTML
[Infobox] CSS

Im Grunde ist der Aufbau einer Webseite einfach: Inhalt in HTML geschrieben, das Geschriebene schmuck gemacht mittels CSS. Leider nicht für den IE: Er will als Drittes jene besonderen Anweisungen, welche von anderen Browsern (kopfschüttelnd) ignoriert werden.

Wie so eine Anweisung aussieht? Ein Beispiel ist angesagt! Sie müssen es nicht verstehen, ich verstehe es auch nicht; es zeigt aber für jedermann anschaulich, wie umfangreich und erfindungsreich zugleich diese Conditional Comment sind, die nur einen Zweck verfolgen, einem Browser beizubringen, was andere Browser gelassen und standardkonform können:

Eine horizontale Anordnung von Bildern gefällig? Dies geht zum Beispiel ganz einfach über die CSS-Anweisung: display: inline-block;. Browser stellen die untereinander geordneten Bilder nun in einer Reihe aufgelistet da. Anweisung fertig! Nicht jedoch für den IE7 und kleiner. Er bedarf Hilfe allein für diese eine CSS-Anweisung; diese besondere Anweisung für den IE sieht dann z.B. für eine schmucke Bildergalerie so aus:

/*Conditional Comment für die Varianten des IE kleiner als Variante 8*/ <!--[if lt IE 8]><style> .galerie li { width: 201px; w\idth: 199px; display: inline; } .galerie { _height: 0; zoom: 1; display: inline; } .galerie li .wrimg { display: block; width: auto; height: auto; } .galerie .wrimg span { vertical-align: middle; height: 199px; zoom: 1; } </style><![endif]-->

Eine geniale Konstruktion (für den IE) von www.brunildo.org.

Es ist jedoch nur der Conditional Comment! Die dazugehörigen CSS-Anweisungen, die das Layout der Bildergalerie letzten Endes definieren, kommen hinzu und sind nicht weniger kompliziert, weil gleichfalls abgestimmt auf diesen einen Browser, den IE. Die CSS-Anweisungen seien (mit meinen damaligen Kommentaren) einfach aufgeführt, damit man einen Vergleich zu der anschließend unten stehenden Anweisung hat und auch einen Eindruck von der Arbeit bekommt, die der IE (exemplarisch nur für diese eine Bildergalerie!) macht:

/*Die Gestaltung des HTML-Textes per CSS, abgestimmt auf den IE*/ .galerie { text-align: center; padding-top: .25em; margin-top: 5%; } .galerie li { /*display: inline;*/ /*-moz-inline-box; Warnung: nicht erlaubt CSS3 Mozilla, nicht aktuell!*/ display: inline-block; /*macht PROBLEME IE6, 7*/ /*\*/ vertical-align: top; /**/ /*middle — Geschmackssache*/ margin: 0 .125em 1em; /*border: 1px solid transparent;*/ padding: 0; } /*a statt div und gewendet, Selektor ungültig (Regelsatz ignoriert)*/ .galerie li>div { /*\*/ display: table; /**/ width: 199px; } /*\*/ .galerie>li .wrimg { display: table-cell; vertical-align: middle; width: 199px; height: 199px; } /**/ .galerie img { vertical-align: middle; } .galerie a:link, .galerie a:visited { text-decoration: none; border: 1px dotted transparent; cursor: pointer; display: block; } .galerie a:visited { display: block; } .galerie a:focus, .galerie a:hover {border: 1px dotted #ddd;} /*\*//*/ [*] html .galerie li .wrimg { display: block; font-size: 1px; } [*] html .galerie .wrimg span { display: inline-block; vertical-align: middle; height: 199px; width: 1px; } /**/ /*ob das mal alles gut geht*/

Nun noch etwas Style für den Text unterhalb der einzelnen Bilder:

.galerie .bildertext { font-size: 95%; line-height: 1.6em; width: 189px; /[*] w\idth: 189px;*/ /[*] Moz, IE6 */ padding: 0 5px .3em; display: block; }

Dies alles – der Conditional Comment wie das CSS – ist insgesamt wahrlich ziemlich kompliziert – und eigentlich unnötig [die knackige CSS-Variante wäre OHNE Conditional Comment und in etwa: .galerie li {width: (in %, em oder px); display: inline-block; vertical-align: middle;} + etwas Abstand hier, etwas Farbe dort. Gut ist.].

Leider ist die Schreibweise in HTML (der zugrundeliegende Quell-Text) für die IE-Bildergalerie notgedrungen auch unnötig kompliziert.

Ein Unding, dass dieser Browser durch seine Macken sogar Einfluss auf das Verfassen des Quell-Textes nimmt.

Wer diese HTML dazu auch noch im Vergleich sehen will: es ist die Variante für IE7 (oder kleiner) allein für die Darstellung von zwei Bildern in Reihe auf Ihrem Bildschirm zuhause. Nötig hierfür sind: 3 Klassen (class), 3 Blockelemente (ul, li, div), 4 Inline-Elemente (4 x span) + das Bild (img), das ich zwecks Verdeutlichung rosa hinterlegt habe:

<!-- Die nackte, ungeschmückte Galerie in HTML, geschrieben für IE7 oder kleiner --> <ul class="galerie" ><li><div><span><span class="wrimg"><span></span><img src="/…/…/bild-quelle.jpg" alt="Alternativ-Text" width="160" height="120" /> </span><span class="bildertext">Text.</span></span></div></li ><li><div><span><span class="wrimg"><span></span><img src="/…/…/bild-quelle2.jpg" alt="Alternativ-Text 2" width="160" height="120" /> </span><span class="bildertext">Text 2.</span></span></div></li> </ul>

Die folgende HTML-Zeile reicht indessen für den knackigen CSS-Code (ohne Conditional Comment) und ist bummelig halb so lang; nötig hierfür sind 1 Klasse, 2 Blockelemente, (und optional 1 Inline-Element) + das Bild, also deutlich weniger und alles klarer:

<ul class="galerie" ><li><img src="/…/…/bild-quelle.jpg" alt="Alternativ-Text" width="160" height="120" /> (<span>)Text.(</span>)<li ><li><img src="/…/…/bild-quelle2.jpg" alt="Alternativ-Text 2" width="160" height="120" /> Text 2.<li> </ul>

Das Ergebnis ist in beiden Fällen dasselbe: Sie sehen zwei Bilder nebeneinander in Reihe mit je etwas Text darunter. – Was will man noch weiter dazu sagen!

Ach, da fällt mir doch noch etwas ein: display: inline-block; gilt als Standard – nur halt nicht für den IE. – Was glauben Sie, was ich an Arbeitsaufwand hatte, um diesen ganzen Kram halbwegs zu verstehen, nur um zu der Erkenntnis zu kommen: TOLL! Herr Brunildo! Ich mach’s aber so nicht! Pfeifen wir einmal mehr auf diesen IE! Wer nichts kann und über Generationen auch nichts lernt, verdient sich keine Krücken! Punkt.


5. Wenn man sich diese Farce eines Konzerns vergegenwärtigt, der sich neuerdings damit rühmt, den Marktanteil des eigenen, mangelhaften IE6 selbstlos unter 1% gebracht zu haben, bekommt man, insofern man sich die millionenschwere Werbung für diesen IE6 in Erinnerung ruft, über diese werbestrategische Arroganz eines Nimmersatts das zarte Gefühl eines Erbrechens: Microsoft Watch Blog.
Es liest sich in etwa so: Wir, der Autokonzern XY, loben uns selbst, weil wir es geschafft haben, den Marktanteil unseres fahruntüchtigen Vehikels unter so-und-so-viel-% gebracht zu haben. Nun brauchen sich die freien Werkstätten nicht mehr darum zu kümmern, dass die Nutzer unseres Vehikels nicht verunfallen. – Lasst uns (?!) feiern …!
Es lässt freilich hoffen, dass dieses selbstlose Engagement sich ausdehnt auf den IE7, IE8

zurück zum Textabsatz

Es ist keine Alternative, den IE zu ignorieren, ihn also nicht zu unterstützen. Es ist aber auch keine Alternative, es zu tun. Es ist ein Dilemma.