42
1 Website-Konzeption - Von der Theorie in die Praxis Vortrag von Marinela Cosic, 11558 Michèle Friedrich, 11570 Medienwirtschaft SS 02 Medienkonzeption 1 Prof. Ferdinand 17.06.02

Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

  • Upload
    others

  • View
    3

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

1

Website-Konzeption -

Von der Theorie in die Praxis

Vortrag von Marinela Cosic, 11558

Michèle Friedrich, 11570

Medienwirtschaft SS 02 Medienkonzeption 1

Prof. Ferdinand 17.06.02

Page 2: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

2

Inhaltsverzeichnis Einleitung 3

1 Definition 4 1.1 Projektstart 4 1.2 Analyse 5 1.3 Online-Strategie 8 2 Kreation 12 2.1 Ideenentwicklung 12 2.2 Main Idea 13 3 Umsetzung 16 3.1 Grobkonzept 16 3.2 Inhalte 18 3.3 Funktionen 20 4 Entwicklung 23

4.1 Grundlagen 23 4.2 Bausteine 25 4.3 Website-Typen 27 4.4 Management 29 5 Produktion 31 5.1 Textentwicklung 31 5.2 Content-Handling 32 5.3 Begleitung 33 6 Beispiele 34 6.1 E-Branding 34 6.2 Global corporate Website 35 6.3 Info- und Auktionsplattform 36 6.4 E-Commerce Website 37 6.5 Community Website 38 6.6 Intranet/E-Learning 38

Anhang 39

Literatur 42

Page 3: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

3

Einleitung Das Zusammenspiel von Inhalt, Gestaltung und Navigation sind ebenso entscheidende Erfolgskriterien wie die Akzeptanz der Nutzer. Die Präsentation bietet Antworten auf folgende Fragen:

welche aktuellen Chancen bietet das Internet meinem Kunden? Wie positioniere ich sein Unternehmen im Internet? Wie erreiche ich die Zielgruppe? Wie entwickle ich eine angemessene Erzähl- und Darstellungsform für die

Website? Wie führe ich potenzielle Nutzer durch das Online-Angebot? Wie vermittle ich meine Ideen dem Kunden, wie dem Team? Wie bekomme ich meine Ideen ins Netz? Wie schaffe ich die Basis für eine optimale Website-Produktion?

Erstellung einer Website kann man in zwei Phasen aufteilen, Planung und Realisierung. Dabei hat Konzeption in erster Linie eine Planungsfunktion. In der Phase der Realisierung steht sie für Rückfragen zur Verfügung und kontrolliert die Ergebnisse aus inhaltlicher Sicht.

Page 4: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

4

1 Definition 1.1 Projektstart Annäherung und Analyse

am Anfang steht eine Anfrage: zum Teil wissen die Unternehmen heute

genau über die Chancen, die das Internet bietet, bescheid. Briefing: Anfrage mündlich oder schriftlich mit einer Beschreibung des

Vorhabens in Form eines Briefings (ein paar Stichworte bis hin zu einer komplexen Projektdefinition, je nach dem wie gut das Unternehmen sich mit diesem Projekt auseinander gesetzt hat oder wie groß seine Internet-Kompetenz ist. In der Regel bleiben aber Fragen offen, es zeigen sich erste Unstimmigkeiten oder der Kunde will zu viel in einem Schritt erreichen, was nicht machbar ist.

eine intensive Kommunikation: ist notwendig auch wenn das Briefing schon sehr konkret ist, um Missverständnissen vorzubeugen, es sollten viele Fragen gestellt werden, möglichst auch viele Details besprochen werden, um hier schon keine Missverständnisse entstehen zu lassen.

Auftragschancen

Prüfung ob eine Zusammenarbeit erfolgreich wäre: Ob ein Auftrag zu Stande kommt, hängt nicht nur von dem Auftraggeber ab. Auch von der Agentur hängt es ab, ob sie diesen Auftrag annimmt oder nicht. Die Agentur und der Kunde können in dieser Phase schon feststellen, ob die Vorstellungen sich ähneln und ob eine Zusammenarbeit sinnvoll wäre, denn für das Gelingen des Projekts ist es wichtig, dass die beiden zusammen passen. Möchte z. B. ein Kunde auf schnellstem Wege zu einer akzeptablen Lösung kommen, wird dieses zu Konflikten mit einer innovativen Agentur führen. Dies wäre für beide Beteiligten nicht sinnvoll. Oft kann es sich eine Agentur nicht leisten, einen Auftrag abzulehnen daher ist dies wohl eher eine idealistische Vorstellung.

Sammeln von Kundenwünschen: Durch Gespräche kann man viel besser erfassen, was dem Kunden wichtig ist, worauf er Wert legt um darauf mehr zu achten. Auf diese Weise kann man eine Auftragserteilung wahrscheinlicher machen.

Erfassung der Projektchancen: Die Agentur kann rausfinden, ob ein echtes Interesse an einer Zusammenarbeit besteht um bei geringeren Aussichten auf eine Zusammenarbeit nicht zuviel Zeit und Geld in einen Entwurf zu investieren.

Pitch-Präsentationen: es werden mehrere Agenturen eingeladen, im Wettbewerb um den Auftrag zu präsentieren, hier weiß man nie ob eine Entscheidung vorab getroffen worden ist, und die Präsentationen pro forma inszeniert werden.

Page 5: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

5

1.2 Analyse Positionierung

Sammeln von verschiedenen Fakten und Werten: Durch die Analyse eines Unternehmens werden Fakten und Werte gesammelt, die seine Entstehung, momentane Positionierung und perspektivische Ausrichtung kennzeichnen. Größe, Struktur, Philosophie, Kultur, Strategie, Produkte, Marktstellung, Image, Einstellung und Erfahrungen zu und mit dem Internet spielen auch eine entscheidende Rolle bei der Konzeption später.

Einfluss auf Strategie, Inhalt und Gestaltung: Diese Faktoren haben Einfluss auf die Online-Strategie, Inhalt und Gestaltung. Aus Broschüren und Gesprächen, aber auch aus Sekundärquellen sollte man sich ein umfangreiches Bild über den Kunden machen.

Unternehmensstrategie: Die Online-Strategie muss mit der Unternehmensstrategie übereinstimmen.

Unternehmensstruktur: wird oft als Vorbild für die Website-Struktur genommen. Man kann keine Gegenvorschläge machen, wenn man diese nicht kennt.

Marktpositionierung: Positionierung auf dem Markt, manchmal sehr komplex, z. B. Siemens, viele Bereiche, Gemeinsamkeit: die Marke Siemens, bei anderen dagegen spielt der Name des Unternehmens keine große Rolle, es sind nur die Tochterunternehmen bekannt, Beispiel: Procter & Gamble (Knorr und Ariel). Dies zeigt, dass die Positionierung eines Unternehmens sehr komplex sein kann. Im Beispiel Procter & Gamble fokussiert man dann die Tochterunternehmen.

Im Analyseprozess kann man noch nicht absehen, welche Faktoren von Bedeutung sein werden, deswegen sollte man möglichst alle erfassen!

Entscheider

Man muss von Anfang an wissen, wer der Entscheider ist, denn nicht immer ist der Ansprechpartner auch der Entscheider über das Budget oder der Inhalt-Abnehmer. Ein Inhaber z. B. ist meistens auch der Entscheider, wenn er in einer fortgeschrittenen Projektphase die Idee nicht gut findet, muss man von neuem anfangen. Dies kostet Zeit und Geld. Es sollte ein klares Reglement für das Change-Request vereinbart werden. Wer trägt die entstandenen Kosten im Falle einer Änderung oder eines Abbruchs des Projektes. Der Entscheider muss am Anfang des Projektes feststehen und rechtzeitig in das Projekt involviert werden, damit man nicht immer wieder von null anfangen muss. Beispiel: Design und Konzept werden vom Marketingleiter abgesegnet und das Projekt läuft weiter, dann kommt der Inhaber und ist nicht zufrieden.

Prozesse

Auswirkungen auf Verlauf und Prozess: die Unternehmensprozesse

haben Einfluss auf den Projektverlauf und auf das Konzept. Groberfassung: um die Zusammenhänge des Unternehmens besser zu

verstehen, werden die Prozesse grob erfasst.

Page 6: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

6

Bei prozessorientierten Websites: Detailanalyse: Beispiel 1: Entwirft die Agentur eine Online-Banking-Website muss sie genau wissen, welche Daten für die Überweisung erfasst werden müssen, wie Konten verwaltet werden usw. Beispiel 2: Adidas startete ein Pilotprojekt, bei dem die Kunden mit einem 3D-Scanner ihre Fußmaße erfassen lassen konnten, so dass der Schuh individuell gefertigt werden konnte, hier muss man über den Prozess der Fertigung informiert sein.

Entwicklung, Fertigung, Vertrieb: Wie ist die interne und externe Kommunikation aufgebaut? Hier braucht der Konzeptionsverantwortliche Kenntnisse über Zulieferung (zugelieferte Produktbestandteile schränken die Konfiguration ein oder müssen angepasst werden), Fertigung (muss immer beachten, für welchen Empfänger produziert wird und was genau) und Lieferung (es wird eine schnelle Auslieferung erwartet) des Unternehmens.

Bedarfsanalyse und Optimierung: Manchmal kommt es zu Workshops bei denen diese Prozesse optimiert werden zu Gunsten eines besseren Gelingens. Diese Analyse ist auch deswegen sinnvoll, weil man die Kosten auch besser einschätzen kann, wenn man weiß was vorhanden ist, und was noch benötigt wird.

Technische Infrastruktur

Effiziente Implementierung: Analyse der bestehenden Technischen Infrastruktur soll aufschlüsseln, wie das Projekt möglichst effizient in das bestehende System implementiert werden kann und welche Voraussetzungen noch geschaffen werden müssen.

Einfluss auf den Inhalt: Wichtig nicht nur für den IT-Bereich, sondern auch für die inhaltliche Konzeption z. B. bietet man auf der Website Produktsuche über alle Bereiche an, müssen die Voraussetzungen im Backend gegeben sein, oder erst geschaffen werden, was sehr aufwendig ist. Hier muss dann abgewogen werden, ob eine solche Maßnahme auch sinnvoll ist.

Einschätzung der Machbarkeit: Außerdem dient die Analyse der Beurteilung der Machbarkeit; wie sieht die interne System- und Softwareausstattung aus, welche Hardware wird eingesetzt, wie ist die Online-Anbindung, welche Browser, welche Datenbanken, wie ist die Vernetzung, gibt es eine zentrale Datenhaltung…

Einschätzung der Kosten: Wenn man weiß, was vorhanden ist, und was noch benötigt wird, können auch die Kosten besser kalkuliert werden.

Ziele

Aufnahme: ein Kunden-Briefing enthält im Schwerpunkt Maßnahmen und Lösungsansätze, welche Inhalte und Funktionen sollen enthalten sein, welche Plattformen besetzt, wann soll das Projekt online gehen. Diese Wünsche sollten aufgenommen werden.

Hintergründe und Motive: Um die Ziele bewerten und notfalls korrigieren zu können, muss man die übergeordneten Ziele kennen (geht es um Imagesteigerung, Gewinnung neuer Kunden, Verbesserung der Kundenbeziehungen oder Kosteneinsparung). Interessant sind aber auch die

Page 7: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

7

Motive, die zum Projekt geführt haben (ein internes Problem lösen, aktueller Trend oder der Druck der Konkurrenz).

Zielhierarchie: was möchte das Unternehmen erreichen, welche Ziele leiten sich daraus für das Marketing ab, mit welchen Zielen ist das Online-Projekt positioniert?

Bewertung: Sie werden analysiert und fokussiert. Dann werden die Ziele bewertet, auf Machbarkeit untersucht und auf Priorität.

Priorisierung: Die Ziele werden selektiert und priorisiert. Ausarbeitung eines Kernziels: Ein klares Ziel muss herausgefiltert

werden, ein Leitstern für alle Beteiligten, und die Unterziele werden festgelegt.

Ressourcen

Pflege der Inhalte: die Website muss gepflegt werden, besonders wenn Aktualität eine große Rolle spielt

Aufklärung des Kunden: hier hat die Agentur eine aufklärende und beratende Rolle. Sie klärt den Kunden darüber auf, was für ein Aufwand die Pflege der geplanten Website mit sich bringen würde.

Personelle und materielle Ressourcen: müssen zur Verfügung stehen. Die Agentur klärt auf, wie teuer das ist, um zu klären, ob, bei nicht vorhandenem Budget, man nicht lieber auf andere Werte setzen sollte, anstatt auf die, die geplant waren. Das zu analysieren, dient beiden Seiten, dem Kunden, weil er von Anfang an weiß, worauf er sich einlässt, und der Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit der Zeit immer schlechter wird. Hier zeigt sich auch schon, ob die Agentur gut ist oder nicht. Es ist eben nicht nur wichtig, ein Ergebnis abzuliefern, sondern auch die Betreuung der Website nach dem Launch ist wichtig.

Budget: Auch das Budget, das zur Pflege zur Verfügung steht, muss berücksichtigt werden.

Festlegung der Werte: zusammen mit dem Kunden werden dann die Werte neu festgelegt und an die vorhandenen Mittel angepasst.

Page 8: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

8

1.3 Online-Strategie (Der Weg zur Erreichung der Ziele) Hierarchie

Erfassung der Hierarchie: Unternehmensstrategie, Marketingstrategien, Produkt-, Preis-, Vertriebs-, Kommunikationsstrategie. Je nach dem um was für ein Online-Projekt es sich handelt, wird das in die entsprechende Ebene eingeteilt. (für eine Corporate-Website ist die zentrale Unternehmenskommunikation zuständig, für ein E – Commerce - Auftritt die Marketingabteilung…

Erfassung der Offline-Maßnahmen: die anderen Maßnahmen sollten erfasst werden

Synchronisation: die Maßnahmen auf der Online- und der Offline-Ebene müssen synchronisiert werden. Ist dies nicht der Fall, verpasst man Synergien und gegenseitige Impulse. Im schlimmsten Fall entwickelt sich die Website zu einem unkontrollierten Selbstläufer, die Internet-Aktivitäten schweifen von der übergeordneten Strategie ab. Die Online-Strategie soll den Marketing-Mix ergänzen, und in ihn eingeschlossen werden.

Die vier strategischen Werte (Bewertungskriterien; bei unreflektierter Übernahme der viele Ziele, die die Analyse hervorgebracht hat, würde es zu einem Einheitsbrei kommen, der keine Differenzierung zu anderen Websites ermöglicht und wahrscheinlich keines der Ziele (das Image soll verbessert werden, Investoren sollen Vertrauen gewinnen, Neukunden gewonnen…) einlösen wird. Um zu einer konzentrierten Projektvision und schlüssigen Strategien zu kommen, müssen die Ziele priorisiert und ein Kernziel identifiziert werden. Dafür braucht man Bewertungskriterien.)

das Produkt: bzw. das Unternehmen von dem man sich ein Alleinstellungsmerkmal erhofft

die Marke: die Vertrauen schafft die Zielgruppe: für die das Angebot im höchsten Maß relevant sein soll der Wettbewerb: von dem man sich deutlich abgrenzen möchte. Wichtig

dabei ist der Benefit (Nutzenversprechen). Das Zusammenspiel: zwischen diesen 4 Werten bleibt aber weiterhin

entscheidend. Bei einem starker Nutzen in einem verschwommenen Markenbild bleibt der Erfolg für das Unternehmen begrenzt, weil der Nutzen nicht mit dem Unternehmen in Verbindung gebracht wird. (z. B. das Moorhuhn-Spiel ist zu einem Massenspielzeug geworden, kaum jemand weiß aber, welcher Whiskey damit beworben werden sollte).

Produkt und Unternehmen

Genaue Betrachtung: um Potenzial für Mehrwerte zu suchen, einen Zusatznutzen.

Benefit: In der Regel ist ein Benefit schon definiert und wird durch die klassischen Medien bereits kommuniziert. Beispiel: die deutsche Bahn bietet nicht nur Fahrpläne und alles was man sonst noch erwarten würde an, sondern auch Tickets zum selber Ausdrucken, und dann auch noch für bestimmte Strecken und Zeiten verbilligt. Sie baut darüber hinaus ein Reiseportal auf, bei dem durch Partnerschaften mit Autovermietern, Hotels

Page 9: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

9

usw. dem Kunden ermöglicht wird, seine komplette Reise vorzubereiten. Die aktuelle Strategie der Deutschen Bahn sieht den Ausbau der Website zum bestbesuchten deutschen Reiseportal vor. Benefit wäre hier also das Online-Ticket.

Alleinstellungsmerkmal: was ist es , was ein Produkt oder Unternehmen von allen andere unterscheidet? Dies kann zusammen mit dem Kunden in einem Workshop erarbeitet werden.

Transfer auf die Online-Plattform: Ist entscheidend, weil durch ihn das zentrale Nutzenversprechen aufgewertet oder durch einen Zusatznutzen bereichert werden soll.

Suche nach den Potenzialen: Die Eigenschaften, die Stärken und die Schwächen, werden unter die Lupe genommen. Aus den Schwächen kann man oft eine Verbesserung ableiten. Beispiel Deutsche Bahn: 1.Man muss oft Schlange stehen; daher könnte die Idee entstanden sein, das Online-Ticket anzubieten, damit man nicht mehr an der Schlange anstehen muss. 2. Züge haben oft Verspätungen; also könnte man ein sms-Service anbieten, so dass man, bevor man zum Bahnhof fährt, eine sms bekommt, falls der Zug Verspätung hat.

USP und SMP: SMP = Single Minded Proposition (formuliert einen Nutzen, der sich auf einen einzelnen Aspekt konzentriert); USP = Unique Selling Proposition (verspricht einen einzigartigen Vorteil, den kein anderes Unternehmen oder Produkt bieten kann. Es ist bei den vielen Angeboten schwer, einenUSP zu finden, einen SMP kann man auch aufstellen, wenn es keinen einzigartigen Nutzen gibt. Die Einzigartigkeit liegt dabei in der Interpretation des Nutzens. Ganz wichtig dabei, ein Versprechen funktioniert nur dann, wenn es auch wahr ist. Dazu muß das Produkt aus unterschiedlichen Perspektiven betrachtet werden.

Marke

Eine innere Welt: existiert erst mal als Vorstellung in den Köpfen der Verbraucher. Die Marke ist etwas, das der Verbraucher mit einem Produkt oder einem Unternehmen verbindet.

Erfassung dieser: es muss rausgefunden werden, was das ist. Viele Fragen, mit Hilfe deren man die Marke vorstellbar machen kann, was hat sie für eine Farbe, was passt zu ihr und was nicht, ist sie eine Katze oder ein Tiger?…

Design: es reicht nicht, die Farbe und das Logo zu übernehmen, es muss eine Welt geschaffen werden, eine Stimmung erzeugt, die zur Marke passt. Ist die Marke dynamisch, leicht, so muss sich diese in dem Design widerspiegeln. Die Identifikation muss in der Ausdifferenzierung stimmen, und das ist am besten in Abstimmung zwischen Offline und Onlineaktivitäten. Z. B. Mercedes-Benz mit seinen Aktivitäten. Da waren der Messestand und die Website zum Genfer Automobilsalon in Übereinstimmung in japanischer Papieralttechnik ausgearbeitet. Eine Marke die für die Leichtigkeit steht, sollte auch entsprechende Navigation und Struktur haben. Für eine Marke, die Vertrauen ausdrückt, wird die Verbindung mit einer experimentellen Benutzerführung zum Konflikt führen u.s.w…

Potenziale des Internets zur Stärkung der Marke: hier könnte man zum Beispiel Online-Spiele zur Verfügung stellen, oder Events bekannt geben,

Page 10: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

10

die vom Unternehmen organisiert werden, um aus der Marke eine Erlebniswelt zu schaffen.

Low-Involvement-Marken: werden durch Partnerschaften informativ aufgewertet oder man versucht sich in reinen Online-Marken, z. B. Procter & Gamble, sie setzen nur vereinzelt auf Produkt-Websites, zum einen betreiben sie E-Brands (man kann die Produkte zusammenstellen und bestellen), zum anderen sieht die Online-Strategie Kooperationen mit reihweitenstarken Plattformen vor, deren Inhalte zu den Marken passen

Zielgruppe

Erfassung der Zielgruppe: der Kunde würde gern möglichst viele Zielgruppen ansprechen.

Priorisierung: Es sollte eine Priorisierung stattfinden, um auf der Homepage die wichtigsten Nutzer mit dem für sie relevanten Versprechen abzuholen.

Kernzielgruppe: Im Idealfall wird eine Kernzielgruppe identifiziert, auf die man sich inhaltlich einstellen kann. Manchmal kann man aber keine Kernzielgruppe bestimmen, ein Buch-Shop bietet Produkte für eine heterogene Masse an, die eigentlich keine Gemeinsamkeiten hat, hier wird es nicht nötig sein, die Zielgruppe zu beschreiben.

Sekundäre Zielgruppen: können durch Subdomains separat bedient oder strukturell tiefer platziert werden.

Zielgruppenanalyse: Das Nutzenversprechen muss mit den Motiven und Bedürfnissen der Zielgruppe kompatibel sein. Dabei sine die demografischen Kriterien weniger interessant als die situations- und rollenspezifischen Kriterien. Neben den Interessen der Zielgruppen müssen auch andere Aspekte berücksichtigt werden: Interneterfahrung, technische Voraussetzungen, finanzielle und zeitliche Ressourcen, Umfeld (Musik oder nicht)…

Customer Relations Management: Um all das zu erfahren, muss man auf unterschiedliche Informationsquellen zurückgreifen. Viele Fragen kann der Kunde selbst beantworten. Vielleicht betreibt er ein CRM, und kann Infos über das Verhalten eigener Kunden liefern. Man kann mit den Mitarbeitern aus dem Kommunikationsbereich sprechen und ihre Erfahrungen miteinbeziehen, man kann Infos über Online-Nutzung im Internet oder Fachpresse finden oder man startet selbst Online-Befragungen.

Online-Befragungen: Entwickeln, die Fokusgruppen einladen und Befragungen durchführen.

Wettbewerb

Analyse: um besser als der Wettbewerber zu sein, muss man ihn kennen. Dies ist durch die

Benchmark-Analyse möglich. Da kann man die Websites der Konkurrenten nach projektspezifisch definierten Kriterien vergleichen und daraus Potenziale für eine Abgrenzung erkennen.

Mehrwert: Man sollte aber nicht versuchen, mehr anzubieten, sondern einen Mehrwert zu schaffen. In vielen Fällen schafft man eine erfolgreiche Abgrenzung eher durch Reduktion auf ein Feature als durch Volumen, weil sonst keine klare Aussage erkennbar ist. (Beispiel: der Hersteller von

Page 11: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

11

ökologischen Eiern verschaffte sich einen Besuchersturm, indem er eine Webcam einbauen ließ, die die freilaufenden glücklichen Hühner ins Netz brachte, und somit sein Versprechen bewies.)

Abgrenzung: so konnte er sich von seinen Konkurrenten abgrenzen. Positionierung und Vision

Zusammenfassung: alles bis jetzt ausgearbeitete wird zusammengefasst, eine abschließende Positionierung der Website wird ausgearbeitet (was kann es, wie groß ist es, was sind seine wichtigsten Qualitäten)

Maximalziel: Die Projektvision definiert das Maximalziel des Projekts Stimulanz: Die Vision sollte nicht utopisch sein, sondern den Idealzustand

zukunftsorientiert formulieren. Potenzialanalyse

SWOT: steht für Stärken, Schwächen, Chancen und Risiken. In einer Matrix werden diese Betrachtungsebenen gegenübergestellt. Aufgabe ist es nun, nach strategischen Ansätzen zu suchen, die aus der kombinierten Sicht abgeleitet werden können. Aus den Schwächen kann man oft Lösungsansätze für Verbesserungen bekommen, die man nutzt, um einen Mehrwert zu erreichen.

Unternehmen: Stärken und Schwächen Markt: Chancen und Risiken Potenziale: letztendlich ist dies eine strukturierte Vorgehensweise zur

Ideenfindung, weil die Ideen meistens nicht vom Himmel fallen

Page 12: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

12

2 Kreation (das Projekt ist beauftragt, die strategischen Ziele festgelegt, jetzt kommt die kreative Phase, man braucht eine zentrale Idee, aus der sich alle weiteren Anforderungen an die Website ableiten lassen.) 2.1 Ideenentwicklung (die vorhandenen Rahmenbedingungen wie Kundenanforderungen, strategischen Ziele, aber auch der Zeit- und Kostenrahmen werden meistens als einengend empfunden und bewirken somit, dass obwohl Kreation den Höhepunkt in der täglichen Projektarbeit darstellt, ein zäher und wenig zielgerichteter Prozess statt findet. Dabei kann es gerade bei Pitch-Situationen wichtig sein, sich schnell auf eine angemessene Idee zu einigen und diese so weit auszuarbeiten, dass der potenzielle Kunde eine konkrete Vorstellung von der Anwendung gewinnt) Die wichtigsten Schritte bei der Ideenentwicklung:

Abgleich der strategischen Ziele: die strategischen Ziele sollten noch mal rekapituliert werden (was soll mit der Website erreicht werden, wer soll angesprochen werden, was ist das zentrale Nutzenversprechen…)

Mentale Einstimmung: Kick-off-Treffen, bei dem jeder das gesammelte Material mitbringt und präsentiert. Oder aber man betreibt Ideen-Benchmarking (einfach durch das Netz surfen und sich inspirieren lassen), oder aber man geht in eine thematisch passende Umgebung und sammelt reale Eindrücke

Ideen sammeln: Die Ideen werden gesammelt und kanalisiert, entweder in Form eines Projekt-Meetings oder mit Hilfe einer Kreativitätstechnik. Diese Phase wird oft unterschätzt, obwohl sie ganz wichtig ist, da der Erfolg weitgehend davon abhängt, ob die Idee gut ist oder nicht.

Ideen clustern: Die Ideensammlungen werden zu Themenclustern sortiert, die verschiedene Ansätze darstellen können.

Ideen kategorisieren: die verschiedenen Ansätze werden im Team diskutiert. Manchmal fallen einige Ideen schon durch die Rahmenbedingungen (Budget, Zeitplanung oder technische Machbarkeit) heraus.

Ideen überprüfen: Die Ansätze werden anhand strategischer Werte noch mal überprüft (ist die Idee der Zielgruppe, dem Markenwert und dem Anbieter angemessen, würde sich die Idee positiv von den Wettbewerbern abheben)

Rücksprache im Team: Durch die Anregungen von Mitarbeitern mit unterschiedlichem Fokus werden die Ideen häufig gefestigt oder aber auch relativ schnell verworfen.

Idee auf den Punkt bringen: Die Idee wird möglichst in einem Satz formuliert und dient dazu die Idee für alle Beteiligten greifbar und präsent zu machen.

Idee ausarbeiten: MainIdea wird ausgearbeitet, wie könnte die Content-Darstellung aussehen?

Rückschluss zu den strategischen Zielen: Die Idee wird noch mal mit den strategischen Zielen abgeglichen.

Page 13: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

13

Kreativitätstechniken

Brainstorming: Hier steht die Quantität vor der Qualität, es geht nur darum möglichst viele Ideen zu sammeln. Kritik und Einwände sind untersagt. Anschließend findet eine Auswertung der Ideen statt. Ziel ist es Ideen zu sammeln, auf den Ideen anderer aufzubauen, und so die Idee zu perfektionieren.

Brainwriting: genau das Gleiche, nur in schriftlicher Form. Methode 635: heißt sechs Teilnehmer, die drei Ideen innerhalb von fünf

Minuten produzieren. Schriftliches Sammeln von Ideen, die schon aufgeschriebenen Ideen werden weiter gereicht, um so die Idee besser auszuarbeiten

Mindmapping: eignen sich gut für planerische und strategische Fragestellungen, aber auch zur Weiterentwicklung von Ideen. Ausgehend von einem zentralen Begriff lassen sich verschiedene Linien abzweigen, die wiederum zu anderen Unterpunkten führen, u.s.w…

2.2 MainIdea (die zentrale Idee aus der sich alle weitern Anforderungen an die Site ableiten lassen) MainIdea

Konzeptionelles Leitmotiv: Obwohl nicht jede Website auf emotionalisierende Erlebniswelten, sondern auf Service oder Informationsvielfalt abzielt, brauch man auch hier ein konzeptionelles Leitmotiv, das Struktur, Inhalte, Design und Navigation zusammenhält. Das Fehlen einer Leitidee führt dazu, dass eine Website inhomogen und austauschbar wirkt. Hinzu kommt noch, dass die strategischen Ziele ohne eine Leitidee ins Leere führen und die Zielgruppe nicht ansprechen. Sie begünstigt die Innen- und die Außenwirkung einer Website (innerhalb des Teams definiert sie das konzeptionelle Leitmotiv, nach außen hin transportiert sie eine Homogenität. (Beispiel VW Turbonium, bei dem die Entdeckung eines neuen chemischen Elementes inszeniert wird. Darus resultiert dann auch die Navigation in Form eines elementaren Periodensystems.

Kein USP!!!: Das USP definiert das Kommunikationsziel, die MainIdea bestimmt die Kommunikationsform. (Beispiel: ein Autohersteller, das umweltfreundliche Autos produziert, dies ist sein USP, anhand dessen eine Leitidee entwickelt werden sollte, die diese Einzigartigkeit auf der Website erlebbar macht, indem die Website z. B. verschiedene Services rund um das Theam Umwelt und Emission anbietet)

Page 14: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

14

Metapher als Leitmotiv (Beispiel: www.turbonium.de)

Ziel: einen kreativen Konzeptansatz zu entwickeln aus dem sich später die Strukturierung der Inhalte, die Navigationsform und das Erscheinungsbild ableiten lassen.

Positive Auswirkung auf die kreative Umsetzung: Die Einführung von Metaphern kann sich sehr positiv auf die kreative Umsetzung auswirken. Da Metaphern meistens etwas veranschaulichen, kann sich jeder, der an dem Projekt beteiligt ist, etwas darunter vorstellen

Keine Übertragung auf die Gestaltung: Wenn man Metaphern wie Wohnzimmer benutzt, heißt das nicht, dass die Idee platt in ein virtuelles Wohnzimmer umgesetzt wird, sie soll nur als Anregung dienen, nicht der Adaption von Szenarios aus dem echten Leben. (Beispiel: www.barmer.de). Mit einem virtuellen Wohnzimmer als Hintergrund würden sich auch sehr lange Ladezeiten ergeben.

Beschreibung eines Gesamteindrucks: (Beispiel: für den Online-Auftritt eines Pharmakonzerns, hat man die Metapher Labor gewählt. Die Metapher ist nicht in Form von Reagenzgläsern und Mikroskopen sichtbar. Ein Labor kennzeichnet sich durch ein spezifisches Klima wie Kühle, Stille und Strenge aus. Dies war die Grundlage für das Design, die Navigation und Inszenierung der Inhalte. Das Grunderscheinungsbild ist durch ein helles und kühles Aussehen geprägt, die Navigation ist statisch und erfolgt nach festen Regeln.

Look & Feel (Beispiel: www.barmer.de)

Der erste Eindruck: Mit dem Aufruf einer Website werden erste Impulse zur Grundstimmung gesetzt. Wird nicht richtig wahrgenommen, und kann auch meistens nicht benannt werden, transportiert aber verschiedene Stimmungen, entscheidet darüber ob sich der Nutzer gelangweit oder angeregt fühlt.

Wirkung: es können verschiedene Wirkungen erzielt werden. Die Site kann aufgeräumt und entspannend wirken, oder aber auch Neugier wecken, oder aggressiv oder freundlich wirken. (Beispiele: www.bolt.com und www.gmund.com, großer Kontrast.)

Verstärkung durch Einzelkomponenten: welcher Gesamteindruck soll vermittelt werden, wer soll dadurch angesprochen werden, welche Einzelkomponenten wie Text, Farbe, Form und Sound können diesen Gesamteindruck unterstützen?)

Content-Inszenierung (Beispiel: www.rtl-world.de)

Angemessenheit: Unter Content-Inszenirung versteht man nicht eine künstlich aufgeladene Animation, sondern eine angemessene Darstellung der Inhalte.

Aufbau der Inhalte: kann nonhierarchisch, spielerisch-animiert, kaskadisch oder linear aufgebaut werden. Auf den meisten Homepages findet man kaskadische oder lineare Aufbau der Inhalte. Diese Form hat sich unter dem Aspekt der Usability bereits als Standard etabliert (Beispiel: www.rtl-world.de und www.siemens-knows.de)

Page 15: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

15

Mehrwert: die Inhalte können, wenn sie angemessen inszeniert sind, auch mit wenig Aufwand einen Mehrwert für den Kunden mit sich bringen, z.B. durch interaktive Features (www.turbonium.com). Hätte man die Informationen in einer statischen Textanordnung untergebracht, wäre die Möglichkeit der Farbkombination weggefallen, und somit auch der Zusatznutzen)

Vorgehensweise: was ist die zentrale Idee, welche Inhalte sollen dargestellt werden, was zeichnet diese Inhalte aus, wie kann ich den Nutzern eine neue Sichtweise auf diese Inhalte eröffnen, welche Mehrwerte lassen sich aus den Inhalten ableiten, die nur im Internet möglich sind, hier bieten sich interaktive Erkundungsmöglichkeiten an)

Navigation führt den Nutzer durch das inhaltliche Angebot, Beispiel: www.nasa20.com)

Unterstützt den Gesamteindruck: indem die deren Inhalte in erlebnis- und nutzenorientierter Weise verknüpft und zugänglich macht.

Angemessenheit: es sollte immer eine angemessene Navigationsform gewählt werden, bei einem Museum könnte man z. B. eine explorative Navigationsform nehmen.

Alternative Navigationsformen: (Beispiel: www.nasa20.com). Dazu sollte geklärt werden, mit welchem Motiv kommen die Nutzer auf die Website, auf welche Weise kann man den Bedürfnissen der Nutzer entgegenkommen.

Page 16: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

16

3 Umsetzung 3.1 Grobkonzept (Dies ist die Phase einer intensiven Facharbeitung in oft fremde Inhalte. Am besten ist es, man holt sich das Wissen von dem Kunden selbst, und nicht aus anderen Quellen). In der Grobkonzeption werden die in der Kreation ausgearbeiteten MainIdea, Look&Feel, Navigationsform und Inhaltsinszenierung in eine überzeugende Sitestruktur übertragen.) Checkliste

Welche abgenommenen Dokumente liegen vor, gibt es weitere Dokumente, z. B. Protokolle, aus denen wichtige Projektinformationen hervorgehen

Liegen die erforderlichen Kundenmaterialien vor, gibt es auf Kundensite einen zentralen Ansprechpartner für inhaltliche Fragen

Liegt ausreichendes Know-how vor, oder gibt es technischen und inhaltlichen Informationsbedarf, sind vertiefende Briefing-Termine notwendig

Welcher Zeitrahmen wird für das Projekt angesetzt, wie viel Zeit kann davon in die Umsetzungsphase investiert werden

Welche Meilensteine sind für das Projekt geplant, wann werden welche Dokumente präsentiert, wie verläuft das Abnahmeprozedere

Wie wurde das Projekt budgetiert, in welchem Kostenrahmen darf sich die Produktion der Website bewegen

Vorgehensweise

Entwicklung der Inhaltsstruktur: Erarbeitung der groben Inhaltsstruktur mir den Oberrubriken der Website

Evaluation der formalen Anforderungen: Diskussion mit dem Kunden welche möglichen Inhaltsformen berücksichtigt werden müssen.

Entwicklung der Content-Module: Entwicklung einer Reihe von Content-Modulen, unabhängig vom dargestellten Inhalt. (Beispiel: eine Videogalerie; hier kann man die vorgesehenen formalen Elemente formulieren, unabhängig davon, wo das Modul lokalisiert wird

Aufbau des Grobkonzepts: Die Inhaltsrubriken und die darunter liegenden Bereiche werden inhaltlich beschrieben, z.B. in Form einer schematischen Skizze, aus der die wesentlichen Elemente (Texte, Tabellen, Videos) ablesbar sind.

Teamanforderungen (es ist sinnvoll sich zu überlegen, wer innerhalb des Teams welche Informationen braucht, dies ist die Aufgabe des Konzeptverantwortlichen, weil er an der Schnittstelle zwischen der übergeordneten Projektplanung und dem operativen Bereich)

Projektmanagement: Für den Projektmanager stellt das Grobkonzept die Grundlage für weitere Kalkulation und Planung dar. Anhand des Site-Umfangs und der geplanten Inhalte und Funktionalitäten kann er einen konkreten Zeitplan aufstellen, die benötigten Mitarbeiter reservieren und die einzelnen Aufwände kalkulieren.

Design: Enge Zusammenarbeit zwischen demjenigen, der aus den zu verarbeitenden Inhalten eine Sitestruktur entwickelt und dem Designer, der

Page 17: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

17

schon erste Screen-Layouts entwirft. Sehr wichtig dabei, ein reger Informationsaustausch. (Beispiel: eine aus 15 Unterpunkten bestehende Navigation mach aus inhaltlicher Sicht Sinn, würde aber das gesamte Layout sprengen, genauso kann es nicht sein, dass die vorgesehenen Funktionen in ein vorgegebenes Layout reingepresst werden müssen. Deswegen sollten im Idealfall alle Entscheidungen gemeinsam getroffen werden.

Programmierung: Je größer und komplexer das Projekt ist, desto größer ist die Notwendigkeit einer engen Zusammenarbeit mit den Programmierern. Für sie ist es wichtig, wie viele Navigationsebenen angesetzt sind, ob Frames angesetzt werden, welche Hauptfunktionalitäten geplant sind und welche Script-Sprache eingesetzt werden soll. Er kann den technischen Aufwand einschätzen und notfalls Alternativen zur Realisierung vorschlagen.

Kundenanforderungen (das Grobkonzept ist…)

Wichtiger Meilenstein: Mit dem Grobkonzept bekommt der Kunde eine konkrete Vorstellung von dem Projekt

Abnahmegrundlage: deswegen wird der Kunde seinen Fokus darauf richten, ob alle seine Anforderungen in der Umsetzung der Website berücksichtigt wurden.

Verständlichkeit: Das Konzept sollte verständlich aufgebaut sein, die Projektvoraussetzungen und die daraus abgeleiteten Maßnahmen sollten für den Kunden transparent sein

Änderungsphase: Der Kunde äußert seine Änderungswünsche, daraufhin wird die erste Version noch mal überarbeitet und sie ist dann die Grundlage für den weiteren Projektverlauf

Kostenvoranschlag: Bei größeren Projekten wird auf der Grundlage des Grobkonzeptes ein weiterer Kostenvoranschlag erstellt, weil jetzt die anfallenden Investitionen noch sichtbarer und deutlicher sind.

Nutzeranforderungen (haben Einfluss auf)

Inhalte: Selbst das exklusivste Inhaltsangebot wird nicht seine Funktion erfüllen können, wenn die Inhalte den Vorstellungen der kunden nicht entsprechen

Funktionen: Auch Service-Funktionen werden auf wenig Akzeptanz stoßen, wenn sie auf der Website nicht zu finden sind, oder an den Interessen der Nutzer vorbeikonzipiert wurden.

Inhaltsstruktur: Man hat heute die Notwendigkeit erkannt, die Inhaltsstruktur den Bedürfnissen der Nutzer anzupassen. (Beispiel: man findet häufig Websites von Versicherungsanbietern, die ihre Webinhalte nicht nach den Produkten sondern nach den Lebenssituationen potenzieller Kunden clustern, wie die Homepage von www.insurancecity.de zeigt)

Aufbau der Website: siehe Inhaltsstruktur

Page 18: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

18

3.2 Inhalte Inhaltsstruktur

Strukturelles und funktionales Grundgerüst: sie ist das Resultat der inhaltlichen Kundenanforderungen und der Anforderungen der Agentur im Hinblick auf die MainIdea

Berücksichtigung der MainIdea: Man sollte die MainIdea immer vor Augen haben

Darstellungsformen: je nachdem wie die Navigation ist, wird auch die Inhaltstruktur ausfallen, bei einer linearen Darstellung fällt sie z. B. simple aus.

Beispiele zur Strukturierung

Beispiel 1: das Unternehmen steht im Mittelpunkt, ohne dass Kommunikationsziele oder auch das inhaltliche Angebot des Unternehmens ersichtlich werden

Beispiel 2: Das Produktangebot wird schnell ersichtlich. Die Online-Serviceleistungen werden nicht separat als eigene Rubrik ausgewiesen, sondern ordnen sich den jeweiligen Produktgruppen unter. Die Inhalte zum Unternehmen sind nicht Teil der Hauptnavigation, sondern über eine separate Navigationsform zugänglich

Beispiel 3: zeigt eine Strukturierung der Inhalte nach Bedarfssituationen. Die Produkte aus den einzelnen Produktgruppen werden bei den Hauptrubriken untergebracht.

Benutzerführung (www.aral.de)

Überblick der Zielgruppen: Aufführung der wichtigsten Zielgruppen der Website

Zielgruppenmotive: Überlegen, was die Hauptmotive für den wiederholten Besuch der geplanten Website sein könnten. (Beispiel: für einen Studenten könnte das Hauptmotiv ein zukünftiger Job, für einen Verbraucher verbesserte Serviceleistungen zu seinem Produkt

Zielgruppennutzen: Es wird der möglichst größte Nutzen anhand der Motive abgeleitet.

Nutzungsanforderungen: es werden die Forderungen formuliert, die sich daraus für die Website ergeben.

Zugangswege: es sollte nun ein Abgleich mit der geplanten Navigationsform stattfinden. Bedient die Navigation alle Anforderungen, oder müssen möglicherweise zusätzliche Zugangswege (in Form von Links, Suchoptionen…) angeboten werden. (Beispiel: www.aral.de bietet verschiedene Zugangswege auf die Inhalte, über die Hauptnavigationsleiste, über die Teaserboxen und über die Pull-down-Menüs für Business- und Privatkunden)

Page 19: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

19

Navigation (www.manhattan-cosmetics.com)

Flussdiagramme: man legt die Führung fest, von welchem Menüpunkt gelangt zu welchem anderen Punkt, in welcher Reiherfolge. Es gibt Leitermodell, Baummodell (Gefahr: lost in hyperspace) und Netzwerkmodell (von überall nach überall, könnte unüberschaubar sein)

Verständlich: die Navigation sollte verständlich sein, so dass sich der Nutzer schnell zu Recht findet und sich sicher fühlt

Überschaubar: Layoutschema und Seitenaufbau (Intro, 1. Ebene, 2. Ebene…) sollten klar sein und auf den ersten Blick erfassbar

Aktuelle Position: der Nutzer sollte jeder Zeit anhand der Navigation erkennen können, wo er sich gerade befindet und was er für Möglichkeiten hat, wohin er gehen kann.

Site-Aufbau (www.nitro.de)

Skizzen und erste Entwürfe: die schon vorliegen, hier wird schematischer Screen-Aufbau oft praktiziert, um die wichtigsten Funktionen, Inhaltsbereiche und Navigationsformen der Website im Grobkonzept grob beschreiben zu können, auch um dem Kunden eine Vorstellung vermitteln zu können.

Sitemaps: jeder einzelne Zweig wird konkret ausformuliert. Man arbeitet sich von oben (von den Oberrubriken) nach unten (zu den Unterpunkten) durch. Dazu später noch mehr.

Inhaltsstruktur: die schon ausgearbeitet wurde

Inhaltsdramaturgie: der dramaturgische Rahmen, aus dem sich die Anordnung und das Zusammenspiel der einzelnen Site-Bereiche ergibt. (Beispiel: www.nitro.de, vermittelt auch gleich ein Lebensgefühl)

Navigation: jetzt hat man sich auch schon für eine Navigation entschieden

Diese vier Aspekte zusammen ergeben den Site-Aufbau. Die Aufgabe der Konzeption besteht hauptsächlich darin, feste Screen-Bereiche für übergeordnete Funktionen (Navigation, Log-in-Felder oder Suchoptionen) und Inhalte zu definieren.

Inhaltsformen

Statische Text-/Bild-Darstellungen: Ist die verbreitetste Form der Darstellung, manchmal ergänzt durch Download-Funktionen. Gerade umfangreiche und informationslastigen Websites beschränken sich auf diese Inhaltsform. Der Grund ist, dass sie einen hohen Aktualitätsaufwand haben und deswegen leicht zum Pflegen sein sollten. Außerdem hängt es auch davon ab, was für Inhalt vermittelt werden soll.

Interaktive Features: Marketingorientierte Websites die auf Fokussierung statt auf Masse setzen, bieten mehr Spielraum in der Umsetzung der

Page 20: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

20

Inhalte. Hier kann man dann interaktive Features gestalten, die den Inhalt anschaulich verdeutlichen und den Nutzer auch emotional in das Thema involvieren. Es ist oft so, dass mit Flash ausgewählte Bereiche animiert und interaktiv umgesetzt sind. ( Beispiel: www.mobiles.siemens.com.au, die Website bietet verschiedene Movies an, die denen die Vorzüge des Handies spielerische erklärt werden.) Sie machen aber nur dann Sinn, wenn die Inhalte dadurch an Informationsgehalt oder Unterhaltungswert gewinnen.

3.3 Funktionen Funktionale Bereiche

Hauptnavigation: alle Navigationspunkte, die einen Zugang auf die Inhalte ermöglichen. Das sind Menüleisten, Navigations-Frames oder Layer-Navigationen. Wichtig für die Gestaltung ist, wie viele Ebenen in der Hauptnavigation abgebildet werden. Bei der Layer-Navigation muss der Platz zum Ausklappen eingeplant werden.

Alternative Zugänge: Häufig gibt es neben der Hauptnavigation auch alternative Zugänge auf die Inhalte, das sind Pull-Down-Menüs oder Teaser-Bereiche. Es muss von Anfang an entschieden werden wo welche Form benutzt wird.

Metanavigation: Hierzu gehören die übergeordneten Funktionen, wie Hilfefunktion, Suche-Button oder Kontakt-Link, diese sollten immer zu erreichen sein und sollten deswegen immer sichtbar an einer bestimmten Stelle auf dem Screen platziert sein und einen festen Standort haben. Es ist einfacher, diese von der Hauptnavigation zu trennen.

Formularelemente: Um diese Bereiche formgerecht in den Site-Aufbau integrieren zu können, muss man möglichst früh die Anzahl und Form kennen.

Notifikationsbereiche: Das ist ein Bereich für die ganz aktuellen Nachrichten. Die Notifikationsbereiche haben einen festen Platz im Aufbau.Banner-Bereich: Es muß von Anfang an geklärt werden, welcher Platz und in welchem Umfang ein Banner-Bereich einzuplanen ist.

Funktionalitäten Transaktionen (alle Funktionen, die Online-Geschäftsprozesse abbilden, Buchungen, Bestellungen, Kontobewegungen oder Vertragsabschlüsse)

Einbindung der Transaktionen: wie werden diese Funktionen auf der Website integriert, gibt es nur eine Rubrik, z.B. Shop, oder wird ein Bestellbutton in die Produktliste aufgenommen -> verschiedener Ablauf

Page 21: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

21

Ablauf der Transaktion: im Grobkonzept sollten die wesentliche Schritte des Transaktionsvorgangs nachvollzogen werden. Daraus wird ersichtlich welche Abfolge der Formulare nötig ist.

Ergänzende Funktionen: Viele Transaktionen benötigen Zusatzfunktionen, die Synchronisation verschiedener Programme und Datenbankabfragen erfordern (Beispiel: Reisebuchung; ihr gehr eine Registrierung voraus)

Technischer und Logistischer Background: Bevor die Funktionen konzipiert werden, muss geklärt werden ob von Kundenseite die notwendigen Ressourcen vorliegen (Beispiel: Eine Bestellung per Nachnahme kann nicht realisiert werden, wenn nicht genügend Zeit und Mitarbeiter zur Verfügung stehen. Ein Kauf über Kreditkarte muss ein bestimmtes technisches Backend haben, um die Sicherheitsstandards und Abfragemodalitäten zu ermöglichen.

Kommunikation

Nutzen und Relevanz: Welche Kommunikationsformen machen Sinn

(jemand aus der Wissenschaft, der nur Informationen braucht, wird sich wahrscheinlich nicht für Plaudereien im Chat begeistern können)

Einsatz der Kommunikationsformen: (Beispiel Chat und Forum). Die ausgewählten Kommunikationsformen müssen integriert werden.

Implizite Funktionen: Die funktionalen Voraussetzungen und Anforderungen sollten schon hier geklärt werden, da eine nachträgliche Änderung sehr aufwendig ist.

Redaktionelle Ressourcen: Der Aufwand für die Bearbeitung von Mails oder Betreuung von Foren wird häufig unterschätzt. Deswegen eine genaue Überlegung und Aufklärung des Kunden. Hier entfallen dann schon die Ideen von Exklusiv-Chats oder 24h-Services.

Tools (die Bereiche, die in sich abgeschlossen sind oder eigenständige Applikationen darstellen, z.B. ein Autokonfigurator oder ein Gehaltsplaner. Bei komplexen Tools findet man manchmal eine separate Anwendung mit einem spezifischen Siteaufbau und einer eigenen Navigation, Beispiel: Audi-Konfigurator läuft als separate Anwendung in einem zweiten Browser-Fenster.

Strukturierung: sie erfordern eine eigene Struktur, Orientierung an der Website

Ablaufszenario: Zur Entwicklung dieser kann man sich eine reale Nutzungssituation überlegen, in der das Tool zur Anwendung kommt. So können dann die notwendigen funktionalen Schritte durchdacht werden.

Verfügbarkeit der Daten: Alles was hier angeboten wird, muss auch als Datenbank vorhanden sein, ist dies nicht der Fall, funktioniert das Tool nicht. (Beispiel: ein Bekleidungsberater, der Styling-Typen für unterschiedliche Stimmungen generiert. Die bedeutet, dass jedes Kleidungsstück mit Stimmungsattributen belegt werden muss.

Technische Integration: Einige Tools sind mit vielen übergeordneten Funktionen verknüpft, diese müssen bei der Konzeption bedacht werden.

Metafunktionen (sind übergeordnete Funktionen wie Such- und Archivierungsfunktionen, Hilfe-Anwendungen oder Glossare)

Page 22: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

22

Definition der Funktionalitäten: bei einer Suchoption z.B. müssen die

Suchattribute entwickelt werden. Inhaltliche und Funktionale Konsequenzen: Anhand der geplanten

Funktionalitäten lassen sich Konsequenzen für einzelne Inhaltsbereiche und Funktionen ableiten

Konzeptioneller Abgleich: die ermittelten Konsequenzen werden noch mal mit den bis dahin konzipierten Inhalten und Funktionen abgeglichen.

Technischer Abgleich: die Entscheidungen werden mit den technischen Experten im Hinblick auf Machbarkeit diskutiert.

Umfeld

Intern, Funktionsbeschreibungen: Die meisten Funktionalitäten sind noch nicht detailliert ausgearbeitet, müssen aber soweit konkretisiert werden, dass Projektmanager und der Kunde das Ausmaß der Funktion einschätzen kann.

Extern, Bewerbung: Die Online-Kampagne zur Produkteinführung erfordert eine Synchronisation mit den anderen Werbemaßnahmen.

Page 23: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

23

4 Entwicklung Wenn es an die Feinkonzeption einer Website geht, müssen Ideen, die bislang auf Papier und in den Köpfen des Teams ausgebrütet wurden, produktions- und netztauglich gemacht werden. 4.1 Grundlagen Ziel ist eine produktionsfähige Vorlage zu erhalten und gleichzeitig dafür zu sorgen, dass der Kunde ein klare Vorstellung vom Ergebnis bekommt. Anspruch

Oberste Zielrichtung des Feinkonzepts ist die maximale Qualität der Anwendung, eine akribische Ausgestaltung aller Module, sowie ein Konzept zu entwickeln, in dem die Main Idea konsequent eingelöst wird.

In dieser Phase wird die Website stark auf Usability, Erlebnis-, Informations- und Servicewert für den Nutzer überprüft.

Vollständigkeit: Alle Schritte vom Einstieg bis zu jeder potenziellen Fehlermeldung müssen durchdacht sein. Das Feinkonzept wird in der Regel von einem technischen Konzept begleitet (Machbarkeitsanalyse).

Effizienz: „Das Konzept ist viel zu umfangreich und außerdem fehlt die Hälfte.“ Um diesem häufigen Vorwurf des Kunden entgegen zu wirken, empfiehlt es sich die folgende Regel zu verinnerlichen. So viele Seiten wie nötig, so wenig wie möglich einplanen. Effizienz bezieht sich auf den Nutzer, also auf schreiben und lesen. Der User ist immer zielorientiert und ungeduldig.

Konsistenz: Bezieht sich auf Form, Funktion, Inhalte, Aufbau, Einsatz von Fachbegriffen, schematische Darstellungen im Feinkonzept. Am sinnvollsten ist ein Regelwerk das logisch und nachvollziehbar ist, definieren von Fachbegriffen, Symbolen und Diagrammen.

Teamabstimmung

Zwischenabstimmung: Interne Kontrolle des Feinkonzepts vor der Kundenabnahme auf Fehler, Unvollständigkeit und offene Fragen. Vorteil: Alle Beteiligten befassen sich schon einmal mit dem Projekt, können Bedenken äußern und erste Vorbereitungen treffen. -> Zeiteinsparung

Versionskontrolle: Immer sparsam mit Versionsveränderungen umgehen. Unterschiedliche im Umlauf befindliche Konzeptversionen sollten unbedingt eindeutig gekennzeichnet sein (1.0, 1.1, ...), um Missverständnissen vorzubeugen. Alte Versionen umgehend aus dem Verkehr ziehen. Änderungen an Versionen am besten schriftlich festhalten, (Wer hat was wann wie geändert -> Änderungshistorie).

Schlusslektorat: Letzte Korrektur des Feinkonzepts rechtzeitig dem Team ankündigen, damit eine sorgfältige Überprüfung durch Design und Programmierung garantiert werden kann. Untersucht wird das Feinkonzept hier noch einmal auf Logikmängel, offene Fragen, Grammatik, Schreibfehler, Flüchtigkeitsfehler.

Page 24: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

24

Abstimmung mit Kunden

Im Angebot wird festgehalten, wie viele Korrekturversionen des Kunden vorgesehen sind. Alle darüber hinaus gehenden Änderungswünsche gelten als Change Request und dürfen von der Agentur extra berechnet werden.

Korrektur und Abnahmeprozedere: Korrekturen durch den Kunden müssen auf Anhieb ersichtlich sein. Sie sollten idealerweise immer in schriftlicher Form festgehalten werden. Auch hier gilt : Wer hat was wann wie geändert?

Testing

In dieser Projektphase wird das Feinkonzept auf Usability, Wording, Verständlichkeit von Text und Hilfefunktionen intensiv untersucht. Oft werden Prototypen erstellt und in Laborsituationen getestet.

nhalicher Fragenkatalog an das Feinkonzept Inhaltlicher Fragenkatalog an das Feinkonzept

Wie läßt sich Die Main Idea am besten darstellen?

Wie ist die Zielrichtung der Siteinhaltl. und funktional erreichbar?

Wie sind Kontakt und Feedbackmög-

lichkeiten gestaltet?

Wo ist eine multimediale

Darstellg(Video)empfehlenswert?

Wie kann ich die Interaktivität für

den Nutzer sinnvoll steigern?

Wieviele Verweise auf Unterseiten gibt es und wo

befinden sie sich?

Wie ist das Navigations-

prinzip festgelegt? Wie muß es verfeinert

werden?

Wie werden Trans aktionen optimal gesteuert?(keine

Abbrüche,verständlicher Weg durch den Prozess)

Wo könnte Hilfe erwartet werden?

Page 25: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

25

Organisatorische Fragen an das Feinkonzept 4.2 Bausteine Das Feinkonzept beschreibt Strukturen, interaktive und lineare Inhalte, Tools, Kommunikations- und Transaktionsprozesse und enthält visuelle Beschreibungsformen mit Textkommentaren. Es enthält obligatorische und variable Bestandteile. Obligatorische Bestandteile

Vorspann: Er beinhaltet das Inhaltsverzeichnis, die Änderungshistorie, Legende und Glossar sowie die Einleitung.

Meta Tags: Dienen der Platzierung in Suchmaschinen. Sie sollten eine hohe Trefferquote und –sicherheit aufweisen. Die Festlegung der Meta Tags übernimmt in der Regel der Konzepter, da er das Projekt am besten kennt.

Sitemap: Wird bis zur untersten Navigationsebene verfeinert, ggf. muß Sie in mehrere Bereichsbäume aufgebrochen werden. Auf konsequente Nummerierung aller Screens ist zu achten, eine Legende sollte immer angehängt sein.

Liegt ein abgenommenes

Grobkonzept vor?

Welche Symbole,Begriffe, graf.Elemente sollen zur Beschreibunggenutzt werden?

Wieviele Korrektur-versionensind kalkuliert?

Liegen alle Assets vor? Welche haben Priorität?

Wird ein Texter benötigt?

Wieviele Leute werden für das

Projekt benötigt?

Welche Teil-

prozesse werden ausgelagert, welche intern produziert?

Wie ist der Zeitplan für Grafik und Programmierg

(parallel arbeiten)?

Wie viele Tage wurden für das Feinkonzept budgetiert?

Page 26: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

26

Asset-Liste: Liste aller Bilder und Texte, die in die Website eingebunden werden sollen. Die Asset-Liste kommt in den Anhang des Feinkonzepts. Darin ist festgehalten, an welcher Stelle diese eingefügt werden, wer sie zu liefern hat und ob sie bereits vorliegen oder nicht. Die Beschaffung der Assets verläuft selten reibungslos. Wichtig: ist hier, Prioritäten zu setzen.

Variable Bestandteile

Prosabeschreibungen: Sie geben Erklärung ab von Funktionen und Abläufen, ergänzen schematische Sichten auf Anwendungen, stiften also in erster Linie Zusammenhänge.

Funktionsskizzen: Inhaltsangabe eines Screens, z.B der Suchfunktion. Eine Suchfunktion besteht aus einem Eingabefeld und einem Bestätigen/Go-Button, nach Abschluß des Such-Prozesses wird dann eine Liste mit den Ergebnissen ausgegeben. Das F.layout gibt keine(!) Aussage über das Layout.

Place-Case: Schematische Screenaufteilung, aus der Container, Module und andere Elemente in ihrer Position ersichtlich werden sollen. Nachschlagewerk für Programmierer.

Elementtabellen: Funktionale oder inhaltliche Bestandteile eines Screens in Form einer Liste. In der Regel aufgeteilt nach funktionalen und funktionsfreien Elementen (Text <-> Buttons). Hier wird bspw. Angegeben, ob es sich um ein Logo oder einen Button handelt und auf welche Unter- oder externe Seite das Objekt verlinkt.

Flow-Diagramme: Beschreiben Prozesse in Transaktions- und Kommunikationsabläufen. Sie sind ein wichtiges Instrument für die Programmierung, da sie Regelwerke und das Verhalten von Objekten beschreiben.

Motion Script: Beschreibt einen linearer und evt. sound-unterstützten Bewegtbildverlauf, zB Flash-Intro.

Datenattribute: Datenbankinhalte (zB Bücher oder Sportartikel) werden nach einem definierten Regelwerk, den Metadaten, aufgerufen. Datenattribute (zB Titel, Autor, Farbe, Größe) sind die Eigenschaften von Produkten, auf die die Suchfunktion reagiert. Sie werden in Tabellen oder Matrix-Form aufgeführt. Mühselige Arbeit, aber wichtig und sorgfältig zu bearbeiten, da eine schlechte Suchfunktion den User leicht verärgern kann.

Page 27: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

27

4.3 Website-Typen Statische Website

Werden im Bereich des E-Business heute nur noch selten eingesetzt. Kommen in reiner Form generell nur noch selten vor.

Das Produzieren einer statischen Website ist dann emphfehlenswert, wenn keine regelmäßigen Änderungen (Aktualisierung) der Inhalte vorgesehen sind

Wird oft bei temporären Sites angewendet, da hier ein CMS nicht lohnt. ZB einmalige Events.

Content-basierte dynamische Website

Content Management System: Generiert sich nach einem dynamischen Regelwerk aus Datenbankinhalten.

Vorteil: Inhalte-, Navigations- und Gestaltungselemente können getrennt

abgelegt und unabhängig voneinander bearbeitet werden. Die Aktualisierung von Webinhalten erfordert keine

Programmierkenntnisse. Geringe Ladezeiten Bereits bestehende Datenbanken können problemlos integriert

werden Kurze Implementierungszeit des CMS Linkmanagement (findet tote Links) Die Redaktion kann die Erscheinungszeit für einzelne Inhalte

festlegen Die Pflege durch Redakteure ist meist einer relativ strengen

Lizenzierung unterworfen. Nur durch die (Passwort-)Freigabe durch den Redaktionsleiter können die Inhalten letztendlich online gestellt werden -> Qualitätskontrollen

Nachteil: Sehr Kostenintensiv

Vorgehen der Konzeption: Erfordert intensive Zusammenarbeit von Konzept, Technik und Design, regelmäßige Gespräche für eine einheitliche Linie und regelmäßige Machbarkeitsanalysen durch die Technik. Diese Art der Website besteht nicht mehr aus einzelnen Screens, da diese nicht mehr ausreichend informativ für eine effiziente Umsetzung der Site sind. Hier kommen Seitenraster, Templates, Container und Module zum Einsatz.

Seitenraster: Grundlayout für alle Templates. Bietet eine grobe Einteilung einer Seite. Auf dem Seitenraster können Felder wie Inhalte, Navigation, konstante Elemente (zBLogo) oder andere Funktionen festgelegt werden.

Templates: Vor der Produktion von Templates wird in der Template-Beschreibung fest gelegt, welche Module und Container auf der Seite vorgesehen sind.Ziele von Templates sind, in der Produktion eine möglichst hohe Wiederverwertung zu schaffen. Im Konzept werden Templates in Form von Place Cases/Seitenraster beschrieben, dh. in Form einer schematische Skizze dargestellt.Ergänzend

Page 28: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

28

wird eine Liste der integrierten Module und Container mit zugehöriger Bezeichnung und Nummerierung angefügt.

Container: Setzt sich aus mehreren Modulen zusammen, zB ein Paket mehrerer Teaser. Die Beschreibung eines Containers erfolgt durch einen Prosatext, eine Funktionsskizze und eine Modultabelle

Module: Sinnvolle Einheit aus funktionalen und inhaltlichen Elementen, zB Suchfunktion (besteht aus einem Eingabefeld und einem Absende-Button). Wird durch kurzen Prosatext, Funktionsskizze und Elementtabelle beschrieben.

Content-Entry-Concept: Das Content-Entry-Concept ist die Eingabe Maske, in der der Redakteur arbeitet. Sie wird zusätzlich zur Ausgabemaske erstellt.

Prozessorientierte Website

Dienen in erster Linie der Produktion von Websites mit intensiven Geschäftsvorgängen, Arbeits- und Kommunikationsabläufen (gewinnen zunehmend an Bedeutung). Die Website wird zur komplexen Software. Solche Aufträge stellen sehr hohe Ansprüche an den Konzepter, weil alle Anwendungsprozesse genau durchdacht, geprobt und umgesetzt werden müssen. Alle Eventualitäten (Fehlermeldungen, Optionsfelder, was geschieht, wenn der User eine falsche Eingabe tätigt etc.) müssen berücksichtigt werden. Hier kommen Flow-Diagramme stark zum Einsatz.

UML (Unified Markup Language): Sprache zur Software-Beschreibung Sie enthält eine strukturierte Sammlung an Diagrammtypen, die Einblicke in das komplexe System (Sitestruktur) gewähren. Die einzelnen Diagramme werden zu einem Gesamtmodell verknüpft. Änderungen in einem Diagramm werden automatisch in den anderen berücksichtigt. Dennoch gilt UML nach wie vor als sehr fehleranfällig und ist daher noch kritisch zu betrachten.

Flash-basiertes Website

Erlauben Animationen mit sehr geringen Ladezeiten ins Netz zu stellen. Da es sich um eine vektorbasierte Software handelt, können Objekte beliebig skaliert werden. Neueste Versionen erlauben bereits die Kommunikation mit Datenbanken. Die konzeptionelle Beschreibung von Flash-movies erfolgt durch ein Motion Script.

Lineare Sequenzen: Bestehen immer aus Anfang, Mittelteil und Ende. Erheben daher hohen Anspruch an das Spannungskonzept (Dramaturgie). Enge Zusammenarbeit zwischen Konzept und Design notwendig.

Interaktive Sequenzen: Hier kommen in der Konzeption Flow-Diagramme zum Einsatz, die ergänzt werden durch Funktionsskizzen Diese Art der Programmierung ist heute bereits häufig anzutreffen.

Loading Files: Während das eigentliche Flashmovie läd, kann ein kurzer Loadingpart den User unterhalten.

Texte: Sollten im Flashbereich sehr sparsam eingesetzt werden und immer vom Kunden abgenommen sein, da nachträgliche Änderungen in einem Flashmovie meist sehr mühsam sind.

Page 29: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

29

Text hat hier mehr als in anderen Website-Typen einen starken Informationscharakter und müssen sehr exklusiv behandelt werden.

Multi-Channel-Anwendungen

Gewinnen in Zeiten des WAP und I-mode zunehmend an Bedeutung.Die

Entwicklung solcher Anwendungen erfolgt meist in XML. Die Restriktionen der einzelnen Endgeräte (Handys, PDA‘s) sind im

Konzept unbedingt zu berücksichtigen. 1.Situatives Umfeld: Wo und in welcher Stimmung werden die Inhalte vom User vermutlich aufgenommen? 2. Technisches Umfeld: Welche Eingabemöglichkeiten (Tastatur) besitzt das Gerät, wie groß ist das Display, wie ist die Gestaltungsqualität (Farbe, Helligkeit). 3. Übertragungszeiten 4. Klare Strukturierung und Formulierung (kurze Texte, Tabellen, wichtige Inhalte ganz nach oben) Wichtig: Interessensituation der User beachten, nur sinnvolle Inhalte anbieten. Hier will der User nicht mit Nonsense belästigt werden.

Trend zu lokalisierten Inhalten (Wegbeschreibung zum Restaurant) 4.4 Management Wirtschaftlich konzipieren bedeutet nicht, möglichst schnell und damit auf Kosten der Qualität zu produzieren. Aber dennoch gilt, je weniger Zeitaufwand, desto höher die Kosteneinsparungen. Wiederverwertung

Nutzung von Erfahrung schafft Raum für Kreation. Formale Erfahrungen

Das Anlegen eines persönlichen Konzeptbaukastens aus Musterkonzepten,

die in Technik, Design und vor dem Kunde gut funktioniert haben wird sich langfristig bewähren. Formal meint hier die Darstellungsweise eines Feinkonzepts, die Symbole, die darin verwendet wurden, die Diagramme, etc. Die Feinkonzepte, die am besten von Technik, Design und Kunde gleich gut verstanden wurden.

Page 30: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

30

Inhaltliche Erfahrungen

Konzepte für Standardprozesse (Banking-Prozesse, Kontaktformulare, Shopping-Prozesse) können ebenso festhalten und ggf. den Mitarbeitern zur Verfügung gestellt werden.

Vorteil: Es müssen nur noch Optimierungsvorgänge gestartet werden. Volle Konzentration auf kreative Prozesse. Auch hier empfiehlt sich die Entwicklung eines Regelwerks für ähnliche Projekte.

Gemeinsam konzipieren

„Viele Köche verderben den Brei.“ Da oft mehr als ein Konzepter für ein Projekt benötigt wird, muß einer das Sagen haben. Er behält den Überblick und fügt am Ende alle Teile zusammen.

Page 31: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

31

5 Produktion 5.1 Textentwicklung Tonalität

Das Tonalitätskonzept ist schon mit dem Grobkonzept zu erstellen, es legt die Regeln und Stilrichtungen des Textes fest (sachlich, emotional, fachspezifisch, umgangsprachlich, „Du“, „Sie“,...)

Medienkonformität

Das Ablesen vom Bildschirm ist noch für viele User unangenehm, viele drucken noch aus. Deshalb muß der Text gut proportioniert, strukturiert und kurz gehalten werden. Er sollte in Kapitel, Unterkapitel mit Subheadlines und gehighlighteten Wörtern unterteilt werden. Komplexe Texte am besten hierarchisch in die Tiefe verlinken.

Text/Bilddramaturgie

Texte und Abbildungen müssen aneinander angepasst sein, um die Wahrnehmungs- und Aussagekraft für den User zu verstärken.

Wording

Die Begrifflichkeiten im besonderen in der Navigation müssen kurz und unmißverständlich sein. Hier hilft oft ein Usability Test. In einem Test wurden den Usern Websites mit dem Wording „Home“,“Startseite“ und “Homepage“. Das Ergebnis war eindeutig der „Startseite“ zuzuordnen.

Konsequenz ist außerdem unerläßlich: „senden“, „absenden“ und „abschicken“ nicht auf der der selben Website verwenden, Einheitlichkeit ist gefragt. Das Wording muss mit Tonalität einhergehen.

Nichtredaktionelle Texte

Dauerhafte oder temporäre Inhalte, wie: o Hilfetexte, Guided Tours o Werbliche Inhalte o Gewinnspiel und Aktionen o Typoanimationen

werden von der Agentur erstellt, sind unabhägig vom Kunden Redaktionelle Texte

Dynamische Websites, bei denen die Inhalte vom Kunden gepflegt werden, sollten in Tonalität und Art zumindest am Anfang von der Agentur geprüft werden

Page 32: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

32

Briefing für Rohtexte

Legt fest, welche Textinhalte in welcher Länge und Strukturierung geliefert werden sollen.

5.2 Content-Handling Die Attraktivität einer Website lebt von der Qualität und Aktualität ihrer Inhalte. Hierfür ist ein effektives Content-Handling notwendig. Je umfangreicher eine Website, desto unentbehrlicher ist ein konsequentes und detailliertes Content-Handling. Das Content-Handling wird meist vom Producer oder vom Feinkonzepter übernommen, da er weiß, welche Headline in welchen Teaser und welcher Container in welches Template gehört. Dateiablage

Ablage aller produzierten Inhalte auf einem zentralen Server. Aufbau und Bezeichnung der Ordner nach der Site-Struktur. Auf verschiedene Versionen achten, gut kennzeichnen. Auf Einheitlichkeit bei den Ordnerbezeichnungen achten.

Content Statuslisten

Den Überblick bewahren. Es empfiehlt sich, auf Basis der Asset-Liste oder des Screenverzeichnisses

eine umfangreiche Statusliste zu entwickeln, aus der die bereits erledigten Komponenten abgehakt werden können.

Redaktioneller Leitfaden

Dieser ist seher wichtig, weil Aktualität oft ein hohes Maß an Zusatzaufwand bedeutet. Er muß bewusst und sinnvoll gestaltet werden, denn möglicherweise ist der Kunde (oder die Agentur) nicht in der Lage später 5 neue Teaser täglich zu produzieren. Verlust der Qualität der Site im Bezug auf Aktualität verärgern den User. Der Leitfaden muß übersichtlich wiedergeben, wo welcher Text in welchem Format wann eingefügt wird und wer sich darum zu kümmern hat.

Page 33: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

33

5.3 Projekt-Begleitung Eigentlich ist nach Abnahme des Feinkonzepts durch den Kunden die Arbeit des Konzepters beendet. Meist jedoch kommen bei der Umsetzung Probleme oder Fragen auf, an die vorher keiner gedacht hat. Außerdem stehen Grafik und Design unter enormem Zeitdruck, da sie die Verzögerung des Konzepts im Bezug auf die Deadline aufholen müssen. Es empfielt sich daher, dass der Konzepter in der Umsetzungsphase den Designern und Technikern zur Verfügung steht. Lernprozess

Wenn mit einem neuen CMS oder Shop-System geplant wurde, sind unangenehme Überraschungen in der Umsetzung vorprogrammiert. Hier lernt auch der Konzepter, welche Fehler er in einem ähnlichen Projekt nicht mehr machen sollte.

Oft ergeben sich auch nur kleine Probleme wie die Länge eines Wortes in der Navigation. Doch auch diese erfordern einen hohen Aufwand bis die Absprache mit Kunde und seine Freigabe abgeklärt sind. Auch hier kann der Konzepter hier viel lernen.

Anpassung

Oft ergeben sich Chancen in der Umsetzung (Techniker stellt zB fest, daß ein Prozess einfacher programmiert werden kann)

Testing

Wenn alle Module der Site zusammengefügt sind, erfolgt ein umfangreiches Testing: Zum einen durch teaminterne Mitarbeiter (kennen das Projekt), zum anderen durch teamexterne Testrunden (wegen vorherrschender Betriebsblindheit) meist mit Hilfe von Probanden aus der Zielgruppe der Website.

Getestet wird auf Vollständigkeit, Funktionalität und auf Nutzerfreundlichkeit. Erst wenn die Site nahezu fehlerfrei ist, wird sie als Beta-Version dem Kunden präsentiert.

Testberichte: Die auftretenden Fehler müssen streng dokumentiert werden (exakte Lokalisierung des Fehlers) Höchste Priorität haben fehlerhafte Funktionen, denn nichts ist ärgerlicher als ein Kaufvorgang, der aus Usersicht nicht zum Erfolg führt. Sind alle Funktionen intakt, kann man sich an die falsch positioniertem Text machen.

Verlangt der Kunde größere Änderungen, werden diese als Change Request betrachtet und extra berechnet.

Page 34: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

34

6 Beispiele 6.1 E-Branding www.bifi.de, www.zomtec.de Agentur: Bartle Bogle Hegarty, London

Ziel

Originelle Markenstrategie innerhalb 4 Wochen entwickeln. Neben den neuen Fernsehspots, war ein Relaunch der Website erforderlich.

Aufgaben der Website

Einen weiteren Baustein einer integrierten Kommunikationsstrategie entwicklen

Dem User einen echten Mehrwert liefern Verblüffen und überraschen wir die TVSpots Sich abheben von typischen Markenwebsites

2-gleisiges Konzept

Zomtec und Bifi Mittelpunkt

fiktives amerikanisches mittelständisches Unternehmen und dessen Mitarbeiter namens Zomtec Zomtec: verunsichert User, da die Website sehr authentisch gemacht ist, halb-professionell produziert, in echter Oldschool-Programmierung (inzwischen auch flash), mit Produktpalette, Umsatzkurve, Mitarbeiter,...

Bifi dagegen ist modern und schlicht gestaltet. Hier steht nur das Produkt, die Wurst, im Mittelpunkt nicht mehr und nicht weniger.

Für Bifi sorgte dieses Konzept für 14% Umsatzsteigerung in wenigen

Monaten.

Page 35: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

35

6.2 Global Corporate Website www.adidas.com Agentur: Pixelpark AG, Berlin

Da in vielen Ländern unterschiedliche Auftritte von Adidas bereits existierten, bestand die Herausforderung für Pixelpark darin, eine Synchronisation alle Auftritte zu schaffen, die die nationalen Belange der einzelnen Länder berücksichtigt. Was heißt das? Die Website der USA sieht genauso aus wie die für Deutschland nur dass auf der einen Homepage Basketball oder Baseball vorzufinden sein sollte, während auf der Anderen Fußball mehr im Vordergrund steht. Ein Zinedine Zidane wiederum ist überall auf der Welt ein Star und gehört daher auf die Global Site. => Schwierigkeit, das alles auf der gleichen Website zu verwirklichen, sind vorprogrammiert. Hier war also ein CMS unerläßlich. Lösung

Eine global Homepage, von der ausgehend man auf die einzelnen Länder Homepages gelangen kann, auf denen dann die einzelnen Interessengebiete verstärkt repräsentiert sind

Problem

Auf den Länderpages mußten gleichzeitig sowohl die Interessen der Teenies wie der Erwachsenen, als auch die der Freizeit- und der Profisportlerunter einen Hut gebracht werden und alle Sportarten abgedecken.

Main Idea

Adidas steht für Qualität, Funktionalität, Design und paßt die Produkte ggf. ganz nach Deinem Wunsch für Dich an.

„Adidas ist Dein feirer Sparingpartner, immer und überall.“ USP

Page 36: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

36

Sportarten-Communities mit Foren, Chats mit Profis, Newsletter, Eventkalender (national und international) Möglichkeit Vereinhomepage unterzubringen, Trainingsplaner, Gesundheitstips, Equipmentberatung

Machte viele Usability-Tests notwendig. 6.3 Info- und Auktionsplattform www.templeflower.de Hier handelt es sich um eine Auktionsplattform, die einer besonderen Navigation bedarf, da die Sites hierarchisch nebeneinander angeordnet sind und aus bedürfnisorientierten Zusatzlinks bestehen. Highlights

Closed Auction: In Echtzeit laufende Online-Auktion für einen hoch exclusiven Bieterkreis. Jeder hat seinen persönlichen Avatar, es gibt einen virtuellen Auktionsleiter. Jeder sieht was der andere tut.

Artfinder: multinationales Planungs- und Informationstool für weltweite Kunstveranstaltungen. Eine Art „Souvenirladen“; wenn man an die „Kasse“ geht, kann man die gesammelten Schätze mit Wasserzeichen und Logo ausdrucken lassen.

In Planung

„Little Templeflower“ für Kinder „Kooperationen mit Kunsthochschulen“

Page 37: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

37

6.4 E-Commerce Website

www.libri.de Komplexes E-Commerce System, das nicht, wie sonst, den Einzelhandel umgeht, sondern die Buchhändler auf der Website mit einbindet. Die Erfahrung zeigte, dass der Vertrauensverlust von Großhandel und Einzelhandel größer ist, als der Umsatz durch Online-Aktivitäten. Libri integrierte die Buchhändler und hat heute über 1000 Partnerschaften auf der Site. Jeder Buchhandel hat die Möglichkeit, eine eigene

Website auf Libri.de einzubinden. Main Idea

Klares Alleinstellungsmerkmal auf dem Büchermarkt generieren, da schon 1800 Online-Auftritte existierten.

Highlights

Über 3000 dt. und internationale Autoren sind vertreten, 1500 Verlage, 600 Bibliotheken => Umfangreichster Titelkatalog und Literaturlinksammlung

Nächste Projekte

Erweiterung des Zahlungsprozesses Kundenpflege mittels Newsletter.

Page 38: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

38

6.5 Community-Website Bsp. www.metropolis.de

(Wurde in unserem Vortrag nicht weiter berücksichtigt. Dient lediglich der Vervollständigung der verschiedenen Formen an Websites)

6.6 Intranet/E-Learning Bsp. eCulture, Hypovereinsbank (Wurde in unserem Vortrag nicht weiter berücksichtigt. Dient lediglich der Vervollständigung der verschiedenen Formen an Websites)

Page 39: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

39

ANHANG 1 Sitemap 2 Asset-Liste

Page 40: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

40

3 Funktionsskizze 4 Place-Case 5 Elementtabelle (Funktionene)

Page 41: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

41

6 Flow-Diagramm 7 Motion Script 8 Seitenraster (Template-Vorlage)

Page 42: Website-Konzeption - Hochschule der Medienferdinand/produktionen/website_vortrag.pdf · Agentur um zu verhindern, dass eine gute Website durch einen schlechten Umgang / Pflege mit

42

Literatur Die vorliegende Hausarbeit ist entstanden anhand des Buches M. Grotenhoff, A. Stylianakis: Website-Konzeption, Galileo Press GmbH, Bonn 2002 1. Auflage 2001