Webkrauts

Wir haben noch nicht alle älteren Artikel nachbearbeitet. Das bezieht sich in der Regel nur auf die Codebeispiele, die noch nicht optimal dargestellt werden.

»Maßgebend is auf’n Platz!« – Teil VII

Höhentrainingslager in der 2. Liga: Können Greuther Fürth, der SC Paderborn und Carl Zeiss Jena von dieser Maßnahme profitieren?

Zum Saisonstart widmen sich die Webkrauts den Internetauftritten aller 36 Bundesligavereine und testen sie auf moderne Webstandards. Punkte werden heute an die Webseiten von Greuther Fürth, SC Paderborn und Carl Zeiss Jena vergeben.

Greuther Fürth

Der erste Eindruck: Die Webseite von Greuther Fürth kommt übersichtlich und aufgeräumt daher, die Schriftgröße ist lesbar, es wurden keine Layouttabellen verwendet und sie validiert. Nicht schlecht. Aber schon nach kurzer Zeit fällt etwas immens negativ auf: Im Kopfbereich befindet sich die horizontale Hauptnavigation in Form von Reitern, die beim Darüberfahren mit der Maus ihre jeweiligen Unterpunkte zum Vorschein bringen. Das stört vor allem wenn man z.B. mit der Maus die knapp darüber liegende zweite Navigation ansteuern will oder eine der Browserfunktionen erreichen möchte. Abstellen kann man das Verhalten nur durch das Ausstellen von JavaScript. Dann allerdings fehlt die Hauptnavigation komplett – und man kann keinen der Reiter mehr erreichen. Auch als Tastaturbenutzer ist man aufgeschmissen. Insgesamt ist die Navigation ein echter Schwachpunkt. Die Schriftvergrößerung macht das Navigieren schwierig, da viele Punkte abgeschnitten werden und nicht mehr lesbar sind.

Auf Semantik wurde kein besonderer Wert gelegt. Hin und wieder entdeckt man eine Liste, einen Text oder eine Überschrift, bei der das passende HTML-Element benutzt wurde. Aber das scheint mehr Zufall als Planung zu sein. So wurde bei Überschriften fast ausnahmslos auf <hx>-Elemente verzichtet. Wenn sie dann auf einer Seite plötzlich doch zu finden sind, wurde für alle Überschriften einheitlich <h1> vergeben – schade.

Ein paar andere Auffälligkeiten: Es gibt keine Links um Teile der Seite direkt anzuspringen, die Überschriften von Anreißern sind nicht verlinkt und die Kennzeichnung von Links geschieht nur über Farbe (die aber auch an anderen Stellen, z.B. für Überschriften verwendet wird). Zudem werden besuchte Links nicht als solche gekennzeichnet, Tabellenköpfe usw. fehlen und das alt-Attribut wurde nur sehr sparsam eingesetzt, an manchen Stellen auch komplett weggelassen. Das Fazit: Verbesserungswürdig.

Kommentator: Michael Bielitza

SC Paderborn

Gerade nachdem der Bericht über die Webseite des Zweitligisten SC Paderborn fertiggestellt war, hat man ein Redesign veröffentlicht, das eine Neubetrachtung nötig machte. Weiterhin strahlt die gesamte Seite in Blau auf einem Hintergrund mit Farbverlauf. Im rechten oberen Bereich werden wechselnde Bilder als Eye-Catcher gezeigt und der aktuelle Stand der Liga-Tabelle kann mit einem Klick eingeblendet werden – allerdings nur bei aktiviertem JavaScript.

In der Navigation, die semantisch korrekt als Liste ausgezeichnet ist, sind ohne JavaScript nur die Punkte der ersten Ebene zu erreichen. Die zweite Ebene versteckt sich in einer separaten zweiten Liste, ohne Verknüpfung zu den Punkten der ersten Liste. Das leider existierende Frameset wird nur genutzt, um einen ständig sichtbaren Werbebereich im unteren Seitenteil zu halten. Der <noframes>-Bereich ist nicht gepflegt und erschwert so Geräten, die Frames nicht nutzen können, den Zugang. Der Nachrichtenbereich auf der Startseite präsentiert sich mit, durch <h1> und <h2> ausgezeichneten, Überschriften. Dadurch stehen auf der Startseite acht <h1>-Überschriften. Sinnvoll ist das nicht.

Die Standardschrift ist mit 12 Pixeln angegeben und fällt somit für viele zu klein aus. Bei Vergrößerung der Schrift entstehen aufgrund des fixen Layouts schnell Probleme. Die Schriftgrößenangabe in Pixeln wird nicht gern gesehen, bietet jedoch bei modernen Browsern keine Nachteile mehr. Vor dem Redesign war die Schriftgröße noch in Punkt (pt) angegeben; das führte zu unvorhersehbaren Ergebnissen. Insgesamt hat man in Paderborn auf dem richtigen Weg einen kleinen Schritt nach vorn und einen großen Schritt zurück gemacht, indem Technologien vorausgesetzt werden, die nicht überall vorhanden sind.

Kommentator: Stefan David

FC Carl Zeiss Jena

Die Webseite des 1903 gegründeten Fußballclubs FC Carl Zeiss Jena ist auf den ersten Blick unaufgeräumt und chaotisch. Die Ablenkung durch die unzähligen, unschönen Werbebanner demotiviert. 12 Banner zählt die Seite nach der Vorschaltseite, inklusive eines Banners, welches sich beim erstmaligen Besuch über den kompletten Inhalt legt. Der Surfgenuss erhält so einen Dämpfer, fühlt man sich eher zum Konsumenten degradiert, denn als ernstgenommener Fan des Vereins. Eventuell wichtige oder zentrale Elemente sind nicht zu erkennen, es ist unmöglich sich einen schnellen Überblick zu verschaffen.

Per Maus lässt sich leicht durch die Seite navigieren, die Navigation ist inhaltlich gut strukturiert und bietet einen typischen Hierarchiebaum. Leider ist der Navigationsbereich nicht durch die Tastatur zu erreichen. Bei einem Blick unter die Haube festigt sich der erste Eindruck: Eine nicht validierende Tabellenstruktur mit zahlreichen Mängeln in wichtigen Elementen. CSS wird nur minimal eingesetzt, um Anpassungen an der Schriftfarbe vorzunehmen, die restliche Auszeichnung erfolgt ausnahmslos im HTML mit zeitweise veralteten Elementen und Attributen.

Die Standard-Schriftgröße ist recht klein gewählt, vor allem in der Navigation. Bei Vergrösserung schieben sich die Elemente der Webseite bis zur Unkenntlichkeit übereinander.

Kommentator: Oliver Schwarz