Hinweis: Am 9. April beteiligen wir uns auf webkrauts.de am Naked CSS Day. Die Stylesheets sind an diesem Tag absichtlich abgeschaltet.

Webkrauts Logo

Webkrauts Webkrauts Schriftzug

- für mehr Qualität im Web

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

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 XII

Saisonabschluss nun auch in der zweiten Bundesliga: Heute mit unserem persönlichen Webmeister 2007: Mainz ’05.

Symbol Fußball-Aktion

Zum Saisonstart widmen sich die Webkrauts den Internetauftritten aller 36 Bundesliga­vereine und testen sie auf moderne Webstandards. Erst am letzten Spieltag entscheidet sich der Kampf um die Webkrauts-Meisterschale: Der FSV Mainz ’05 siegt nahezu unangefochten.

FSV Mainz ’05

Auch der Webseite des Mainzer Karnevalsvereins ist eine Seite vorgeschaltet. Sie gibt in einem aufwändigen Flash-Intro einige Eindrücke von der Stimmung am Bruchweg mit, wobei der Ton unvermittelt einsetzt, was ja eine Todsünde ist. Hinzu kommt eine Information zum nächsten Spiel und Links zum Ticketshop, dem Hauptsponsor und zur Hauptseite.

Screenshot der Webseite von Mainz ’05, verkleinertDort gibt es allerhand zu entdecken. Neben einem großen, auf JavaScript basierendem, Top-News-Bild gibt es Informationen zum nächsten und zum letzten Spiel sowie das Portrait eines Spielers. Überhaupt ist die Seite sehr reduziert und nicht so informationsüberladen, wie man das von manch anderer Seite im Test behaupten kann – das gefällt.

Ein Blick unter die Haube zeigt dann, dass Könner am Werk waren: Semantischer Quelltext ohne Tabellen und JavaScript, welches (bis auf die Werbung) unaufdringlich eingebaut wurde. Mit 10 Validierungsfehlern spielt der FSV Mainz ’05 auf ganz hohem Niveau mit. Etwas verwirrend ist, dass die Navigation – obwohl optisch oben – per Tastatur nach dem Haupttext der Seite angesprungen wird. Versteckte Sprunglinks machen es aber möglich direkt zur Navigation zu springen.

Doch es ist nicht alles championsleaguereif bei den Mainzern: Die graue Schrift ist zu klein und hat zu wenig Kontrast, dafür kann sie ganz gut vergrößert werden. Leider sind die Haupt- und die Seitennavigation nicht vergrößerbar, da sie aus Bildern bestehen. Das ist schade und trübt den ansonsten hervorragenden Gesamteindruck.

Hinweis: An der Erstellung der Webseite von Mainz ’05 waren Mitglieder der Webkrauts beteiligt.

Kommentator: Eric Eggert

Alemannia Aachen

Die Webseite von Alemannia Aachen ist stimmig und auffällig in den Vereinsfarben schwarz und gelb gehalten. Sie ist sehr informationsreich, allerdings konnten sich die Verantwortlichen leider nicht für die wichtigsten Informationen für die Startseite entscheiden, sie fanden wohl alles wichtig. Das führt zu einem Gesamtgewicht der Startseite von einem guten halben Megabyte. Für Modemnutzer ist dies ein Graus, aber selbst mit DSL wartet man recht lange.

Screenshot von der Webseite von Alemannia Aachen, verkleinertBasis der Seite ist ein Tabellenlayout. Auch ein detaillierter Blick auf den Code zeigt keine modernen Ansätze der Webentwicklung. Wir finden massenweise Inline-JavaScripts, einige Elemente sind nicht richtig geschlossen. Die wenigsten Bilder haben ein alt-Attribut und ohne Bilder ist die obere Navigation nicht bedienbar. Auch semantisch ist diese Seite ein voller Reinfall: Auf der Startseite befindet sich keine einzige Überschrift. Optisch auszumachende Überschriften sind einfach nur Links in größerer Schrift. Und auch in den Tiefen des Auftritts befinden sich maximal eine Überschrift, sozusagen als Seitentitel.

Weitere Semantik fehlt komplett. Absätze sind im wesentlichen unbekannt, werden aber im Einzelfall schonmal statt einer Liste genutzt. Dafür gibt es für die betreuende Agentur eindeutig die rote Karte und die Profilizenz wird entzogen. Die Navigation ist ohne JavaScript nutzbar, die untere Navigation ist dank des schwachen Kontrasts fast versteckt. Optische und konzeptionelle Patzer addieren sich bei Alemannia Aachen zu miserablem Code. Das reicht eigentlich nur für den Amateurstatus.

Kommentator: Jens Grochtdreis

FC Augsburg

Auf geht’s zum Anpfiff des FC Augsburg – wobei „Anpfiff“ durchaus im Sinne einer Schimpftirade verstanden werden kann. Was hier an Webauftritt abgeliefert wird, verursacht einem Verfechter standardkonformer Webauftritte schon einige Magenschmerzen.

Screenshot von der Webseite des FC Augsburg, verkleinertSchon die vorgeschaltete Seite lässt nichts Gutes erahnen, bewirkt ein Abschalten des Stylesheets doch gerade einmal, dass ein (!) einziger Link auf der Seite seine Unterstreichung verliert. Das komplette Design der Seite wirkt etwas angestaubt und entsprechend präsentiert sich dann auch der Quelltext der folgenden Seiten im Retro-Stil: Wild wurden div-Container mit tief verschachtelten Tabellen gemischt und von margins haben die Entwickler auch anscheinend noch nie etwas gehört – Einrückungen werden konsequent durch nichtumbrechende Leerzeichen realisiert. Abwechslungsreich geht es bei der Verwendung von Elementen zu: Hier finden sich gleichberechtigt <b>- und <strong>-Elemente, und auch lange nicht mehr gesehene <font>-Konstrukte haben hier eines der letzten Biotope gefunden.

Halbzeit! Noch von den Fouls im Markup erschüttert widme ich mich einer genaueren Betrachtung der Usability. Und zumindest hier kann der FC Augsburg einigen verlorenen Boden wieder gutmachen: Das Menü präsentiert sich aufgeräumt und erwartungsgemäß auf der linken Seite. Ein Breadcrumb-Pfad über den eigentlichen Inhalten zeigt jederzeit den aktuellen Aufenthaltsort des Besuchers an – gut gemacht! Lediglich die „Quicklinks“ hängen etwas uninspiriert auf der rechten Seite herum und ändern von Seite zu Seite ihre Position.

Da ertönt auch schon der Schlusspfiff! Endergebnis der W3C-Validierung nach 90 Spielminuten: 54 zu 0 bereits auf der Startseite.

Kommentator: Andreas Demmer

VfL Osnabrück

Die Webseite des Osnabrücker Zweitliga-Aufsteigers bietet einen zweigespaltenen Eindruck. Hervorgerufen wird dieser von der vorgeschalteten Startseite, die zwar optisch recht nett daherkommt, jedoch herzlich wenig Informationen bietet. Ein passender Klick bringt den Besucher dann aber auf die eigentliche Hauptseite, die mit einer übersichtlichen Navigation oben und am linken Rand und einem zentrierten Nachrichtenbereich Informationen zum Verein bietet. Der rechte Rand der Seite ist Werbekunden und Sponsoren vorbehalten.

Screenshot von der Webseite des VfL Osnabrück, verkleinertIm Hinblick auf die Einhaltung von Webstandards ist die Seite des VfL leider eine Katastrophe. Semantik in der Auszeichnung ist nicht zu erkennen, die Seiten validieren nicht, Navigation per Tastatur ist gar nicht oder nur sehr eingeschränkt möglich und alt-Attribute für Bilder konnte ich überhaupt keine entdecken. Die Standardschriftgröße wurde mit 8 Punkt (!) angegeben; eine Einheit, die in Bildschirmausgaben definitiv nichts zu suchen hat.

Der Inhalt findet sich in einem tief verschachtelten Tabellenverschlag, wobei manche Tabellen in der einzigen enthaltenen Zelle nur ein Bild enthalten und somit auch weniger dem Layout als eher dem Selbstzweck dienen. Vergrößert man die voreingestellte Schriftgröße in Maßen, bleibt die Seite navigier- und lesbar. JavaScript wird nur sehr sparsam eingesetzt und dient eher der Steuerung der zahlreichen Werbeelemente. Die Bedienung der Seite leidet nicht, wenn man JavaScript deaktiviert hat. Positiv zu erwähnen ist, dass man vom VfL nicht mit Popups genervt wird. Von der Nichteinhaltung der Webstandards abgesehen, bleibt ein positiver Eindruck. Aus Sicht eines Webkrauts lautet das Urteil jedoch: „höchst verbesserungswürdig“.

Kommentator: Stefan David

Symbol Fußball-Test

Kommentare

Matt
am 03.09.2007 - 09:02

Im Safari hat sich den Karnevalsverein aber keiner angesehen, oder? Da bleiben sowohl bei den Topnews als auch beim nächsten/letzten Spiel Scrollbalken übrig.

Ansonsten: Gute Arbeit, vor allem mal eine Typo3-Seite, der man das nicht auf den ersten Blick ansieht...

Permanenter Link

illuvid
am 04.09.2007 - 11:19

was sagt man nun dazu!
seit monaten habe ich mich mal wieder hier hin verlaufen (wenns erlaubt ist dann habe ich übriegens meinen nick geändert) und dann sehe ich auf der übersichtsseite nur fussbälle! erst dachte ich ich spinne aber dann war klar ihr optimiert eure starke seite auf fussbalmanschaften.

habt ihr das nötig?
wie auch immere, ich hatte nachdem ich euch zum thema webstandarts in meinem blog empfohlen hatte schon schlimmere befürchtungen als ich die fussbälle sah!

nun aber etwas konstruktive kritik.
ich habe euch seiner zeit über ein paar klasse beiträge u webstandarts gefunden und ins herz geschlossen. nun seit ihr wie ich es sehe aber mehr am kritisieren und mäkeln als den leuten echte tipps zu geben oder die möglichkeit sich einzubringen.

so zumindest nehme ich das gerade war. ob meine warnehmung auch die von anderen ist steht natürlich auf einem ganz anderen blatt!

Permanenter Link
Tomas Caspers

Tomas Caspers (Webkraut)
am 04.09.2007 - 11:25

Die Schule war aber heute früh zu Ende, oder hast du blau gemacht?

Permanenter Link

Jens Grochtdreis
am 04.09.2007 - 11:28

Hallo Michael ("illuvid"),

ich gebe Dir recht, daß derzeit der Fußball sehr dominierend auf unserer Seite ist. Das kommt vor, wenn man eine größere Aktion fährt.

Du hast Recht, daß wir in dieser Aktion nicht nur einfach Tips geben. Doch das ist auch nicht unsere einzige selbstgestellte Aufgabe. Wir wollen für Webstandards sensibilisieren. Fußballvereine sind normale Wirtschaftsunternehmen, die gerne das Credo der Qualität und Leistung hochhalten. Doch die eigenwerbung - speziell im Internet - spricht leider eine andere Sprache. Auch die beteiligten Agenturen sind oft von Professionalität weit entfernt.

Ich finde es nicht falsch, darauf hinzuweisen, auch um eine Selbstbesinnung zu erwirken. Aber ich habe auch in den letzten Jahren oft erfahren dürfen, daß nicht jeder diese Strategie teilt.

Aber sei Dir gewiss, daß wir auch wieder kosntruktivere Hilfe geben, als einfach nur aufzuzeigen, wo sogenannte Profis ganz fürchterlich arbeiten. Wenn Du diesbezüglich Wünsche hast, zögere nicht, sie zu äußern. Themenwünsche unserer Leser sind uns immer willkommen.

Permanenter Link

Michael
am 27.09.2007 - 02:04

Also ich finde die Serie gut und werde jetzt erst mal direkt den Eintrag zur Website von Werder Bremen suchen gehen ;-)

Permanenter Link

Die Kommentare sind geschlossen.