Webdesign
Das Handbuch zur Webgestaltung
1st Edition
Published on 12. December 2014
Book
Mixed media product
783 pages
978-3-8362-2692-9 (ISBN)
Description
150 Millisekunden - so viel Zeit haben Sie im Durchschnitt, einen Nutzer davon zu überzeugen, dass sich der Besuch Ihrer Website lohnt. Dieses Buch vermittelt die Designprinzipien, mit denen Sie diese Herausforderung annehmen können!
Es begleitet Sie auf über 780 Seiten bei allen Fragestellungen, die für die Gestaltung einer modernen und attraktiven Website wichtig sind. Sie lernen, worauf es bei Schriftwahl, dem Einsatz von Farben und unterschiedlichen Medien ankommt, gestalten Layouts und Navigationsmenüs und erfahren, was alles bei der Konzeption beachtet werden muss. Dabei erhalten Sie konkrete Hinweise, wie Sie am besten mit Gestaltungsrastern arbeiten, die verschiedenen Website-Elemente aufeinander abstimmen und mit den richtigen Akzenten jeder Website einen individuellen Charakter verleihen.
Martin Hahn zeigt Ihnen zudem, welche technischen Aspekte Sie bei der Gestaltung berücksichtigen müssen und wie Sie ästhetische Ansprüche und Usability unter einen Hut bekommen. Denn nicht alles, was schön aussieht, ist auch machbar im Web. Auch auf Informationsarchitektur, Barrierefreiheit und Responsive Webdesign wird eingegangen. Dass dabei mit HTML5 und CSS3 gearbeitet wird, versteht sich von selbst. Grundkenntnisse in HTML und CSS werden vorausgesetzt.
Ein Buch für alle, die irgendwie immer schon wussten, dass Technik allein nicht alles ist!
Aus dem Inhalt:
Konzeption und Planung
Ideenfindung
Website-Konzeption
Projektmanagement, Briefing
Moodboards, Wireframes, interaktive Prototypen
Prinzipien guter Gestaltung
Design-Prinzipien
Farbenlehre & Farbwirkung
Farbe im Web, Retina-Displays
Proportionen, Weißraum
Typografie und Webfonts
Grafiken, Bilder, Icons
Webdesign-Stile, Webtrends
Layout und Raster
Informationsarchitektur
CSS-Layout und Rastersysteme
Positionierung und Gewichtung
Goldener Schnitt, Above the Fold
Navigation und Interaktion
Haupt-, Sub-, Metanavigationen
Header, Footer, Buttons, Links
Mobile Navigation, Off-Canvas
Usability, User Experience, Barrierefreiheit
Die Technik im Griff
Responsive Webdesign
Webstandards und Best Practices
HTML5 und CSS3
Frameworks, CMS
Galileo Press heißt jetzt Rheinwerk Verlag.
Reviews / Votes
Beim Webdesign gilt es viele Aspekte zu beachten. Design und Frontend gehen oft Hand in Hand. In dem Buch werden alle wichtigen Themen und Designprozesse auf 783 Seiten behandelt. Die muss man nicht alle komplett in einem Rutsch lesen . ist auch nicht zwingend so gedacht, denn jedes Kapitel ist in sich abgeschlossen und eignet sich zum Querlesen, Reinlesen, Herumstöbern oder zum gezielten Suchen bestimmter Themenbereiche.More details
Other editions
Content
Vorwort ... 19
1. Prinzipien des modernen Webdesigns ... 23
1.1 ... Aspekte modernen Webdesigns ... 23
1.2 ... Guter Quellcode -- Webstandards ... 33
1.3 ... Webseiten für alle -- Zugänglichkeit und Barrierefreiheit ... 35
1.4 ... Modernes Webdesign ist flexibel ... 37
1.5 ... Das Webdesign und sein Umfeld ... 40
1.6 ... Fazit: Webdesign ist Coden und Code ist Design ... 43
2. Projektmanagement ... 47
2.1 ... Das Projekt ... 47
2.2 ... Projektphasen ... 53
2.3 ... Projektkommunikation -- wie sag ich es dem Kunden? ... 64
2.4 ... Erfolg oder Misserfolg ... 69
3. Konzeption und Strategie ... 73
3.1 ... Briefing und Recherche ... 73
3.2 ... Unternehmens- und Kundenanalyse ... 78
3.3 ... Konkurrenten und Vorbilder ... 82
3.4 ... Eine Strategie fürs Webprojekt entwickeln ... 83
3.5 ... Webdesign ist Kommunikation ... 89
3.6 ... Ziele der Webseite ... 94
3.7 ... Zielgruppenanalyse ... 98
3.8 ... Anforderungen Design ... 107
3.9 ... Anforderungen an die Inhalte ... 110
3.10 ... Anforderungen an Technik und Funktionalitäten ... 115
3.11 ... Usability im Webdesign ... 118
3.12 ... User Experience ... 129
3.13 ... Fazit ... 133
4. Responsive Webdesign ... 135
4.1 ... Einleitung -- und sie bewegen sich doch ... 135
4.2 ... Responsive Strategie -- »Mobile first« und »Content first« ... 140
4.3 ... Ein neuer Workflow ... 144
4.4 ... Bestandteile einer responsiven Webseite ... 149
4.5 ... Tipps zur Umsetzung ... 161
5. Informationsarchitektur ... 165
5.1 ... Einführung ... 165
5.2 ... Die Bedeutung der Informationsarchitektur ... 168
5.3 ... Die Bedeutung der Navigation ... 173
5.4 ... Content-Strategie ... 176
5.5 ... Inhaltsstruktur entwickeln ... 184
5.6 ... Durch Inhalte navigieren ... 196
5.7 ... Fazit ... 205
6. Gestaltungsgrundlagen ... 207
6.1 ... Webdesign und die menschliche Wahrnehmung ... 208
6.2 ... Die äußere Form ... 214
6.3 ... Anordnung und Gewichtung ... 224
6.4 ... Wahrnehmung und Gestaltung ... 245
6.5 ... Gute Webgestaltung ... 253
7. Screendesign ... 259
7.1 ... Grundlagen Screendesign ... 259
7.2 ... Der Gestaltungsprozess ... 276
7.3 ... Vom Design zur Umsetzung ... 289
8. Layout und Raster ... 297
8.1 ... Anatomie einer Webseite ... 297
8.2 ... Wireframes erstellen ... 303
8.3 ... Raster -- Grundlagen ... 309
8.4 ... Ein eigenes Raster anlegen ... 323
8.5 ... Layouts gestalten ... 343
9. Farbe im Webdesign ... 363
9.1 ... Welche Rolle spielt die Farbe? ... 363
9.2 ... Farbe: eine Wissenschaft für sich ... 365
9.3 ... Farbsysteme ... 368
9.4 ... Das Web-Farbmanagement ... 381
9.5 ... Farbwirkung ... 385
9.6 ... Farbkontraste ... 417
9.7 ... Farbschemata ... 425
9.8 ... Gelungener Farbeinsatz im Webdesign ... 430
9.9 ... Farbe und Usability ... 438
9.10 ... Ein eigenes Farbschema entwickeln ... 440
9.11 ... Fazit ... 450
10. Typografie ... 451
10.1 ... Typografie im Web ... 451
10.2 ... Leseverhalten im Web ... 454
10.3 ... Schriftarten ... 457
10.4 ... Schriftdarstellung im Web ... 465
10.5 ... Makrotypografie ... 477
10.6 ... Mikrotypografie ... 501
10.7 ... Gelungene Webtypografie -- Textformatierungen und Gestaltungstipps ... 507
10.8 ... Typografische Inspiration: Best Cases ... 525
11. Bilder und Grafiken ... 531
11.1 ... Einführung: Die Macht der Bilder ... 531
11.2 ... Bilder im Web ... 537
11.3 ... Bilderquellen ... 542
11.4 ... Motive & Bildstimmung ... 549
11.5 ... Bildgestaltung ... 564
11.6 ... Icons ... 578
11.7 ... Icon-Fonts ... 581
11.8 ... Illustrationen ... 584
11.9 ... Bildbearbeitung ... 588
11.10 ... Bildformate ... 590
11.11 ... Bilder in HTML und CSS ... 596
11.12 ... Weitere Bilder-Tools ... 606
11.13 ... Zusammenfassung Bilder ... 607
12. Navigations- und Interaktionsdesign ... 609
12.1 ... Die Gestaltung der Hauptnavigation ... 609
12.2 ... Die Gestaltung der Subnavigation ... 630
12.3 ... Die Gestaltung der Metanavigation ... 631
12.4 ... Die Gestaltung der Footer-Navigation ... 633
12.5 ... Navigation auf mobilen Endgeräten -- responsive Navigation ... 634
12.6 ... Weitere Navigationsmittel ... 650
12.7 ... Formulare ... 665
13. Webdesignstile und -trends ... 673
13.1 ... Die Webdesignstile ... 673
13.2 ... Webdesigntrends ... 687
14. Animationen ... 703
14.1 ... Animationen mit CSS ... 703
14.2 ... Animationen und Interaktivität mit JavaScript ... 711
14.3 ... Interaktive Elemente ... 713
14.4 ... Audiovisuelle Elemente ... 724
15. Websitetypen ... 729
15.1 ... Corporate Website ... 729
15.2 ... Portfolio ... 734
15.3 ... Shop ... 738
15.4 ... Blog ... 744
15.5 ... Landing Page ... 748
15.6 ... Microsite ... 750
15.7 ... Web-Apps ... 751
15.8 ... Newsletter ... 752
16. Tipps, Tricks und Tools ... 755
16.1 ... Wichtiger »Kleinkram« ... 755
16.2 ... Code-Feintuning ... 761
16.3 ... In Kontakt bleiben ... 766
Die DVD zum Buch ... 771
Index ... 773