Schlagwort-Archive: Webdesign

Bad Practice im Webdesign

Update vom 29.06.2010: Wie ich gerade höre, wurde die Seite nicht relauncht, was aber nichts an meiner Kritik ändert. Ich habe mir die Seite vorher nie genauer angesehen und dachte, sie hätte früher anders ausgesehen.

Rehadat ist ein Informationsangebot für Arbeitssuchende mit Behinderung und Arbeitgeber, die einen Betroffenen beschäftigen wollen.
Offenbar seit heute, 10. Juni 2010, haben sie einen Relaunch gewagt. Optisch sieht die Seite gar nicht schlecht aus, ein wenig schlicht, aber Klicki-Bunti
ist eher was für eBay.
Die Seite entspricht allerdings nicht den Anforderungen an modernes Webdesign, was vor allem Blinden auffallen dürfte. In der Navigation wurde mit Spacer-Graphiken
gearbeitet, was nach der Veröffentlichung von CSS 2.1 nun wirklich badest practice ist. Hier ein Auszug aus der Navi, wie der Screenreader sie vorliest:

Hilfsmittel – Abstandhalter – Praxisbeispiele – Abstandhalter – Literatur – Abstandhalter
Rehadat

Eigentlich sagt die Sprachausgabe “Graphik Abstandhalter”, was das Surferlebnis nicht gerade steigert. Ein Blick in den Quellcode – ich spare mir hier die Zitate – offenbart, dass der Designer keine saubere Trennung von Struktur und Design vorgenommen hat. Es finden sich jede Menge Inline-Stylesheets. Das
ist zwar nicht verboten, aber es gehört schon seit Jahren nicht mehr zur guten Praxis. Inline-Styles sind ein typisches Artefakt von WYSIWYG-Editoren.

Bestimmte Browser zu empfehlen, gehört ebenfalls nicht zur guten Praxis:

empfohlene Browser: IE 6.x/7.x, Mozilla Firefox 2.x, Opera 9.x
Rehadat

Nutzer von Safari, Chrome oder mobilen Endgeräten mit anderen Browsern mögen bitte draußen bleiben. Das erinnert fatal an die frühen 2000er Jahre, als Websites
noch für Netscape oder Internet Explorer optimiert wurden. Einerseits hat die Meldung keinerlei Wert, da mit dieser Empfehlung ohnehin mehr als 80 Prozent
der Desktop-Browser abgedeckt sind. Andererseits mögen es die meisten Menschen einfach nicht, wenn man ihnen die Verwendung bestimmter Browser nahe legt.

Last not least: Wer ein Lesezeichen auf eine der alten Seiten gelegt hat, erlebt eine ärgerliche Überraschung: 404 – not found. Die 404-Meldung sollte im
Jahr 2010 einen grausamen Tod gestorben sein, geistert aber immer noch umher. Mit einer einfachen Codezeile kann man serverseitig alle 404-Fehlerseiten
auf eine hilfreichere Seite weiterleiten: ein Suchformular, eine Sitemap oder auf die Startseite mit einer passenden Fehlermeldung.

Das ist natürlich Jammern
auf hohem Niveau: Keine dieser Mankos verhindert, dass man auf der Website anständig surfen kann. Eine Seite irgendwie benutzbar zu halten ist aber nicht
Stand der Kunst im Jahr 2010, im Gegenteil: Wir haben die Technik und wir haben das Know How, das Surferlebnis für den Nutzer zu optimieren.

Es geht mir im übrigen nicht darum, die Macher der Site und die Webdesigner vorzuführen. Ich denke, dass Kritik nützlich sein kann. Es gibt noch jede Menge
anderer Seiten, die jüngst relauncht wurden und trotzdem noch Altlasten mit sich schleppen.

BIENE gestartet – auf der Suche nach kreativen Web-Lösungen

Aktion Mensch und die Stiftung digitale Chancen suchen dieses Jahr wieder nach den besten deutschsprachigen barrierefreien Webseiten. Konsequenterweise werden die Ansprüche an die Wettbewerber erhöht.
Einerseits ist es recht einfach, eines der vielen Open Source Content
Management Systeme barrierefrei ins Netz zu stellen – die sind das
häufig schon von Haus aus. Andererseits sind bereits die WCAG 2.0 2008 verabschiedet worden und sollten nun auch in das Bewusstsein jener
Webdesigner Einzug halten, die Barrierefreiheit nicht kennen. Last not
least sollte es im Jahr 2010 möglich sein, Design und Struktur zu
trennen, auf Tabellendesigns zu verzichten und Überschriften
ordentlich auszuzeichnen.
Man darf vor allem darauf gespannt sein, wie die Jury mit den neuen
Elementen aus HTML5, CSS3 und WAI-ARIA umgeht, die teilweise schon
Eingang ins Webdesign gefunden haben. ARIA steht für Accessible Rich
Internet Applications und steht derzeit als Arbeitsentwurf des W3C
bereit. Damit sollen auch dynamische Elemente des Webs zugänglich
werden. Einige Elemente daraus haben bereits Einzug ins Web gehalten: In
Wordpress, sowie bei Yahoo und Google werden „Orientierungspunkte“ –
also wichtige Stationen auf einer Webseite – kenntlich gemacht.
Außerdem sind Pflichtfelder in Formularen eindeutig gekennzeichnet.
Es ist also ein gewagter, aber enorm wichtiger Schritt, Innovationen
in diesem Bereich vorzustellen und zu belohnen. Ich bin gespannt.

Das Web wird mobil – ein Grund mehr für Barrierefreiheit

Allmählich wird das mobile Surfen erschwinglich und halbwegs bequem. Bestimmte Angebote wie Fahrtauskünfte sind für mobile Surfer vermutlich interessanter als andere. Dennoch ist es interessant, dass für das mobile Web ähnliche Regeln gelten wie für das barrierefreie Webdesign.

Das heißt, man verzichtet auf übergroße Bilder, überflüssige graphische Spielereien, auf Frames und Tabellenlayouts.

Man hält die Seiten klein und kompakt, die Navigation übersichtlich und leicht verwendbar. Man verzichtet auf komplexe Strukturen, die wenn sie nicht funktionieren den Zugriff auf Seitenfunktionen verhindern wie Navigationen über JavaScript oder Flash.

Übrigens sind gerade Blogs für mobile Surfer interessant. Die Texte sind oft so kurz, dass man sie kurz während einer Busfahrt im Stehen lesen kann. Ein Kuriosum sind ja die Leute, die erwarten, in der vollen Bahn im Stehen ihre ausgebreitete Zeitung lesen zu können und zu nörgeln anfangen, wenn jemand sie anstubst. Mit einem surferfreundlichen Handy oder E-Book-Reader dürften solche Zeiten bald der Vergangenheit angehören. Stattdessen dürften einige Leute Nackenbeschwerden bekommen.

Die Sünden des Webdesign

Bei einer Website kann man viel falsch machen. Es gibt die mittlerweile ein wenig angestaubten schlechten Regeln des Webdesign. Angestaubt, weil heute hoffentlich niemand mehr HTML für das Design verwendet, aber auch, weil moderne Multimediaelemente kaum behandelt werden.

Wer tiefer einsteigen will, kann sich Thomas Wirths „Missing Links“ oder Jacob Nielsens Werke anschauen.

Das Problem heute ist Unübersichtlichkeit, zu kleine Schriften, übergroße Banner, die einen Besucher zum Scrollen zwingen und relevanten Content verbergen.

Ein weiteres Problem sind Flash-Animationen und JavaScript-Banner, die sich vor Text schieben und weggeklickt werden wollen.

Dass etwa Freemailer oder andere kostenlose Dienstleister Werbung schalten müssen, liegt auf der Hand. Dass sie sich dabei penetrant in der Vordergrund schieben, teilweise mit unerwünschtem Sound untermalt sind, dass sie niemals zu blinken aufhören ist nicht unbedingt notwendig.

Schließlich lenkt Bewegung im Gesichtsfeld ab. Würde die Werbung irgendwann zu flackern aufhören, hätte sie auch eine Chance, nicht nur als Ärgernis wahrgenommen zu werden. Im Sinne der Werbepsychologie kann dies im Grunde auch nicht sein. Das beworbene Produkt wird hier schließlich mit negativen Emotionen assoziiert.

Der Grund, warum viele Webuser das Flash-Plugin blockieren besteht darin, dass es nicht vernünftig konfiguriert werden kann. Es ist standardmäßig so eingestellt, dass eine Animation in der höchsten Auflösung endlos wiederholt wird. Da Flash und JavaScript clientseitig – also vom Userrechner – ausgeführt werden, fressen sie Prozessor-Leistung. Bei Notebooks fängt oft die Lüfter an zu laufen, was kein gutes Zeichen ist.

Problematisch und störend sind auch Pop-Ups, seien sie gedacht zur Begrüßung des Besuchers – vollkommen unnötig – oder um Umfragen anzukünden – die besser auf der Website selbst aufgehoben wären.

Viele Webprogrammierer bedenken nicht, dass clientseitiges Scripting via Ajax, Java, JavaScript oder Flash dem Nutzer Ärger verursacht, weil die Seite zu langsam lädt oder der Lüfter des Notebooks anspringt. Ob man hier nicht mit einer spartanischeren Site mehr Pluspunkte erhält?

Vollends zum Wahnsinn kann eine Seite treiben, die komplett in Flash geschrieben ist oder Einem keinerlei Hinweis darauf offenbart, wo man eigentlich hinklicken soll, damit es mal weiter geht. Einen Vorgeschmack auf den Horror der Picture Show liefert die aktuelle Toursite der Show. Sicherlich asthetisch gut gemacht, aber Usability wurde hier außen vor gelassen. Und auch Google scheint die Site nicht zu mögen, denn sie landet im deutschsprachigen Raum nicht auf den ersten zehn Plätzen.

Endgültig überflüssig sind Begrüßungsstartseiten und Begrüßungsanimationen. Ein „Klicken Sie hier, um die Animation zu überspringen“ dürfte den genervten User eher dazu verleiten, das Fenster zu schließen, als tatsächlich irgendwo drauf zu klicken.

Es ist das alte leidige Thema: Usability = Suchmaschinenoptimierung = Barrierefreiheit.

Google dürfte eine der meistbesuchten Sites des Web sein. Es könnte sich sicher die besten Designer im Business leisten. Dabei kommt Googles Webauftritt betont schlicht daher: wenige Grafiken, wenige Links auf der Startseite, keine Flash-Animationen.