Spiel, Satz, Sieg: Erfolgsfaktoren in Web-Projekten

17.06.2010

Vor 14 Tagen haben wir die grundlegenden ersten Schritte in jedem Website-Projekt beleuchtet.

Heute gehen wir zwei Schritte weiter und machen uns Gedanken darüber, wie man Inhalte und Design so plant, dass alle Beteiligten ihre Arbeit zügig und ohne Komplikationen erledigen können. Mit ein paar grundlegenden Kniffen machen Sie dann leicht alle glücklich – vom Web-Designer über den Programmierer bis zum Endkunden. Damit ist der Weg zu einer kostenschonenden und erfolgreichen Website fürs Erste geebnet.

Ganz ersparen kann ich es Ihnen leider nicht: Eine Website macht Arbeit, vor allem wenn sie noch nicht existiert. Ob Sie erstmals eine Internetpräsenz planen oder an einem Relaunch arbeiten, spielt kaum eine Rolle; die zu erledigenden Arbeiten sind bis auf die Inhaltsarbeit in der Regel identisch. Beim Relaunch stellt sich vorab die Frage, ob es sich um eine umfangreiche Umstellung handelt, zum Beispiel weil Sie ein leistungsfähigeres Content-Management-System brauchen, oder ob Sie nur ein optisches Facelifting planen.
Aus dem Briefing, das wir im ersten Teil des Workshops besprochen haben, entwickeln wir im nächsten Schritt das so genannte Grobkonzept. Wir erinnern uns: Im Briefing haben wir in ers-ter Linie marketingrelevante Information gesammelt, die Rahmenbedingungen für das Projekt definiert sowie grundsätzliche Ideen für die zukünftige Website entwickelt. Im Grobkonzept ist unsere Aufgabe nun alle inhaltlichen, organisatorischen und technischen Parameter abzuklopfen und auf Reihe zu bringen.

Erstmal den Kopf frei machen
Als ersten Schritt der Konzeptphase empfehle ich immer ein ausgiebiges Brain-Washing. Besonders bei Relaunch-Projekten lauert die große Gefahr, dass man sich stark vom alten Status Quo leiten lässt. Also: Vergessen Sie Ihre „Alte“ fürs Erste, sie ist eine Kreativitätsbremse. Sicher, wer eine ausgezeichnete Website hat und nun eine noch ausgezeichnetere möchte, spart sich vermeintlich Arbeit, wenn er einfach alles Gute noch mal genauso gut macht. Unter dem immer gegebenen Kostendruck neigt man dazu, diesen kurzen Weg zu gehen.
Leider bleibt der Blick für die schönen Details jenseits des bereits Bekannten oft im Verborgenen. Mit den schönen Details meine ich die offen vor uns liegenden Schätze des Internets.

Es gibt fast alles gratis
Ich muss sicher nicht erwähnen, dass es Zigmillionen Websites mit Shops und allerlei Tamtam gibt, an denen man sich ein Beispiel nehmen kann. „Halt!“, schreien zum Beispiel meine Studenten an der BAW in München
immer, „Darf man das? Abkupfern?“ Meine vorsichtige Antwort: „Ja. Ideen holen immer, tatsächlich abschreiben natürlich nicht.“ Der nächste Schritt im Website-Konzept ist, den Stand der Dinge in technischer, wichtiger aber marketing-konzeptioneller Hinsicht herauszufinden. Und nichts ist leichter als das, man muss sich nur die Websites der Besten anschauen und zwar nach diesem Schema:
1.    Direkte Wettbewerber
2.    Indirekte Wettbewerber
3.    Ausgezeichnete Handels-Websites auf ausländischen Märkten
4.    Websites erfolgreicher Händler anderer Branchen.
Alle grundlegenden Konzepte und Ideen liegen also wie ein offenes Buch vor Ihnen, lernen Sie durch einfaches Zuschauen von den Besten. Suchen Sie sich die Dinge heraus, die für den Eigenbedarf bzw. Ihre Kunden vielversprechend klingen. Wichtig: Lassen Sie Selbstbeschränkungen (kein Geld, keine Zeit, keine Ahnung) erstmal unberücksichtigt und machen Sie eine „Will-Ich-Haben-Liste“. Diese Liste diskutieren Sie mit Ihrem Dienstleis-tungspartner auf Sinn sowie technische und wirtschaftliche Machbarkeit.

Der Benutzer steht im Vordergrund
Bei der späteren Auswahl der für Sie passenden Inhalte und Werkzeuge
legen Sie Ihr Augenmerk auf die Bedürfnisse Ihrer Kunden. Dampfen Sie die „Ich-Will-Haben-Liste“ in eine „Braucht-Mein-Kunde-Liste“ ein. Was aber braucht der? An dieser Stelle möchte ich alle Inhaber von Geschäften mit Publikumsverkehr dringend auffordern, einen kurzen Fragebogen zu entwerfen, mit dem man Bedürfnisse direkt am lebenden Objekt hinterfragt. Schon 20 kurze Interviews bringen fast immer gut verwertbare Informationen und Fragen kostet bekanntlich nichts. Natürlich sind die grundlegenden Kundenbedürfnisse in Bezug auf gute Websites heute hinlänglich bekannt, nämlich
∙    Schnelligkeit,
∙    Übersichtlichkeit und
∙    Einfachheit,
dennoch ergeben sich besonders im Bereich der Spezialsortimente oft noch zusätzliche Informationswünsche, speziell bei den stark erklärungs- und beratungsintensiven Produkten. Normalerweise sollte jeder Händler wissen, was seine Klientel am meisten braucht; die Erfahrung zeigt jedoch, dass hier trotzdem oft schlampig geplant wird.

Das Grobkonzept
Mit den Daten und Ideen, die Sie jetzt zusammengestellt haben, können Sie Ihr Website-Projekt schon recht gut beschreiben und skizzieren. Ich empfehle dringend, eine übersichtlich gegliederte Schriftfassung anzufertigen, die als Arbeitsgrundlage für das gleich folgende Feinkonzept und natürlich auch als Ausgangspunkt für die Zusammenarbeit mit einem Webdesigner oder ähnlichen dient.

Das Feinkonzept
Während das Grobkonzept einen Eindruck vom Ganzen vermitteln soll, ist das Feinkonzept der Teil unserer
Planungsarbeit, der jeden einzelnen Baustein, jede Seite eines Web-Projekts im Detail beschreibt. Es besteht in der Regel aus zwei Teilen:
a)    dem Strukturbaum und
b)    dem Storyboard.
Der Strukturbaum ist die übersichtliche Aufgliederung aller Einzelseiten in ihrem Zusammenhang. Er ist Grundlage für den Entwurf aller Navigationselemente. Hier wird klar, was wie zusammenhängt. Ohne diese Übersicht sind Grafiker und Programmierer angeschmiert. Das Storyboard ist das „Drehbuch“ oder auch Produktionshandbuch der Website. Jede Seite im Strukturbaum hat hier eine eigene Seite, auf der man alle produktionsrelevanten Informationen zusammenfasst. Das sind (stark verkürzt):
1.    Alle META-Angaben von Titel bis Zusammenfassung
2.    Position im Seitenbaum
3.    Texte
4.    Bildmaterial
5.    Links
6.    Und alles andere, was Platz auf Ihrer Site finden soll.

Eine festgelegte Form für das Story-board gibt es nicht, jeder kocht da sein eigenes Süppchen. Damit Sie sich ein Bild machen können, habe ich Ihnen ein paar Musterdokumente zum Download bereitgestellt; die Links finden Sie im Kasten. Wenn Sie zusätzlich zur Website einen Online-Shop planen, müssen Sie für jedes Produkt ebenfalls eine Seite im Storyboard erstellen. Klar, ein umfangreiches Storyboard macht schnell ordentlich Aufwand, aber je besser und detaillierter es ist, desto schneller werden Sie und Ihre Dienstleister fertig, desto weniger Rückfragen werden Sie beantworten müssen und auch das Kostenrisiko verringert sich. Ein schöner Nebeneffekt ist, dass durch die
intensive Auseinandersetzung mit dem Konzept viele Unwägbarkeiten ans Licht kommen, die dann in der Produktionsphase keine Schwierigkeiten mehr machen.

Storyboarding spart Geld
Ein weiterer Grund, warum ein Storyboard bares Geld spart, ist: Jeder Gedanke, den Sie sich selber machen, müssen Sie nicht in Auftrag geben. Wenn Sie das Produktionshandbuch als Unternehmer intern verfassen, haben Sie die ideale Auftragsgrundlage für jeden Dienstleister. So bleibt der vereinbarte Pauschalpreis für Design und Programmierung eher frei von Überraschungen, vorausgesetzt Sie halten sich an eine eiserne Regel: Beginnen Sie keine Design- oder Programmierarbeiten, wenn Strukturbaum und Storyboard nur halb- oder dreiviertelfertig sind. Jede spätere Änderung bedeutet Geld- und Zeitverschwendung.

Start ins Web-Design
Wenn Sie es bis hierher geschafft haben, ist je nach Umfang schon viel Wasser die Isar herunter geströmt. Ein vollständiges Storyboard ist aus meiner Dienstleistersicht leider eher die Ausnahme, aber jetzt wissen Sie ja
Bescheid. Nun, da wir alle Planungsschritte durchlaufen haben, wenden wir uns dem grafischen Teil des Projekts zu. Web-Design unterscheidet sich in seinen Grundsätzen nicht vom klassischen Print-Design, jedoch muss es wesentlich mehr Anforderungen unter einen Hut bekommen. In erster Linie handelt es sich bei Internet-Oberflächen um ein Stück Software, das der Nutzer bedienen muss. Wenn das Bedien-Konzept nicht funktioniert, ist auch das schönste Design für den Müll-eimer. Auch wenn es vielen Designern weh tut: Die Benutzerführung steht in der Wichtigkeit über dem grafischen Konzept und den Anforderungen an das Erscheinungsbild des Unternehmens. Hier entsteht das erste Spannungsfeld, denn nicht jeder gute Designer ist auch gleich ein guter Web-Designer. Ein paar Buttons hier und da machen noch kein Bedienkonzept.
Alles aber nicht so wild, denn auch hier haben sich im Laufe der Jahre einige Standards herausgebildet, mit denen man eigentlich nichts falsch machen kann. Wer ein Web-Design in Auftrag gibt, sollte lieber genau fragen, ob der Wunschpartner auch über ausreichend technischen Hintergrund verfügt (Achtung! Hier wird natürlich viel geflunkert.), denn nur dann greifen Design und Programmierung effizient ineinander. Besonders klassische Werbeagenturen haben hier oft große Defizite, was sich in zusätzlichen Abstimmungen zwischen Design und Technik widerspiegelt.
Das Navigationskonzept
Als Standard für fast alle Fälle hat sich die „Umgedrehte-L-Navigation“ etabliert. Das bedeutet: Eine Hauptnavigation mit wenigen Oberpunkten horizontal im oberen Bereich der Seite, eine vertikale Sekundärnavigation am linken Rand. Beides lässt sich natürlich kreativ erweitern und optisch aufpeppen, abweichen sollte man davon nur an begründeten Ausnahmefällen. Aus diesem Grundaufbau heraus ergibt sich ein für den Nutzer berechenbares Gesamtbild, in dem er sich auch ohne Hilfe zurechtfindet.
Die Angst, man könne damit in der gestalterischen Bedeutungslosigkeit verschwinden oder gar als zu gewöhnlich gelten, ist unbegründet. Der kreative Gestaltungsspielraum ist auch jenseits gültiger Standards noch groß genug. Außerdem hat ein guter Gestalter Ihre Kunden im Blick und seinen tief brennenden Wunsch nach einem Preis fürs Web-Design des Jahres gut im Griff.

Verschiedene Seitentypen entwickeln
Als letztes entwickeln Sie alle wesentlichen Seitentypen, beginnend mit der Startseite. Die meisten Websites kommen mit zwei bis drei Seitentypen („Templates“) aus, umfangreiche Projekte haben aber auch schon mal 20 oder mehr. Machen Sie sich bitte klar, dass die (meist in Photoshop gestalteten) Entwürfe in der Darstellung oft noch erheblich von der „echten“ Website abweichen, da insbesondere der Textfluss in einem Browserfenster anders ausfällt als in einer statischen Bilddatei. Nehmen Sie den Gestalter also nicht zu hart an die Kandare, wenn später kleine Abweichungen zwischen Theorie und Praxis auftauchen.
Im nächsten und letzten Teil unseres Workshops wenden wir uns dem Thema „Content Management“ zu und natürlich der gesamten Produktionsphase. Ich freue mich, wenn Sie wieder mitlesen. Fragen zum Workshop beantworte ich gerne, wenn Sie mir an Diese E-Mail-Adresse ist gegen Spambots geschützt! JavaScript muss aktiviert werden, damit sie angezeigt werden kann. schreiben.

Nils-Peter Hey