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.

Besonders bedanken möchte ich mich bei:

• Stefanie Kegel
• Philipp Mühlmeister
• Jan Entzminger

Hier geht’s zum Fragebogen: Fragebogen für Webdesign-Projekte

Fragensteller sind Weichensteller.Hans Leopold Davi, schweizer. Buchhändler und Schriftsteller

Ein Webdesign-Projekt sollte mit einem persönlichen Gespräch sowie den formulierten Anforderungen und Wünschen des Kunden starten. Es werden die Rahmenbedingungen des Projekts geregelt und zentrale Fragen geklärt. Man spart im weiteren Projektverlauf Zeit, die sonst für unzählige Mail-Schlachten verpulvert wird. Das Dokumentationswerkzeug ist ein Fragebogen.

Am Ende des Artikels gibt es ein PDF zum Download. Das Dokument würde ich, auf Basis von Anregungen und Ergänzungen, dann weiterentwickeln und entsprechend aktualisieren.

Zunächst aber noch ein paar allgemeine Anmerkungen zum Thema Beratungsgespräch und Fragebogen.

Ein Fragebogen ersetzt nicht das persönliche Beratungsgespräch. Er ist vielmehr auch ein Gesprächsleitfaden. Es ist daher eine schlechte Idee, diesen Fragebogen unkommentiert an einen Kunden weiterzuleiten. Auch wenn wir uns noch so Mühe geben, wird ein Kunde nicht alle Fragen auf Anhieb verstehen können.

Das Beratungsgespräch

Im ersten Gespräch geht es nicht nur darum, den Fragebogen gemeinsam auszufüllen. Zum Start des Projekts hat man die Gelegenheit, dem Kunden beratend zur Seite zu stehen und dabei behilflich zu sein, seine Wünsche und Vorstellungen auf eine stimmige Anforderungsbasis zu bringen.

Es fällt vielen Kunden außerdem schwer, ihre Anforderungen zum Ausdruck zu bringen. Sie verfügen nicht immer über das nötige Fachvokabular und trauen sich daher ggf. nicht, ihre Wünsche zu äußern. Als Anbieter ist man der fachlich kompetente Ansprechpartner, auf den sich der Kunde verlässt.

Es gibt natürlich auch die oft so genannten Briefings. Hier stellen die Kunden ihre Anforderungen im Rahmen eines Meetings vor. Aber auch hier darf und sollte man Fragen stellen und darüber hinaus fachlich/sachlich beraten.

Konzeptbasis

Die dokumentierten grundlegenden Anforderungen, bilden eine gute Basis für den weiteren Projektverlauf, in organisatorischer und qualitativer Hinsicht. Das Beratungsgespräch, Notizen und schließlich der ausgefüllte Fragebogen bilden bei größeren Projekten außerdem eine gute Basis für das Konzept und  Lastenheft – Futter für den Konzepter. Mit dem Schreiben des Konzepts sollte nicht begonnen werden, bevor die formulierten Anforderungen von Kundenseite vorliegen.

Man wird zwar nicht bei jedem kleineren Projekt ein ausführliches Konzept und/oder ein Lastenheft schreiben. In vielen Fällen ist deshalb schon der ausgefüllte Fragebogen die Konzept- und Organisationsbasis des Projekts.

Der Webdesign-Fragebogen

Jetzt aber zum Fragebogen. Er kann natürlich keinen Anspruch auf absolute Vollständigkeit erheben. Er entspricht der aktuell von mir verwendeten Form. Über Feedback im Sinne von Ergänzungen und Verbesserungen würde sich bestimmt auch der/die ein oder andere Leser/in freuen. Wie bereits erwähnt, werde ich den Fragebogen ggf. auch entsprechend weiterentwickeln und aktualisieren.

Webdesign-Fragebogen 1.5

Updates Version 1.5

• Abschnitt 3: Ergänzung des Punktes „Reichweite“
• Abschnitt 6: Ergänzung des Punktes „Suchmaschinenoptimierung“
• Abschnitt 7: Ergänzung des Punktes „Spezielle Anforderungen an das Webdesign (Browser, Printstylesheets und Barrierefreiheit)“

Editierbares .doc

Den Fragebogen stelle ich bei Bedarf auch gerne im .doc-Format zur Verfügung (Nachricht bitte per Mail an mich).

Gerade von Kunden angefertigte Skizzen sind besonders wertvoll. Das Skizzieren einer Website und deren Features erleichtert die Kommunikation zwischen Kunden und Webdesigner erheblich.

Das abgebildete Beispiel gehört zu meinem aktuellsten Auftrag. Nach einem ersten Vorgespräch lieferte mir der Kunde zwei Zeichnungen und außerdem einen Ausdruck einer Website, die ihm besonders gefallen hat. Auf den Ausdruck hat er sogar noch weitere Details ergänzt, in dem er Bereiche mit Papier und Klebeband überklebte. Die Skizzen waren außerdem mit zahlreichen Stichpunkten und Hinweisen zu den Inhalten und damit auch zur Informationsarchitektur der Website versehen.

Ein wertvoler Konzeptbeitrag durch den Kunden

Kunden liefern so einen wertvollen Beitrag zum Konzept. Sie wirken aktiv an der Informationsarchitektur und dem Designkonzept einer Website mit. Die Wahrscheinlichkeit besser verstanden zu werden steigt. Das Endergebnis kann davon nur profitieren.

Scribbles helfen mir also dabei, meine Kunden besser zu verstehen. Warum?

Weil Kunden intuitiv ihnen und uns bekannte Muster aufgreifen. Solche Muster, die ihnen aus dem regelmäßigen Umgang mit dem Internet vertraut sind.

• Metanavigation und Suche
• Aufbau von Navigationsmenüs
• Header und Positionierung von Logos
• etc.

Kunden sprechen dann aber z.B. nicht von einem Masthead. Sie zeichnen einfach ihr Logo dort hin, wo sie es sich vorstellen. Dazu vielleicht noch weitere Hinweise auf gestalterische Details. Wahrscheinlich ergibt es sich dann auch, dass die Navigation mit in diesem Bereich angebracht werden soll.

Sprichst Du Webdesign?

Es geht um Sprache. Kunden kennen selten unsere Fachausdrücke, mit denen wir Anforderungen beschreiben. So fällt es ihnen oft schwer, ihre Anforderungen und Wünsche überhaupt zu äußern. Sie sprechen nicht unsere Fachsprache und -dialekte. Warum auch? Fragen wir dann nicht gezielt nach, drohen bestimmte Anforderungen ganz unterzugehen, oder erst im Projektverlauf hochzukommen. Außerdem besteht die Gefahr, dass beide aneinander vorbeireden und später böse Überraschungen erleben.

Bildsprache

Eine gemeinsame Bildsprache vereinfacht die Verständigung. Von Kunden vorbereitete und zusammen besprochene Skizzen tragen zum besseren gemeinsamen Verständnis bei. Ich selbst habe damit positive Erfahrungen gemacht und kann nur empfehlen, es einmal zu versuchen und zusammen mit einem Kunden diesen Weg zu gehen. Ich sehe die Scribbles als Vorstufe von Wireframes, die von mir im nächsten Schritt erstellt werden. Diese werden dann sehr wahrscheinlich schon ziemlich genau den Vorstellungen des Kunden und einer allgemein vernünftigen Informationsarchitektur entsprechen.

Yes, it is quite user-friendly, but apparently not enough for people who double-click on links when browsing or worst, enter their website’s url in Google to get there.8 ways to make Wordpress easier to use for your clients

Das ist vielleicht etwas abfällig formuliert, aber es liegt auch was wahres darin. Gefordert sind auch wir Webdesigner bzw. Anbieter, die den Kunden/Anwender später auf das System loslassen. Man kann mehr tun, als die späteren Nutzer des Systems pro forma kurz zu schulen und dann zu hoffen, dass sie nichts kaputt machen.

Der oben genannte Artikel bezieht sich zwar speziell auf Wordpress, kann aber in Teilen auch verallgemeinert werden. Es gibt Punkte, die man bereits bei der Konzeption der Website und dem dazugehörigen CMS oder Blogsystem berücksichtigen kann.

Welche speziellen Anforderungen bestehen, sollte bereits in den ersten Gesprächen erörtert werden. Je nachdem gibt es dann ein paar Aspekte, die zu berücksichtigen sind. Ich sehe da v.a. drei zentrale Ansatzpunkte, durch die die Usability im Backend des CMS beeinflusst wird.

• Der Editorbereich ist der wohl kritischte von allen. Er bildet den zentralen Dreh- und Angelpunkt für die Nutzer bzw. Redakteure im System. Also sollte er gut erreichbar, leicht verständlich und mit den wichtigsten Editorfunktionen versehen und eingerichtet sein.
• Seitenverwaltung. Die reine Auflistung der Seiten, wie z.B. bei Wordpress, mit mehr oder weniger kryptischen Zusatzoptionen ist nicht intuitiv. Otto Normal kommt besser mit Seitenbäumen zurecht, die ähnlich funktionieren, wie ein gewohnter Dateiexplorer eines Betriebssystems. Auch die einfache Erweiterung und Anpassung der Seitennavigation. Es muss also möglich sein, neue Seiten ganz einfach hinzuzufügen oder verschieben zu können.
• Reduktion auf die wesentlichen Features. D.h. man nimmt den Nutzern das, was sie evtl. verwirren könnte. Ohne sie dabei aber in ihren Rechten all zu voreilig zu beschneiden bzw. zu bevormunden. Anforderungen an Rollen und Rechte sollten daher gemeinsam geklärt werden, um das System dann zielgerichtet entschlacken zu können.

Aber die Nutzer des CMS müssen trotzdem auch ein wenig Bereitschaft mitbringen, sich mit Technologie auseinander zu setzen. Ganz ohne geht es eben auch nicht. Ein CMS ist ein System, in dem viel Technologie steckt. Berührungspunkte mit dem Kern des Systems sind immer wieder gegeben. Es ist eben nicht ganz so trivial, wie das anlegen eines neuen Word-Dokuments.

Links zum Thema Backend-Usability

• User Experience? Die Rolle des CMS
• Mit dem CMS wird alles einfacher – oder das Märchen vom Redaktionssystem
• 11 usability principles for CMS products
• You can’t automate everything

• Recherche
• Definition
• Design
• Weiterentwicklung

Schön gemacht und für einen ersten Überblick ganz gut geeignet.

Und siehe da, wenig später erhielt er Antwort von AA, genauer vom UX-Architekten des Unternehmens. Dieser bat, was man verstehen kann, um Anonymität. Steckt in seinen erklärenden Worten auch ein gutes Stück Frust. Interessante Hintergünde, muss man sagen. Für den ein oder anderen in ähnlicher Form vielleicht sogar bekannt.

Die Frage, die sich der Webdesigner danach stellte ist, warum viele Websites so deutlich schlechter sind, als die Leute, die sie machen?

But wait. If the UX architect at AA.com is actually pretty good, then why does the site suck so much?

Wo liegt das Problem?

Der UX-Architekt begründet die Zustände mit der Größe der Organisation, den umständlichen Prozessen und dem fehlenden Gehör, dass Experten oft finden. Sie gehen im größeren Grundrauschen oft unter. Er macht es sich damit vielleicht auch etwas zu einfach, aber im Kern steckt viel wahres. Das soll nicht als alles erklärende Ausrede gelten. Aber natürlich wirken sich die vom UX-Architekten geschilderten Umstände, mal mehr mal weniger auf das Ergebnis aus. Wenn auch nicht abzustreiten ist, dass die derzeitige Website deutlich zu weit von gutem Webdesign, geschweige denn einer guten Userexperience entfernt ist.

Zwei Thesen

Design durch Komittees hat seine Nachteile. Die Kunst liegt darin, die bestmögliche Zusammensetzung der Projektgruppen zu finden und Prozesse mit Spielregeln zu etablieren. Das ist zwar nicht ganz einfach, aber man sollte es versuchen. D.h. man braucht v.a. viel Durchhaltevermögen und Nerven. Das geht aber oft allen, an großen Projekten beteiligten Personen so. Uns Webdesignern genau so, wie vielen anderen auch. Jeder muss hier und da zurückstecken und v.a. lernen Kompromisse einzugehen.

Eine weitere These sollte nicht unerwähnt bleiben. Die reine Lehre gibt es nicht! Und je größer die Organisation, desto schwerer ist es (meist), sie in der Praxis zu leben und alles möglichst perfekt zu machen. Man muss Abstriche machen und versuchen gemeinsam zum bestmöglichen Ergebnis zu kommen. Da bleibt auch mal die ein oder andere goldene Regel im Buch stecken. Speziell Unternehmenswebsites müssen es sehr vielen Interessengruppen recht machen. Es gibt hier keine eindeutig definierte Zielgruppe.

Übrigens: Dustin Curtis’ Blog ist auch sonst sehr ungewöhnlich. Jeder Artikel hat sein eigenes Layout und Design. Ganz im Stil eines Magazins.

Webdesign: Ein komplexer und permanenter Prozess soll Ausgangspunkt für weitere Artikel gewesen sein. Die darauf folgenden sollen die einzelnen Phasen und Abschnitte näher beleuchten. Es geht zunächst um ihren Beitrag zum Konzept.

Die Analyse einer bestehenden Website und die Inspiration sowie die Beeinflussung durch aktuelle Trends bilden die Ausgangsbasis. Eine Website muss (neu) ausgerichtet werden. Das Ziel besteht darin, auf der aktuellen Basis bereits möglichst viele konkrete Anforderungen und Ideen für einen Neustart zu finden.

Zur Erinnerung die Hauptphasen im Prozess:

• Projektplanung
• Analyse & Inspiration
• Informationsarchitektur
• Webdesign & Usability
• SEO & Onlinemarketing
• Qualitätssicherung
• Betrieb & Management

Die Projektplanung lasse ich in diesem Zusammenhang mal außen vor. V.a. die Phasen 2 und 3 bedienen das Konzept und liefern die zentralen Anforderungen an Webdesign im engeren Sinne.

Analyse und Ausrichtung

Die Analyse erfolgt meist in zwei Richtungen – da oft bereits eine Website vorhanden ist.

• Blick zurück: Re-Design Retrospektive und Qualitative Analyse vor dem Relaunch haben sich bereits damit beschäftigt
• Ziele, Zielgruppen sowie Kunden- und Nutzeranforderungen

Ein Relaunch dient nicht nur dazu, der Website ein neues Gesicht zu geben. Es steckt noch viel mehr dahinter.

Die Ausrichtung

Warum zurückblicken, wenn man doch jetzt alles neu macht? Ganz einfach: Aus Fehlern lernt man. Außerdem deckt eine gezielte Analyse so einiges an Optimierungspotential auf. Ziele, Strategien, Zielgruppen und definierte Szenarien helfen uns dabei, die Ausrichtung zu finden. Jedes Website-Konzept sollte damit beginnen.

Zunächst gleicht man die Zielsetzung der Website mit ihrer ursprünglichen ab. Ist diese noch die Gleiche? Oder haben sich neue Ziele ergeben und sind alte Ziele nicht mehr relevant? Gleiches gilt für die Zielgruppen und weiterführend für die allgemeinen Nutzeranforderungen.

Die Analyse

Die durch die Fragen nach der Ausrichtung gewonnenen Anforderungen nutzt man dann zur Analyse der bestehenden Website. Wo kann sie diese Anforderungen noch erfüllen und wo gibt es Nachholbedarf? Die Ergebnisse dieser Analyse und die zuvor definierten Anforderungen (Ausrichtung) fließen in das Konzept mit ein. Hier sind Szenarien und konkrete Usecases sehr wichtig. Es bringt wenig, sich ziellos über die Website zu klicken und darauf zu hoffen, möglichst viel Futter zu finden.

Was sind Szenarien und Usecases? Es handelt sich bei Usecases, wörtlich übersetzt, um Anwendungsfälle. Szenarien können selbst wiederum mehrere Usecases beinhalten. Um an dieser Stelle nicht zu ausführlich zu werden, reduziere ich das Ganze auf zwei wesentliche Fragen, die man sich stellen sollte:

Auf welchen Wegen und aus welchen Beweggründen kommen die Besucher zur Website? Welche Ziele verfolgen sie, welche Aufgaben werden sie auf der Website zu lösen haben (oder wollen) und welche besonderen Merkmale besitzen sie?

Mit den Antworten darauf im Hinterkopf, ergibt sich ein klareres Bild von der bereits existierenden Website und den konkreten Anforderungen an die neue. An Hand der Szenarien und Usecases lässt sich besser einschätzen, was eine Website leistet und weiter leisten muss.

Inspiration

Ohne den Blick auf aktuelle Trends und Best Practice, geht’s auch nicht. Der Blick über den Tellerrand.

Was ist Inspiration und kann man sie erzwingen? Zum zweiten Teil der Frage: Nein. Verkrampfung blockiert.

Unter Inspiration (von lat.: inspiratio = Beseelung, Einhauchen von „spiritus“ = Leben, Seele, Geist) versteht man allgemeinsprachlich jene mentale Kraft, die neue Ideen hervorbringt.Definition bei Wikipedia

Besser trifft es, sich inspirieren lassen. Die Mentale Kraft schöpfen, die neue Ideen hervorbringt. Und wenn möglich nicht zum Kopieren verleitet! Inspiration beeinflusst ganz stark die Phase, in der Design sichtbar wird und in ästhetischer Hinsicht entsteht.

Hierbei ist man bei weitem nicht auf branchenübliche Webdesigns oder Webdesign Showcases begrenzt. Inspiration liefern auch andere Quellen. Wobei das die Webdevigner unter uns wohl am besten beurteilen können, auf was es hier ganz speziell ankommt.

Weitere Quellen sind z.B.

• Printmagazine
• Fotografie
• Natur
• Architektur
• Inneneinrichtungen
• u.v.a.

Die wirklich kreativen Geister wissen, wo sie sich die nötige Inspiration verschaffen. Vielleicht geschieht vieles aber auch ganz einfach unterbewusst. Manch einer sieht sogar in Visitenkarten eine Art Inspirationsquelle.

Abschließend noch ein paar Worte zu aktuellen Trends. Sie sind wichtig und werden im Regelfall nicht von uns selbst gesetzt. Aber wir müssen hier und da aufsetzen. Zum einen, weil sie neue und verbesserte Methoden hervorbringen, zum anderen, weil man es von uns erwartet, bei gewissen Dingen dabei zu sein. Die Erwartungen setzen dabei nicht nur die Auftraggeber, sondern auch und v.a. die Nutzer und Kunden des Angebots.

Weiterer Lesestoff

Hier verweise ich auf die Links zum Artikel Webdesign: Ein komplexer und permanenter Prozess (im Text und eine Liste am Ende des Artikels).

Ausblick

Analyse und Inspiration bilden das Fundament des Konzepts. Der nächste Teil wird sich dann näher mit der Informationsarchitektur beschäftigen.

Beim Schreiben dieses Artikels haben sich außerdem wieder einige Ansatzpunkte für weiterführende Betrachtungen ergeben. Auch dazu mehr im Rahmen des weiteren Programms.

Foto: Floor concept

Man hat nicht nur eine Idee, denkt sich was schönes aus, hostet eine Website, die dann das WWW erobert. Das bezeichnet man als in Schönheit sterben.

Die Zeichnung stammt vom Artikel Web design process in 5 steps und illustriert, dass wir ein paar mehr Dinge berücksichtigen müssen.

Dieser Artikel soll zunächst aufzeigen, auf welchen Feldern wir Webdesigner uns bewegen, womit wir uns zum großen Teil auskennen müssen und welche vielfältigen Aspekte zu berücksichtigen sind. Er ist kein Tutorial, dass eine konkrete Anleitung oder Handlungsempfehlung ausgibt.

Vorgliederung des Webdesignprozesses

Der Webdesignprozess lässt sich zunächst ganz grob in vier Abschnitte aufteilen.

• Planung
• Design
• Realisierung
• Management

Oder etwas granularer in:

• Projektplanung
• Analyse & Inspiration
• Informationsarchitektur
• Webdesign & Usability
• SEO & Onlinemarketing
• Qualitätssicherung
• Betrieb & Management

Das sollte zunächst ausreichen. Im konkreten Projekt ist das wahrscheinlich noch etwas feingliedriger.

Dabei sind Webdesign und Usability, also der eher kreative Part des Prozesses, oft nur ein relativ kleiner Teil des Gesamten. Aber natürlich wiederum der zentrale Part, weil vorgelagerte Arbeiten schon in die Richtung des kreativen Teils denken. Davon abgesehen macht Webdesign im engeren Sinne alles sichtbar, was man sich zuvor ausgedacht hat.

Abschnitte im Webdesignprozess

Menschen tendieren oft dazu, die Projektplanung als unnötiges Beiwerk oder Meetingbeschaffungsmaßnahme zu verstehen. Das Gegenteil sollte der Fall sein. Der Einzelne, im Projekt beteiligte, wird im Idealfall kaum dadurch belästigt. Ein gewisses Maß an Planung und Kommunikation ist aber ein wesentliches Erfolgskriterium.

Das trifft natürlich nicht auf die kleine Vereinswebsite zu, die oft von einem Einzelnen realisiert wird. Das mache ich nebenberuflich auch und ich verwalte mich dann auch nicht über. Aber im Falle einer Unternehmenswebsite, wird das Ganze schnell etwas komplexer.

Die Leitung von Webdesignprojekten, an denen 15 oder mehr Leute arbeiten (intern und extern) und mit Budgets im sechsstelligen Bereich, hat ohne entsprechendes Projektmanagement keine Chance.

Analyse & Inspiration

Handelt es sich um ein Re-Design-Projekt, gehört die Statusanalyse ganz klar dazu. Es geht nicht nur darum, alles neu und anders zu machen. Evtl. hat man bisher das ein oder andere schon ganz gut gemacht und sollte das weiter verfolgen. Außerdem lässt es sich aus begangenen Fehlern immer gut lernen. Zwei meiner Beiträge zu diesem Thema:

• Re-Design Retrospektive
• Qualitative Analyse vor dem Relaunch

Die Analyse von Markt und Wettbewerb darf auch nicht fehlen. Wie werden in der gleichen oder verwandten Branchen Websites gemacht, was macht die Konkurrenz? Darüber hinaus sollte man sich über zwischenzeitliche Innovationen auf dem Laufenden handeln. Während eines typischen Zweijahreszyklus’ einer Website, tut sich im Web so einiges. Neue Methoden und Features wollen auf ihre Praxisrelevanz für die eigenen Zwecke geprüft werden.

Die Analyse der allgemeinen Anforderungen selbst, lässt sich in unterschiedliche Abschnitte aufteilen.

• Zielgruppe(n)
• Nutzeranforderungen
• Unternehmensanforderungen bzw. Strategie
• Marktanforderungen
• etc.

U.a. können Checklisten für die Projektplanung bei der Erfassung von Anforderungen behilflich sein. Diese Analyse liefert wiederum konkrete Detailanforderungen für die nachgelagerten Projektphasen.

Und schließlich gehört auch ein Schuss Inspiration dazu. Das macht nicht nur Spaß, sondern macht in gewisser Weise auch den Kopf frei. Zumindest, wenn man Inspiration richtig auffasst und nicht ins Abkupfern abrutsch und/oder eigene Ideen dadurch blockiert. Ein Beitrag dazu erschien mal beim Webstandard: Inspiration richtig verstehen

Zu Analyse und Inspiration habe ich einen weiterführenden Artikel veröffentlicht: Analyse und Inspiration im Webdesignkonzept

Informationsarchitektur

Die oben genannten Analysen liefern einiges an Futter für die Informationsarchitektur. Bei Informationsarchitektur geht es v.a. um das Organisieren und Auszeichnen.

Die Informationsarchitektur im Bezug auf eine Website hat wiederum viele Gesichter.

• Navigationsstruktur (Methode z.B. Cardsorting)
• Seitenstruktur (Methode z.B. Wireframing)
• Kategorisierung und Verschlagwortung (Kategorien und Tags)
• Lokalisierung (Regelungen die Sprach- und Länderversionen betreffen, bis hin zu kulturellen Unterschieden und verschiedenen Marktbedingungen)
• etc.

Einen guten Einstieg in diese Thematik bietet die Website des Instituts für Informationsarchitektur.

Webdesign & Usability

Das Herzstück und zugleich der vielleicht interessanteste Teil der Arbeit. Die vorgelagerten Arbeiten aus Analyse, Inspiration und Informationsarchitektur, liefern die Anforderungen an das Webdesign und halten es zusammen.

Webdesign im engeren Sinne ist der kreativste Part am gesamten Prozess. Trotzdem sollte auch dieser Teil nicht ganz kopflos angegangen werden und umfasst verschiedene Teildisziplinen.

• Gestaltung, Farbenlehre und Typografie
• Screendesign
• Prototyping
• Webdesign Templates ((X)HTML, CSS, Javascript etc.)
• Meist auch Systemplates für das CMS
• etc.

Die Website Web Design+ enthält Best Practices und Links zu den Teildisziplinen im Webdesign.

Alle muss natürlich auf die Nutzer der Website abgestimmt sein und ihren grundlegenden Anforderungen an die Bedienbarkeit entsprechen. Usability (inkl. barrierefreie Umsetzung) wird oft unterschätzt. Es reicht nicht aus, Texte in ausreichender Schriftgröße und ausreichende Kontraste zur Verfügung zu stellen. Vieles, was Einfluss auf die Usability einer Website hat, wurde außerdem v.a. schon im Bereich der Informationsarchitektur vorbereitet (Stichworte Orientierung und Verständlichkeit der Inhalte).

• Wahrnehmung, Lesbarkeit und Texten für’s Web
• Navigationsstrukturen und -mechanismen
• Interaktionsdesign
• Expertenreviews und Nutzertests
• etc.

Man hätte es vermuten können. An dieser Stelle verweise ich natürlich auf Jakob Nielsens Alertbox. Ein weiterer guter Ausgangspunkt ist der Artikel “100 Usability-Tips (Revision)” von Jens Meiert.

SEO & Onlinemarketing

Suchmaschinenoptimierung (SEO) und Onlinemarketing sollte man frühzeitig einbeziehen. Beginnt man damit etwa kurz vor oder erst nach dem Launch einer Website, ist es schon oft zu spät. Auch, wenn man später wieder was gutmachen kann. Es wird dann aber teurer und man verschenkt einen optimalen Start.

Die Vernetzung, Verlinkung und das Bewerben einer Website umfasst folgende Disziplinen:

• Onsite Suchmaschinenoptimierung
• Suchmaschinenmarketing (z.B. AdWords)
• Bannerkampagnen
• etc.

Vertiefen kan man seine Kenntnisse darüber u.a. in On-Site-Suchmaschinenoptimierung oder im Internet Marketing Handbook.

Qualitätssicherung

Die Qualitätssicherung erfolgt durch saubere Methodik und Arbeitsweise während des gesamten Prozesses. Sie bildet einen parallel verlaufenden Teilprozess. Bei großen Projekten empfiehlt es sich sogar, hierfür eine Person zu haben, die diesen steuert und überwacht. Tipps und Empfehlungen liefern u.a. diese Artikel und Übersichten:

• Maßnahmen zur Qualitätssicherung von Websites
• Qualität (Folge 1): Briefing und Vorbereitung
• Gute Seiten, schlechte Seiten: 7 Qualitätskriterien zur Beurteilung von Webseiten – und Web-Designern
• UITest.com: Links für Webentwickler

Betrieb & Management

Diejenigen, die eine Website planen und realisieren, sind oft auch diejenigen, die später für deren Betrieb verantwortlich sind. Fliegt eine große Unternehmenswebsite erst mal, fängt die Arbeit so richtig an. Oft ist es nicht zu glauben, wieviel Arbeit im Betrieb einer Website steckt. In größeren Unternehmen bildet das Management der verschiedenen Websites einen Fulltimejob.

Ein Betriebskonzept umfasst dabei u.a.

• Wartungszyklen und -verträge
• Prozesse und Kommunikation im Team (ggf. auch raus zu Dienstleistern, die dabei behilflich sind)
• Regelmäßige Qualitäts- und Erfolgskontrolle
• Aufnahme und Verarbeitung von Feedback
• Analysen und Konzepte zur Weiterentwicklung und Verbesserung in kleinen Schritten
• etc.

Kommunikation

Man sollte sich auf Kommunikationsregeln einigen und einen guten Ton pflegen, auch wenn’s mal etwas stressiger ist. Aber auch die Kommunikation zu den Kunden ist wichtig. Dabei geht es nicht rein um die Aufnahme von Anforderungen und Aufträgen, oder die Lieferung von Zwischenergebnissen. Oft gehört es sogar dazu, den Kunden ein Stück weit Wissen und Verständnis zu vermitteln. Ein Beispiel dazu habe ich unter dem Titel “Informationsarchitektur vermitteln” mal beschrieben.

Auch zum Thema Kommunikation finden sich immer wieder gute Artikel im Web. So z.B.

• Gesprächsführung in der Kundenkommunikation
• Flexible Fuel: Educating the Client on IA
• Educating clients to say yes

Fazit und Ausblick

Dieser Artikel konnte auf Grund des thematischen Umfangs nicht weiter ins Detail gehen. Die einzelnen Aspekte beinhalten wiederum Ansatzpunkte für einzelne Folgeartikel. Diese werden nach und nach geschrieben und erscheinen.

Unser Beruf hat mehr zu bieten bzw. fordert er mehr von uns, als die Arbeit mit Photoshop, XHTML, CSS und Javascript. Natürlich kann eine Person nicht alles abdecken. Aber man sollte sich seine Schwerpunkte nicht all zu eng setzen. Der Webdesignprozess ist vielseitig, vielfältig und vielschichtig.

Weitere Quellen zum Thema

• The Greatest Secret in Web Design
• Web design is not a commodity
• How Much (work) is a Website? A lot!
• Successful Website Checklist Challenge
• The Best Damn Web Marketing Checklist
• Web design process

Im deutschsprachigen Raum helfen außerdem die Beiträge der Webkrauts weiter und bieten viele sehr gute Denkanstöße für die tägliche Arbeit.

Zum Webdesignprozess als Ganzes, konnte ich keine weiteren deutschsprachigen Artikel auftreiben. Zumindest sind mir dazu keine aufgefallen. Ggf. habt Ihr noch Tipps dazu, über die sich die Leser dieses Artikels und ich freuen würden ;-)

Wir alle lieben Muster (Patterns), die uns als Orientierung dienen. An guten (Design-) Mustern hangelt es sich besonders bequem entlang. Patterns sind auch in der Webentwicklung eine gute Hilfe. Immer wieder liest man über diese, solche und noch mehr Muster für dies und das.

Peter Hornsby beschreibt auf UXmatters den, nicht ganz so geläufigen, umgekehrten Ansatz. Er erläutert die Antipatterns an Hand griffiger Beispiele.

Patterns machen vielleicht auch etwas unflexibel

So bequem es ist und so sicher man sich mit bekannten und etablierten Designmustern fühlt, so unflexibel droht man auf die Dauer zu werden. “Nur so. So funktioniert das auf jeden Fall”.

Abhilfe durch Antipatterns

Genau hier können die Antipatterns helfen. Sie zeigen die möglichen Stolpersteine und Fehlerquellen auf. Mit dem Ziel, daraus resultierende Fehler zu vermeiden, um auf der anderen Seite aber weiter kreativ und flexibel bleiben zu können. Ein erweitertes aus Fehlern lernen. Typische Probleme strukturiert im Keim ersticken.

Außerdem kann man es so, den weniger fachkundigen Personen beibringen, auf bestimmte Features zu verzichten. In dem man ihnen die negativen Folgen, eines nicht zielführenden Einsatzes bestimmter Features oder Designelemente, vor Augen führt. Das kann zur Einsicht führen, dass weniger eben oft viel mehr ist.

Beispiele für Antipatterns

An Hand zweier Beispiele – besser zwei Klassiker – erklärt Peter das Prinzip der Antipatterns.

• Click Here
• Shiny Thing

Oder auch bekannt als die beiden Klickibuntis.

Jedes Antipattern hat eine Reihe von Attributen, die es beschreiben und erklären. Wie z.B.: Name, typischer Ort des Auftretens, Ursachen, Gründe für das Auftreten, Hintergründe, Symptome, Konsequenzen, Ausnahmen, etc.

Diese Attribute sind nicht festgenagelt und lassen sich auch individuell kreieren. So kann man mit der Zeit eine kleine handliche Bibliothek von Antipatterns entwickeln.

Antipatterns als Ergänzung?

Mir war dieser so systematisch vollzogene Antipattern-Ansatz bisher unbekannt. Er ist aber eigentlich ganz interessant. Kombiniert mit “herkömmlichen” Patterns, können Antipatterns eine Bereicherung für Kreativität, Flexibilität und Qualität von Nutzeroberflächen bilden.

Ausführlicher Originalartikel: Antipatterns. Foto Original bei flickr: Antipattern.