E-Book, Deutsch, 545 Seiten
Reihe: Rheinwerk Computing
Erlhofer / Brenner Website-Konzeption und Relaunch
2. Auflage 2019
ISBN: 978-3-8362-7143-1
Verlag: Rheinwerk
Format: EPUB
Kopierschutz: 0 - No protection
Planung, Optimierung, Usability
E-Book, Deutsch, 545 Seiten
Reihe: Rheinwerk Computing
ISBN: 978-3-8362-7143-1
Verlag: Rheinwerk
Format: EPUB
Kopierschutz: 0 - No protection
Dieser Praxisratgeber enthält zahlreiche Rezepte und Beispiele für die Website-Konzeption. Einsteigern verschafft das Handbuch einen guten Überblick über ihr Aufgabenfeld, und erfahrene Konzepter gewinnen, auf wissenschaftlicher Basis, wertvolles Hintergrundwissen für ihre Projekte.
Aus dem Inhalt:
Ziele und Zielgruppen
Personas und Customer Journey
Rebrush, Redesign, Relaunch
Informationsarchitektur
Onepager, Multipager, Silos
Navigation und Menüführung
Reiz-Reaktionsmuster
Farben und Typografie
Bilder und Symbole
Flat Design, Material Design & Co.
USP und Call-to-action
Conversion-Rate optimieren
Planung, Gestaltung, Technik und Optimierung von Websites
Neue Impulse für Konzeption und eigene Projekte
Traffic generieren, Conversion-Optimierung, Inbound-Marketing
Die Fachpresse zur Vorauflage:
heise Developer: »Schärft beim Leser das Verständnis für eine gute Website und deren Live-Schaltung, sei es im Rahmen eines Relaunches oder einer Neugestaltung. «
Autoren/Hrsg.
Weitere Infos & Material
Materialien zum Buch ... 17
Vorwort ... 19
TEIL I Achtung, Websites kommunizieren ... 21
1. Vom Sinn und Unsinn einer Website ... 23
1.1 ... Das World Wide Web -- das größte Informations- und Datensystem ... 26
1.2 ... Das Internet -- ein System von Kommunikationsprotokollen ... 28
1.3 ... Online-Marketing -- die Nutzung digitaler Mittel für die Kundenansprache ... 30
1.4 ... Die Website -- das Zentrum einer jeden erfolgreichen Online-Marketing-Strategie ... 31
2. Website trifft auf Gehirn: Warum es sich lohnt, den Besucher zu verstehen ... 35
2.1 ... Warum User Websites verwenden -- Motivationen, Bedürfnisse, Ziele eines Website-Besuchers ... 37
2.2 ... Schwebende vs. fokussierende Aufmerksamkeit, Scannen vs. Lesen ... 40
2.3 ... Denkprozesse -- die schnellen und die langsamen ... 51
2.4 ... Wie das Gedächtnis Informationen speichert und Sie das für Ihre Website-Struktur nutzen können ... 53
2.5 ... Wie erlernte psychologische Reiz-Reaktionsmuster Wahrnehmung und Verhalten von Website-Besuchern beeinflussen ... 59
2.6 ... Wie Besucher auf Websites Entscheidungen treffen, handeln und Probleme lösen ... 66
2.7 ... Prozesserwartungen von Website-Besuchern ... 69
3. Websites sprechen -- die Website als Kommunikationsmedium ... 73
3.1 ... Was ist Kommunikation? ... 74
3.2 ... Ein Kommunikationsmodell erfolgreicher Websites ... 77
3.3 ... Websites kommunizieren auf mehreren Ebenen ... 79
4. Die sieben ultimativen Gebote erfolgreicher Websites ... 91
TEIL II Projekt und Strategie planen ... 95
5. Gute Organisation ist der Schlüssel zum Erfolg -- Projektmanagement ... 97
5.1 ... Welche Vorteile Ihnen agile Methoden (Kanban und Scrum) bieten ... 98
5.2 ... Wie Ihnen Projektmanagement-Tools die Koordination erleichtern ... 103
5.3 ... Geld ist nicht alles -- Ihr Budget sollte dennoch sorgfältig geplant werden ... 111
5.4 ... Drei Regeln für die erfolgreiche Projektkommunikation ... 113
6. Website-Relaunch: Wie Sie eine bestehende Website überarbeiten ... 117
6.1 ... Wann ist es höchste Eisenbahn für einen Relaunch? ... 117
6.2 ... Facelift, Rebrush, Redesign, Relaunch -- verschiedene Stufen der Überarbeitung ... 119
6.3 ... Hard- vs. Soft-Relaunch ... 120
6.4 ... Besonderheiten für die Relaunch-Konzeption ... 123
7. Eine gut durchdachte Strategie ist die halbe Miete ... 127
7.1 ... Das Warum ist entscheidend -- Ziele und Zweck der Website definieren ... 129
7.2 ... Was bieten Sie auf Ihrer Website an und was können Ihre Besucher damit tun? USP, Thema und Inhalt einer Website ... 132
7.3 ... »Immer zweimal mehr als du« -- Markt und Wettbewerber analysieren ... 133
7.4 ... Mit der richtigen Domain zur erfolgreichen Website ... 135
7.5 ... Relaunch: Strategische Re-Konzeption für eine verbesserte Website ... 138
8. Analysieren und definieren Sie Ihre Zielgruppen ... 139
8.1 ... User-Typen unterscheiden ... 141
8.2 ... Demografische Personengruppen definieren ... 144
8.3 ... Bedarfsgruppen identifizieren ... 145
8.4 ... Motivationsgruppen erfassen ... 146
8.5 ... Personas erstellen ... 147
8.6 ... Customer Journey ... 150
8.7 ... Relaunch: Nutzung von Tracking-Daten für die Zielgruppenanalyse ... 156
TEIL III Website-Struktur konzipieren ... 159
9. Vorüberlegungen zur Website-Struktur ... 161
9.1 ... Was soll Ihre Website alles können? Verschiedene Website-Typen und ihre Besonderheiten ... 161
9.2 ... Breit angelegt oder tief gebohrt? Vor- und Nachteile breiter vs. tiefer Seitenstrukturen ... 167
9.3 ... Wie Sie mehrere Sprachversionen einer Website unter einen Hut bekommen ... 169
9.4 ... Wann ist ein Onepager sinnvoll und wann der klassische Multipager? ... 172
10. Website-Konzeption im mobilen Zeitalter ... 179
10.1 ... Websites, die sich automatisch anpassen -- responsives Design ... 181
10.2 ... Noch eine responsive Schippe drauf: Progressive Webapps ... 188
10.3 ... Mobile Navigation mit Orientierungsproblemen ... 188
10.4 ... Navigation, Mouseover und Klick vs. Touch -- Verwendungsmodalität berücksichtigen ... 190
10.5 ... Technik und mobile Performance ... 190
11. Was Sie beim Aufbau der Informationsarchitektur grundlegend beachten sollten ... 193
11.1 ... Was Informationsarchitekten »bauen« ... 194
11.2 ... Informationsquellen, die Sie beim Aufbau der Informationsarchitektur berücksichtigen müssen ... 194
11.3 ... Konzipieren Sie Ihre Website-Struktur auf Makro- und Mikroebene ... 195
11.4 ... Informationsarchitektur als verbindendes System von Inhalt und Funktion ... 196
11.5 ... Entwerfen Sie die Informationsarchitektur Ihrer Website aus Sicht Ihrer Besucher ... 200
12. Wie Sie eine benutzerorientierte Makro-Informationsarchitektur aufbauen ... 207
12.1 ... Thematische Bestandsaufnahme beim Website-Betreiber ... 207
12.2 ... Erstes Grobkonzept der Informationsarchitektur ... 210
12.3 ... Thematische Recherche und Wettbewerbsanalyse: Warum es okay ist, bei der Konkurrenz zu spicken ... 212
12.4 ... Card Sorting als hilfreiche Methode zum Aufbau und zur Überprüfung der Makro-Informationsarchitektur ... 217
12.5 ... Erstes Feinkonzept der Makro-Informationsarchitektur ... 221
12.6 ... Relaunch: Bestandsaufnahme, Content-Audit und Datenanalyse ... 223
13. Wie Sie mit Keywords Ihre Makro-Informationsarchitektur optimieren -- für Besucher und Suchmaschinen ... 225
13.1 ... Was macht ein gutes Keyword aus? ... 226
13.2 ... Finden Sie die richtigen Worte: Keyword-Recherche und Auswahl guter Keywords ... 235
13.3 ... Keyword-Mapping: Weisen Sie Ihrer Informationsarchitektur die passenden Keywords zu ... 243
13.4 ... Wie Sie Informationen in suchmaschinenfreundlichen Paketen anbieten -- interne Verlinkung und Siloing ... 246
13.5 ... Relaunch: Anpassung der Informationsarchitektur ... 248
14. Seitentypen und -bereiche sinnvoll einsetzen -- Mikro-Informationsarchitektur ... 249
14.1 ... Verschiedene Seitentypen sinnvoll nutzen ... 250
14.2 ... Wie Sie einzelne Seitenbereiche benutzerorientiert konzipieren ... 266
14.3 ... Die wichtigsten Seiten-Elemente und was sie können sollten ... 272
15. Wo bin ich und wie komme ich woandershin? Navigation, Links und URLs ... 299
15.1 ... Navigationstypen -- Möglichkeiten über Möglichkeiten guter Wegweiser ... 300
15.2 ... Das richtige Wording für Ihre Navigation ... 325
15.3 ... Umsetzung und visuelle Gestaltung der Navigationselemente ... 327
15.4 ... Zehn Regeln für eine gelungene Navigation ... 330
15.5 ... Benutzerorientierung mit einer guten URL-Struktur ... 330
TEIL IV Website umsetzen und gestalten ... 333
16. Wie Sie Ihre Website technisch umsetzen und hosten -- Server, HTML und CMS ... 335
16.1 ... Server und technische Infrastruktur wohlüberlegt auswählen ... 335
16.2 ... Wie Sie mit ein paar kleinen Anpassungen Ihrer technischen Infrastruktur Ihre Ladezeiten optimieren ... 340
16.3 ... Statische vs. dynamische Websites programmieren ... 341
16.4 ... Standardkonformes HTML und CSS verwenden ... 350
17. Kluge Designentscheidungen -- Wahrnehmungsprinzipien, User Experience und Usability ... 353
17.1 ... Wahrnehmungsprinzipien und wie Sie sie bei der Website-Gestaltung integrieren können ... 354
17.2 ... User Experience und Usability: Gestalten Sie effektive, zufriedenstellende und angenehme Websites für Ihre Besucher ... 377
17.3 ... Verschiedene Entwicklungsstadien zum optimalen Layout und Design ... 384
18. Designen Sie Ihre Website kommunikationsorientiert -- Material Design und das Look & Feel ... 391
18.1 ... Designtrends, die Sie nicht umgehen können und sollten ... 392
18.2 ... Kommunizieren Sie mit einem passenden Look & Feel: Die »richtige« Farbwahl ... 402
18.3 ... Kommunizieren Sie mit einem passenden Look & Feel: Eine augengefällige Typografie ... 403
18.4 ... Kommunizieren Sie mit visuellen Mitteln: Bilder ... 411
18.5 ... Kommunizieren Sie mit visuellen Mitteln: Videos, Icons, Animationen ... 419
18.6 ... Acht wesentliche Eigenschaften eines gelungenen Webdesigns ... 423
TEIL V Besucher auf die Website bringen ... 425
19. Kommunizieren Sie mit unwiderstehlichem Content ... 427
19.1 ... Produzieren Sie besucherorientierten Content ... 428
19.2 ... Schreiben Sie lesbare Texte ... 435
19.3 ... Schreiben Sie gute suchmaschinenoptimierte Texte ... 439
19.4 ... Checkliste für gute Webtexte ... 443
19.5 ... Relaunch: Content-Audit und Content-Kuration ... 444
20. Besucher auf die Website bringen und Erfolg messen -- SEO, SEA und Webanalyse ... 449
20.1 ... SEO -- wie Ihre Besucher Sie im WWW finden ... 454
20.2 ... SEA -- wie Sie mit bezahlter Suchmaschinenwerbung mehr Kunden erreichen ... 477
20.3 ... Webanalyse -- wie Sie den Erfolg Ihrer Website messen ... 481
20.4 ... Suchmaschinenfreundlicher Relaunch ... 489
21. Das große Going-live -- abschließende Schritte für eine erfolgreiche Live-Schaltung Ihrer neuen Website ... 495
21.1 ... Verstecken Sie Ihr Entwicklungssystem bis zum Going-live ... 495
21.2 ... Testen Sie die neue Website ausgiebig ... 496
21.3 ... Technische Checkliste für das Going-live ... 499
21.4 ... Going-live einer neu erstellten Website ... 500
21.5 ... Going-live eines Relaunches ... 501
21.6 ... Erfolg messen: Webanalyse nach Relaunch ... 504
22. Aus Besuchern Kunden machen -- optimieren Sie die Conversion Rate ... 507
22.1 ... Hypothesen sind Trumpf -- nutzen Sie Ihre Daten, und gehen Sie strategisch vor ... 509
22.2 ... Reden ist Silber, Schweigen ist Gold -- optimieren Sie Ihren Content ... 511
22.3 ... Der Ton macht die Musik -- sechs Hebel für bessere Conversions ... 514
22.4 ... Optimieren Sie die Usability für eine bessere Conversion Rate: Prozesse verschlanken und Sicherheit bieten ... 523
22.5 ... Optimieren Sie Ihren Call-to-Action ... 528
22.6 ... Nutzen Sie die richtigen Testing Tools -- A/B-Tests für datengestützte Conversion-Rate-Optimierung ... 529
Index ... 535
1 Vom Sinn und Unsinn einer Website
Selbst eingesessenen alten Hasen fehlt hier und da wichtiges Grundlagenwissen, um das letzte Stück zur perfekten Website zu gehen. Und als Einsteiger oder Fortgeschrittener sollten Sie auch sattelfest sein. Haben Sie sich schon einmal gefragt, was genau Websites eigentlich sind? Rein technisch betrachtet sind Websites nur in HTML-Code geschriebene Dokumente. Wenn man noch einen Schritt weitergeht, sind es im Grunde sogar nur Einsen und Nullen. Das ist allerdings eine genauso unzureichende Beschreibung wie die Aussage, Menschen seien lediglich genetisch codierte Zellhaufen oder organische Basen auf DNA-Strängen. Websites sind wesentlich mehr als das. Sie sind heutzutage eines der am weitesten reichenden und mächtigsten Kommunikationsmittel, das Sie im heutigen digitalen Zeitalter zur Kundenansprache nutzen können. Es gibt eine große Bandbreite, wie Sie Websites einsetzen können, von der einfachen digitalen Visitenkarte bis hin zur komplexen Präsentation von Themen und dem Verkauf von Dienstleistungen oder Produkten. Für Ihr Unternehmen ist die Website das zentrale Online-Marketing-Instrument. Die Zeiten sind vorbei, in denen man nur mal eine Website haben muss. Wenn Sie sich die letzten Jahre nicht intensiv mit Ihrer Website, deren Struktur, Inhalten und Aussehen auseinandergesetzt haben, können wir Ihnen eines garantieren: Ihre Website birgt ein enormes Potenzial für Ihr Online-Marketing! Darüber hinaus sind Websites aber auch noch mehr: Informationsportale, soziale Kommunikationsmedien wie Facebook und Instagram sowie komplexe Webapplikationen, wie beispielsweise Evernote oder diverse Projektmanagementsoftwares. Die Liste könnte man unendlich fortführen. Aber nicht nur für Sie als Website-Betreiber haben Websites eine zentrale Stellung. Für die meisten Menschen gehört die Nutzung von Websites zum Alltag, und auch Sie verwenden sicher täglich verschiedenste Websites für allerhand Zwecke. Vielmehr sind sie aktive Handlungsmedien, die in fast allen Lebensbereichen zur aktiven Erreichung von Alltagszielen genutzt werden können, denn sie bieten vielseitige Lösungen für »Probleme« des Alltags. Im Gegensatz zu den klassischen (Werbe-)Medien sind Websites für den Rezipienten längst nicht mehr nur passive Medien, sondern komplexe Kommunikations- und Interaktionswerkzeuge. Und genau das ist der Kernaspekt, an dem dieses Buch ansetzt. Wir wollen ihn noch einmal betonen und ihn etwas präzisieren, denn Sie werden sehen, er zieht sich wie ein roter Faden durch das ganze Buch: Die Website ist für jedes Unternehmen eines der wichtigsten Medien zur Zielgruppenansprache – das ist den meisten Unternehmen klar. Jetzt kommt aber der viel wichtigere Aspekt: Websites sind interaktive Kommunikationsmittel. Sie werden von den Website-Besuchern aktiv genutzt. Das mag auf den ersten Blick trivial klingen. Wenn Sie sich aber im World Wide Web umsehen, finden Sie viele Website-Betreiber, denen dieser Kernaspekt nicht bekannt zu sein scheint. Das sind z.B. Websites, die nur aus Sicht eines Unternehmens oder gar eines Geschäftsführers konzeptioniert sind. Genau solche Websites haben uns dazu inspiriert, dieses Buch zu schreiben. Damit die Zielgruppenansprache nämlich gelingt, die Besucher Ihre Inhalte effektiv nutzen können und Sie so Ihre Website-Ziele erreichen, muss Ihre Website auf jeder Ebene aus Besucherperspektive konzipiert und gestaltet werden. Im Grunde können Sie sich in jedem Kapitel auf dieses Leitmotiv, der »besucherorientierten Website« einstellen, denn es wird Sie von hier bis zur letzten Seite begleiten. Praxistipp: Denken Sie immer an die Nutzer Wir haben im Agenturalltag so häufig mit Website-Projekten zu tun, bei denen nur an die Dienstleistungen und Produkte eines Unternehmens gedacht wird und nicht daran, welchen Kundennutzen das Unternehmen bringt. Die Existenzberechtigung eines Unternehmens begründet sich nur über den Nutzen, den das Unternehmen dem Kunden bringt. Daher sollten Sie bei Ihrer Website auch immer daran denken, wie Sie den Kundennutzen Ihres Unternehmens kommunizieren. Das ist das oberste Gebot für eine erfolgreiche Website. Wie für jede Form der Kommunikation gibt es auch für Websites gewisse Gestaltungskonventionen, an denen Sie sich als Website-Architekt orientieren sollten. Gleichzeitig können Sie aber auch zahlreiche kreative Techniken einsetzen. Zwischen beiden Polen muss insofern ein Gleichgewicht herrschen, als dass Sie jeden Kommunikationsprozess für Ihre Besucher interessant und dennoch klar verständlich gestalten. Ihre Website sollte das Image Ihres Unternehmens sowie die wichtigsten Informationen über Ihre Angebotspalette präsentieren. Das Wesentliche dabei ist allerdings, dass Sie diese Inhalte aus Besuchersicht aufbereiten. So ermöglichen Sie es Ihren Besuchern, gesuchte Informationen schnell und leicht zu finden – und das ist doch eines der wichtigsten übergeordneten Ziele einer jeden Website. Diese scheinbar banale Aufgabe ist eine der schwierigsten im Online-Marketing und gleichzeitig der Schlüssel zu einer erfolgreichen Website. Das Ganze in ein angenehmes Besuchserlebnis auf Ihrer Website zu verpacken, das ist die Kür. Die Kunst ist, diese drei Ziele – einen positiven Eindruck machen, ein gutes, klares Angebot präsentieren und ein angenehmes Besuchererlebnis ermöglichen – im Gleichgewicht zu halten, wie Abbildung 1.1 zeigt. Das schafft leider bei Weitem nicht jeder Website-Betreiber. Abbildung 1.1 Die drei wichtigsten Aufgaben einer Website, die im Gleichgewicht gehalten werden sollten Unsere Erfahrung als Digital-Agentur zeigt, dass jede Überbetonung eines Aspekts aus Abbildung 1.1 zu einer unausgewogenen Website führt. Stellen Sie sich vor, Sie präsentieren auf Ihrer Website gut aufbereitete, leicht zugängliche Informationen und machen einen soliden Gesamteindruck. Sie bieten allerdings ein langweiliges Besuchserlebnis, da Sie nur lange, langweilige Fließtexte verwenden. Je nach Branche wird es dann wahrscheinlich passieren, dass Ihre Website zugunsten »spannenderer« Websites wieder verlassen wird. Oder Sie machen mit Ihrer Website Informationen sehr leicht zugänglich und bieten auch ein relativ spannendes Besuchserlebnis, der Gesamteindruck Ihrer Website hinterlässt allerdings einen negativen Beigeschmack – vielleicht weil Vertrauen schaffende Informationen fehlen. In diesem Fall ist es ebenfalls recht wahrscheinlich, dass ein Besucher wieder abspringen und nicht noch einmal vorbeikommen wird. Gleiches gilt für Unternehmen mit guter Reputation, die spannende, grafisch aufwendige Websites betreiben, auf denen Besucher die Kerninformationen allerdings erst einmal zwischen den Spielereien suchen müssen. Aber seien Sie beruhigt, wie Sie diesen Balanceakt meistern, zeigen wir Ihnen im Verlauf dieses Buches. Wir haben die Erfahrung gemacht, dass nur mit einem tieferen Verständnis der Kommunikationsparteien, in Ihrem Fall sind das Ihre Website-Besucher, eine effiziente und erfolgreiche Kommunikation möglich ist. Daher werden wir Ihnen auf verschiedenen Ebenen die Perspektive Ihrer Besucher nahebringen. Sie werden sich gelegentlich vielleicht fragen, wozu Sie die theoretischen Überlegungen, psychologischen Analysen und technischen Details lesen sollten, wenn Sie doch »nur eine Website bauen möchten«. Nun, unsere langjährige Erfahrung hat uns eine wichtige Sache gelehrt: Je mehr ein Website-Konzepter (und damit meinen wir fortan auch immer die Konzepterinnen) von dem Gesamtbild »Website« weiß, desto ausgereifter wird das Website-Konzept. Dazu gehören Ihre Zielgruppen und der gesamte Kontext, in den Ihre Website eingebettet ist. In der Vorbereitung und Konzeption empfehlen wir schlicht »mehr ist mehr«, denn mehr Wissen und ein tieferes Verständnis ermöglichen klügere und bessere Entscheidungen. Die meisten schlechten Website-Konzeptionen, die wir gesehen haben und verbessern durften, waren nicht deswegen schlecht, weil das Budget zu knapp war oder der Dienstleister unmotiviert. Nein, sie waren schlecht, weil schlichtweg das Hintergrundwissen und die Erfahrung fehlten, um es richtig und gut zu machen. In den folgenden Abschnitten stellen wir Ihnen daher zunächst die wichtigsten Grundlagen rund um die Themen Internet, World Wide Web und Online-Marketing vor. Ein Perspektivwechsel auf die Verarbeitungsressourcen von Website-Besuchern in Kapitel 2, »Website trifft auf Gehirn: Warum es sich lohnt, den Besucher zu verstehen«, ermöglicht Ihnen, den Blickwinkel Ihrer Website-Besucher einzunehmen. In Kapitel 3, »Websites sprechen – die Website als Kommunikationsmedium«, werden wir Ihnen den Kerngedanken der Website als Kommunikationsmedium näherbringen. Diese Sichtweise vertieft das Verständnis der besucherorientierten Website-Konzeption. Darauf aufbauend bilden die Leitprinzipien in Kapitel 4, »Die sieben ultimativen Gebote erfolgreicher Websites«, den roten Faden des gesamten Buches. 1.1 Das World Wide Web – das größte Informations- und Datensystem
Das World Wide Web, kurz WWW, ist heute der stärkste und wichtigste Informationsdienst der Welt. Es handelt sich um das größte interaktive System von Informationen und Daten, die in Form von vernetzten Hypertext-Dokumenten auf Servern vorliegen. Wichtig sind hier zwei Dinge: Hypertext heißt, dass die Dokumente verlinkt sind. Das ermöglicht eine Interaktion – mit einer Radiosendung können Sie nicht direkt...
