Sehr zu empfehlen, um schnell etwas mit Mehr(Nähr-)wert zu bekommen. Einfach mal eine Banane schälen und reinbeißen. Quick Win: Kohlenhydrate (von den Guten), Kalium und Ballaststoffe. Mund abwischen.

Ein Thema, das sich kontrovers diskutieren lässt. Wireframes sind in der Tat nicht immer das Architektur-Mittel der Wahl. Aber in sehr vielen Fällen sehr wohl.

Was mir immer aufstößt, sind Pauschalisierungen, ohne Kontext.

Hierzu mal zwei Äußerungen des Autors:

It doesn’t take a good designer long to whip up a Photoshop mockup, and a good coder can create a HTML prototype in a short time too. Both can be reused in the final product (which saves time), and both are much closer to the real experience than a wireframe (which helps make the right decisions).

Mag sein. Aber a) sind Wireframes immer noch schneller und b) können die richtigen Personen auch auf Basis von Wireframes die richtigen Entscheidungen treffen – zum richtigen Zeitpunkt im Prozess. Es gibt natürlich aber auch Fälle und kleinere Projekte, in denen der Wireframe schon zur Kanone gegen den Spatzen mutiert. Es kommt darauf an.

My problem with your point is that because wireframes are so easy to modify, people get obsessed with shuffling things around until they obtain a perfect wireframe, but this really doesn’t accomplish much: a perfect wireframe does not translate into a perfect site, there are just too many factors that are left aside at such an early stage.

Ein perfekter Wireframe ist natürlich keine Garantie für ein perfektes Endprodukt. Ein guter Wireframe trägt aber zu einem soliden Fundament bei. Die Angst vor Leuten, die einen Wireframe zum Anlass nehmen, Dinge immer wieder hin und her zu schubsen, liegt in einer fehlenden Prozess- und Methodenkenntniss begraben. Es kommt darauf an, wann und für wen die Wireframes in Frage kommen.

Hierzu kann ich ein Buch sehr empfehlen. Dan M. Browns “Konzeption und Dokumentation erfolgreicher Webprojekte”. Darin geht es v.a auch darum, wann, in welcher Form man Deliverables (so auch Wireframes) erstellt und wem und wann man sie präsentiert. Das Buch habe ich vor einiger Zeit hier mal vorgestellt.

[...]the Sagrada Família, is a massive, privately-funded Roman Catholic church that has been under construction in Barcelona, Catalonia, Spain since 1882 and is not expected to be complete until at least 2026.Wikipedia

Na und? HTML war noch nie fertig und wird es nie sein. Wo es aber nicht schadet oder vielmehr schon Vorteile bringt, kann man es ruhig schon nutzen. Über Fallbacks, Extra-Klimmzüge etc. kann der Einzelne – wie schon in den letzten 80 Jahren auch – selbst entscheiden. Je nach Aufwand und verfügbaren Ressourcen. Bisweilen wird der Unmut über die Behörde das W3C immer größer: Damn the W3C, HTML5 Is Already Here

So don’t worry, just because the W3C doesn’t think HTML5 is ready for prime time doesn’t mean the web doesn’t have an entirely different story to tell.

Für den Ein- und Umstieg gibt’s außerdem schon gute Einführungen, Anleitungen und Tipps. Wie z.B. bei Peter.

„In 300 Metern fahren Sie bitte rechts. Ach übrigens, gleich da vorne links können Sie auch was leckeres essen. Oder wie wäre es mit einem Cocktail? In 200 Metern auf der rechten Seite, besteht die Möglichkeit zu pullern. Oder aber Sie interessieren sich für unsere Hyper-Herbst-Mega-Angebot? Dann wenden Sie bitte.“

Oft wird übertrieben und so müssen auch die einfachsten Elemente, z.B. bei Formularen, krampfhaft umgestaltet werden, nur damit sie schöner werden – und der ein oder andere sich besser fühlt. Und gerade in diesem konkreten Punkt verbirgt sich eine große Gefahr.

Das gute alte Usability-Gespenst. Ich weiß, Usability kann auch hässlich sein. Aber ganz oft macht sie den Besuch einer Website und die Erledigung von Aufgaben gerade schön(er).

Eine Checkbox ist eine Checkbox und die Nutzer erwarten eben, dass sich bestimmte Elemente nie verkleiden. Gerade dann, wenn es um Interaktionselemente geht. Deren Funktion und Aussehen sind über Generationen und Unmengen von Webseiten hinweg gelernt und wecken Erwartungen. Auch die Betriebssystem spezifische Darstellung im Browser spielt eine Rolle. Der Mensch ist ein Gewohnheitstier. Das gilt v.a. für Checkboxen, Radiobuttons oder Selectboxen.

Die übermäßige Um- und von mir aus auch Schönergestaltung liefert in vielen – wahrscheinlich den meisten – Fällen nur wenig bis gar keinen Mehrwert. Im Gegenteil riskiere ich Probleme bei der Nutzung. In der Folge erhöhte Abbruchquoten und andere (kostspielige) Konsequenzen.

Ein Gedicht

Ein Bleistift hat mich vergewaltigt,
Hat meine Züge vergestaltigt
Und hinterlistig auf ein Blatt
Papier gebracht.
Ich muß gesteh’n, der Bleistift hat
An sich die Sache gut gemacht.
Aus Der „Gezeichnete“

Gute Gestaltung von Webseiten und Formularen

Natürlich soll gestaltet werden und den Besuchern einer Webseite auch optisch etwas geboten werden. Gute Designer wissen das auch und verlieren sich nicht in gestalterischen Details, ohne den Fokus zu verlieren. Webseiten und deren Nutzer haben Ziele. Diese sollten auch im Designprozess schon bekannt und als Umgebungsvariablen berücksichtigt werden.

Besser und fokussierter gestalten

• Learn About Design, Not Making Things Pretty
• Utility vs. Beauty
• Eye Candy vs. Bare-Bones in UI Design
• The Myth of Beautiful Web Design
• Can Experience be Designed?
• Realism in UI Design
• Decoupling Usability and Visuals

Content ist King! Unser Mantra. Dass gute Webseiten mehr sind, als nur guter Content, zeigt die Praxis. Content, Informationsarchitektur, Design und Userexperience (inkl. Usability) sind die wichtigsten Pfeiler guter Webseiten. Ausnahmen bestätigen die Regel. Guter Content alleine hat’s oft genauso schwer, wie gelungenes Webdesign gefüllt mit Worthülsen.

Als Beispiel, das für mich stark aus der Reihe tanzt, sei mal die Webseite von Herbert Steffny genannt. Optisch eine Katastrophe. Designmäßig späte 90er. Technisch ein flammendes Inferno. Aber sie überzeugt mich.

Ich bin in diesem Fall natürlich auf die Inhalte – den Content – fixiert. Als passionierter Läufer und gerade in der Vorbereitung auf meinen ersten Marathon, bin ich voreingenommen und höre auf einen bestimmten Lehrer und Trainer, dem ich vertraue.

Jetzt bin ich, was die Qualität der Webseite betrifft, ein besonders kritischer Besucher. Ich selbst konzipiere und mache Webseiten. Und stelle dabei auch und nicht zuletzt an mich sehr hohe Ansprüche. Dennoch kann mich dieses Exemplar (fast) voll und ganz überzeugen.

Ich selbst habe Herbert Steffnys Buch. „Das große Laufbuch“. Ein komplettes Werk mit sehr hilfreichen Tipps und Anleitungen zum Laufen und dem Training im Speziellen. Die Webseite liefert zusätzliche Informationen. Dort werden z.B. Leserfragen ausführlich beantwortet. Quasi als wertvolle, weil weiterführende, Ergänzung zur Buchlektüre.

Erst heute wurde mir bewusst, wie bescheiden die Seite aussieht. Und ohne in den Quelltext zu sehen, weiß ich, welcher Anblick mich dort erwarten würde. Trotzdem würde ich persönlich dieser Seite fast die Höchstwertung geben. Weil sie mir genau das liefert, was ich erwarte. Gute und vom Profi erläuterte Inhalte.

Für mich selbst ist Steffnys Webseite ein Volltreffer. Und gleichzeitig erinnert sie mich durch ihr Äußeres an die ersten Schritte in Sachen Webdesign ;-)

Aber

Herbert Steffny schreibt, wie viele andere Profis auch, kein allgemeines Laufmagazin. Im Wettbewerb stehen verschiedene, und teils gegensätzliche, Philosophien der Experten. Nach eigenen Vorlieben und selbst gemachten Erfahrungen, in Kombination mit der Philosophie des Ratgebers, entscheidet sich der Läufer. Nicht danach, wie ansprechend und mit welchen Features ausgestattet die Webseite zunächst ist. Hier zählt fast ausschließlich, Content is King.

Aber bei Laufmagazinen, -Communities und -Foren gelten verstärkt die ganzen weiteren Faktoren im Webdesign.

P.S.:

Wer selbst gerne läuft und über den ersten Marathon nachdenkt, dem kann ich Steffny nur empfehlen. Er führt sehr behutsam und vernünftig an die 42.195m heran. Andere bevorzugen mehr die “harten Hunde”. Aber ich denke mal, mit Herbert kommt man solide und nicht zwangsläufig langsamer ans Ziel.

Die Zeit jetzt nutze ich als Sabbatical für den Webzeugkoffer – wenn auch nicht für ein ganzes Jahr. Aktuell konzentriere ich mich in der Freizeit lieber auf das Projekt Marathon (Premiere am 31.10. in Frankfurt), über das ich auch an anderer Stelle berichte.

Noch heute habe ich beim Schreiben diese Regeln im Hinterkopf. Oft übertreibt man es aber ein wenig. Zu viel Kreativität in der Wortfindung kann sogar zu großen Verständnis- und somit zu Usability-Problemen führen.

Wenn beispielsweise Unternehmen damit beginnen Branding bzw. Markennamen mit Produktkategorien oder -bezeichnungen zu vermischen. Die Folge sind oft kreative Wortschöpfungen, die zwar der eigene Marketing-Chef versteht, die aber u.U. komplett an der Zielgruppe vorbei gehen oder missverstanden werden. Komm rein und finde wieder raus.

Auch wenn es langweilig erscheinen mag. Man sollte in bestimmten Fällen das Kind ganz einfach beim Namen nennen und auf den Punkt kommen: Content Usability – der unbekannte Erfolgsfaktor.

Es geht nicht darum, den Nutzern oder Interessenten eine Falle zu stellen. Das Ziel sind konkrete Handlungsanweisungen und das klare Aufzeigen von Handlungsoptionen. Nutzer verlangen sogar danach. Oft hört man z.B. “Und jetzt?”, “Wo geht’s weiter?” oder ähnliche Fragen, wenn man Nutzer beobachtet. Fragen, die auf erste Probleme hinweisen.

Wo geht’s lang und was kommt jetzt?

In Bestellprozessen muss man Orientierungshilfen anbieten. Sehr hilfreich sind hierbei Fortschrittsindikatoren bzw. Navigationsmechanismen, die den Flow unterstützen. Kombiniert mit klar formulierten Handlungsanweisungen werden die Nutzer besser durch den Prozess geleitet. Unklare Call-To-Action sind ein wichtiger Konversionskiller.

Zu viel Klickmisch

Oft möchte man den Nutzern auch alternative Wege aufzeigen oder zusätzliche Dinge anbieten. Z.B. irgendwelches Zubehör. Die Folge sind dann oft Minenfelder mit zahlreichen und verstreuten CTA-Elementen bzw. Buttons. Diese Elemente buhlen um die Aufmerksamkeit der Nutzer. Abhhilfe schaffen hier eine Konzentration auf die wichtigsten Optionen und eine Gewichtung der verschiedenen Elemente. Sekundäre Elemente sollten auch sekundär dargestellt werden (Primary & Secondary Actions in Web Forms).

Zu viel Klickmisch hat übrigens ähnliche und teilweise sogar die gleichen Ursachen, wie das Bauchladensyndrom.

Klickmisch-Links

• Looking at “calls to action” on your website – Episode 40
• Nudge your users in the right direction
• Good Call-To-Action-Buttons