Mit „formulare“ getaggte auf Webdesign und Usability:

Was in Leipzig noch mit viel öffentlicher Kritik bedacht wurde, ging in Stuttgart ziemlich leise vor sich: der Relaunch der Webseite des örtlichen Nahverkehrsverbunds. Dem bescheidenen VVS war diese Aktion scheinbar nicht mal eine Pressemeldung wert, dabei muss sich die neue Webseite nicht verstecken. So sieht sie aus:

vvs.jpg

Für erfahrene Nutzer ungewohnt ist vor allem die Umstellung des Schnellzugriffs auf die Fahrplanauskunft von der linken auf die rechte Seite. Dafür wurde auf der linken Seite die Möglichkeit für zielgruppenspezifische Seiteneinstiege geschaffen. Leider verwirren die inkonsistent gestalteten Unterseiten doch ziemlich - mal sind die neuen Icons (zu denen komme ich noch) links, mal sind sie oben, die Navigation ändert sich, es werden weitere Navigationspunkte mal zur Orientierung in Kästen gruppiert, mal nicht... das ist nicht logisch, da kann man noch nachbessern.

unterseite1.jpg
unterseite2.jpg

Dafür sind die Icons deutlich besser als bei den Leipziger Kollegen:

iconsvvs.jpg

Klar, man kann sich fragen was das mit dem Känguruh bedeuten soll (das erklärt sich allerdings, wenn man die entsprechende Seite auswählt) und man kann finden, dass das Männchen bei "jetzt umsteigen" ganz schön gehetzt aussieht (wenn man so will, ist auch das passend, schließlich soll Bus- und Bahnfahren einen ja gelassener machen). Dennoch sind fast alle Icons deutlicher, klarer und sinnhafter als die der LVB. Zum Vergleich hier noch mal das Icon, dass die meiste Kritik einstecken musste:

lvb_2.jpg

Die VVS unterscheidet immerhin nicht nach "Erwachsenen" und "Autofahrern", sondern nach "Familien", "Senioren" und "Jugendlichen" und verzichtet darauf, diese Nutzergruppen als Icon darzustellen. Ob sich allerdings alleinfahrende Erwachsene in diesem Konzept wiederfinden, sei mal dahingestellt. Die müssen sich dann vielleicht mit den Seiten für "Berufstätige" begnügen (die Diskussionen kann ich mir jetzt lebhaft vorstellen...).

Um mal ein kleines Fazit aus dieser kurzen (hier mal rein optischen) Tour durch die neuen VVS-Seiten zu schließen: ein nicht hundertprozentig logischer, jedoch weitgehend sinnvoll gegliederter und strukturierter, angenehm gestalteter und (vielleicht bis auf den Seitenwechsel des Eingabeformulars auf der Startseite) behutsam vorgenommener Relaunch.


Passwort. Häh?

|
Dieses Beispiel für dumme Formulare bekam ich heute zugeschickt (danke an Matthias). Er schreibt dazu:

Wollte mich vom Newsletter abmelden, das untenstehende Formular wurde mir angezeigt.  Ich habe es ausgefüllt und man meckerte mir an, dass mein Passwort nicht den Vorgaben entsprechen würde.  Ich: "Hä??" und nochmal abgeschickt, dann kam die untenstehende Meldung.  Toll, wa?

Was ich dann rausgefunden hatte: ich hatte noch ein altes Passwort hinterlegt, das nicht den neuen Bestimmungen bei denen entspricht.  Und irgendwie hatte er das angemeckert beim Speichern eines anderen Formulars - aber den Zusammenhang hinzubekommen ist erst mal ziemlich akrobatisch.  Das Ende vom Lied war, ich habe mein Konto bei mobile.de gelöscht, was um einiges schneller ging^^.

Tja :)

Bildschirmfoto 2010-02-26 um 17.58.14.PNG

Such den Fehler

|
wohnung.jpg

Wieder mal ein Beispiel für mangelhafte Nutzerführung in Formularen. Was ist hier alles falsch?

  • Die Fehlermeldung hat die gleiche Textauszeichnung wie eine Überschrift.
  • Es fehlt ein Hinweis auf das Feld, in dem eine falsche Eingabe getätigt wurde (die Zahl 3 davor hat jedenfalls für den Nutzer überhaupt keinen hilfreichen Charakter).
  • Es gibt über die Fehlermeldung hinaus keine Hilfe, wo der Fehler zu suchen ist (kein Formularfeld ist markiert).
  • Der Text der Fehlermeldung ist nicht ausreichend (in Korrelation mit den anderen Punkten - wenn man weiß, welches Feld gemeint ist, erschließt sich das Problem leichter).

Was war nun tatsächlich der Fehler? Natürlich der Punkt zwischen den Ziffern im Feld "Miete/Kaufpreis - bis...". Logisch, oder? :)
Im Spiegel sah ich heute eine halbseitige Anzeige der Bundesagentur für Arbeit mit dem Tenor, ihre Jobbörse sei "endlich benutzerfreundlich". Was ungefähr soviel heißt wie, dass sie es früher nicht war. Das mag sein. Aber ist die überarbeitete Jobbörse denn wirklich gut? Schauen wir mal...

So sieht sie aus:

jobboers.jpg

Aufgeräumt, übersichtlich - und sehr kontrastarm. In die Gestaltung wurde offenbar investiert, wenngleich die nach der Hälfte aufhörenden Ränder etwas irritieren. Man findet sie beim Hauptinhaltsbereich und rechts bei "Weiterführende Links".

Verwirrend: klickt man in der oberen, rechten Navigationsleiste (Startseite, Kontakt, Nutzungsbedingungen etc.) einen Menüpunkt an, öffnet sich fast immer eine neue Seite - in anderem Design, weil man dort auf einen anderen Bereich der Arbeitsagentur-Webseiten umgeleitet wird. Einzig bei "Inhalt" (und natürlich beim Klick auf die Startseite) bleibt man im Contentbereich der neuen Jobbörse. Was allerdings dieser "Inhalt"-Menüpunkt bedeuten soll?

inhalt.jpg
Offenbar stellt dies eine Art Schnellzugriff auf die Inhalte der Startseite dar. Eine Sitemap will "Inhalt" jedenfalls nicht sein, die findet sich - scheinbar - unter "Hilfe". Dummerweise öffnet sich diese Seite ebenfalls in einem eigenen Fenster, ist aber dem Layout der Startseite angepasst. Inkonsistent - zumal hier die Navigationspunkte der vorherigen Seite vollkommen verschwunden sind:

seitenübersicht.jpg
Zurück kommt man nicht über anklicken des Jobbörse-Logos oben links, das ist nämlich gar nicht verlinkt. Und das Logo der Bundesagentur für Arbeit sieht zwar beim darüberfahren mit der Maus verlinkt aus, ist es aber gleichfalls nicht. Eine Sitemap ist die Seite übrigens auch nicht, auch wenn dort "Seitenübersicht" steht und der Text dies andeutet. Es werden hier einfach alle Unterseiten erklärt - allerdings ohne einen direkten Link dorthin. Die Texte sind teilweise ellenlang. Allerdings gibt es auf der Startseite (und beim Anklicken der erweiterten Suche) neben den Suchfeldern auch noch mal kürzere Erklärungen dazu, was hier jetzt eingegeben werden kann. Das ist sinnvoll. Abgesehen davon kann man bei dem übersichtlichen Suchformular - auch bei der erweiterten Suche - kaum etwas falsch machen oder falsch verstehen. Die umfangreichen Texte der Hilfeseite wirken daher etwas bemüht. Benutzerfreundlichkeit bedeutet eben nicht, dem Nutzer alles zu erklären. Benutzerfreundlich ist ein Angebot, wenn es möglichst wenig Erklärungen bedarf - weil es einfach und verständlich ist.

Kommen wir jetzt aber einmal zur zentralen Funktion der Jobbörse: der Suche. Ich probiere es mit einer ganz einfachen Einstellung:

suche.jpg

Arbeit, Design, Stuttgart. Das sind die ersten fünf Ergebnisse:

suchergebnis.jpg

Programmierer, Fachverkäufer Herrenschuhe, PHP-Entwickler, Technischer Redakteur und Technischer Zeichner. Jeweils mit einer Übereinstimmung von fünf Balken (von fünf möglichen, das ist die "maximale Übereinstimmung).

Äh? Der "Programmierer Prozessleitsysteme" hat immerhin noch den Titel "Design Engineer", da kommt also wenigstens das Wort Design drin vor. Beim Schuhverkäufer kommt der Begriff im Text vor (die Schuhe sind in "Design und Leder" ganz toll, die man verkaufen soll). Beim "Technischen Redakteur" ist jedoch schon gar nichts mehr von Design zu lesen. Klar ist auch, dass die Suche nach "Design" nicht darauf abzielt, irgendwo im Text der Stellenausschreibung etwas von Design lesen zu können.

So kommt man also bei der Suche schon mal nicht vorwärts. Wie wäre es also mit der erweiterten Suche? Hier gibt es die Möglichkeit, einen Beruf auszuwählen. Man gelangt zu einer Stichwortsuche. Wieder versuche ich es mit Design. Das Ergebnis? 108 Berufe, bei denen irgendwo das Wort Design erscheint - vom Anwendungsprogrammierer über den Ausstattungs-Assistenten oder den Herrenfriseur bis zum Pädagogen oder Web-Designer (immerhin). Für eine Volltextsuche ist mein Begriff eben zu allgemein - oder die Suche zu ungenau.

Etwas weiter kommt man mit dem Begriff "Designer". Die Suche nach Branchen jedoch, die bei solchen Suchbegriffen helfen könnte, erscheint erst nach einem Klick auf "Weitere Suchkriterien" und auch dann erst ziemlich weit unten. Mir scheint die Hilfefunktion jetzt doch wieder ganz nützlich...

Als kleines Fazit dieses ersten Überblicks über die neue Jobbörse der Arbeitsagentur: "Endlich benutzerfreundlich" lässt mich fragen, wie die Seite vorher ausgesehen hat und zu bedienen war. Benutzerfreundlich hieße aber auch, sich wirklich mehr am Nutzer zu orientieren und nicht an starren Behördenstrukturen - ein wenig will einem die Suchfunktion nämlich so erscheinen. Insgesamt sicher keine schlechte, aber verbesserungsfähige Seite mit vor allem Potenzial in der Suche. Dies ist allerdings leider keine neue Erkenntnis - bei all zu vielen Seiten.
... oder wie soll ich dieses missglückte Ding hier verstehen?

frauelein.jpg

Das ist die Standardeinstellung im Neukundenformular von Serverloft, zu erreichen, wenn man im Shop ein Produkt auswählt und zur Kasse geht. Fräulein! Die Firma sitzt in Hürth, nicht etwa in einem Land, in dem man so eine Anrede möglicherweise noch höflich findet...

Über diesem Formular gibt es den Hinweis "Bitte füllen Sie untenstehende Angaben vollständig aus". Das würde ich so werten, dass alles Pflichtfelder sein sollen - nur warum sollte ich wohl meinen Geburtsort angeben und Telefon, Mobil- UND Faxnummer? Wegen einer möglichen Schufa-Überprüfung?

Interessanterweise sind es aber tatsächlich NICHT alles Pflichtfelder. Lässt man alle Felder leer, schlagen nur einige Fehlermeldungen auf. Die haben es aber in sich. So sehen sie aus:

fehlermeldung.jpg

Au! Das tut in den Augen weh. Mehr noch schmerzen jedoch die Formulierungen. Fehlermeldungen sollten dem Nutzer ein konstruktives Feedback liefern. Studien haben gezeigt, dass tadelnder Tonfall wie "Ort ungültig" den Anwender nervös und durcheinander machen. Das führt unter Umständen zu neuen Fehlern - häufig jedoch vor allem zu Frust. Die Wortwahl ist bei Fehlermeldungen wichtig, besonders bei wenig computererfahrenen Nutzern (dies nur allgemein, im vorliegenden Fall kann man wahrscheinlich von eher computeraffinen Nutzern ausgehen).

Die wichtigsten Regeln für die Gestaltung von Fehlermeldungen lauten:
- sie sollen ausführlich sein,
- sie sollen den Nutzer konstruktiv anleiten,
- sie sollen einen positiven Ton haben,
- die Ausdrucksweise soll sich am Nutzer orientieren und
- sie sollen angemessen aussehen.

Die Fehlermeldungen in diesem Beispiel erscheinen am oberen Bildschirmrand. Wenngleich es keine allgemeingültigen Regeln dafür gibt, wo Fehlermeldungen am besten erscheinen sollten, hat sich die Variante durchgesetzt, sie möglichst nah am enstprechenden Formularfeld zu platzieren. Das ist jedenfalls sinnvoller als den halben Bildschirm mit Fehlermeldungen zu füllen...

Fehlermeldungen und nutzerorientierte Bezeichnungen innerhalb von Menüs in Formularen sind natürlich nur zwei Punkte, die es beim Design von Formularen zu beachten gilt. Dies mal als ersten Einblick - und als Hinweis, dass Usability auch hier sehr wichtig ist, um die Benutzungsfreundlichkeit einer Webanwendung in allen Bereichen sicherzustellen.

Aktuelle Einträge finden Sie auf der Startseite, alle Einträge in den Archiven.

Impressum

Powered by Movable Type 4.34-de