Grundkurs Gutes Webdesign, m. DVD-ROM

Eine gute Website? Klar, die ist vor allem informativ, schnell und funktional. Aber was macht aus einer einfachen Website einen echten Hingucker? Einen, der im Gedächtnis bleibt, weil er einfach richtig gut gestaltet wurde?

In diesem Buch lernen Sie es, denn hier erlernen Sie alle Gestaltungsgrundlagen für gutes Webdesign - vom perfekten Layout über die richtigen Farben und die passende Schrift bis hin zum Design von Grafiken, Bildern und Icons mit Photoshop. Das Besondere dabei: Der Autor zeigt Ihnen in einem Beispielprojekt und in vielen zusätzlichen Praxisbeispielen, wie Sie diese Gestaltungsprinzipien im Web anwenden und sie konkret umsetzen. Dass dabei mit HTML5 und CSS3 gearbeitet wird, versteht sich von selbst. Auch Barrierefreiheit, Usability und Responsive Webdesign werden groß geschrieben. So entstehen moderne und attraktive Websites, die jeder gerne besucht!
Alles zum Webdesign:

Gestaltungsgrundlagen
Ideen finden und bewerten
Typografie, Webfonts
Farblehre, Farbe im Web
Grafiken, Bilder, Icons
Buttons, Links, Navigation
Website-Konzeption
Informationsarchitektur
CSS-Layouts, Raster
HTML5 und CSS3
Retina-Displays, Responsive Webdesign
Usability, Barrierefreiheit
Testen und optimieren
Suchmaschinenoptimierung

Galileo Press heißt jetzt Rheinwerk Verlag.

Eine gute Website? Klar, die ist vor allem informativ, schnell und funktional. Aber was macht aus einer einfachen Website einen echten Hingucker? Einen, der im Gedächtnis bleibt, weil er einfach richtig gut gestaltet wurde?

In diesem Buch erfahren Sie es, denn hier erlernen Sie alle Gestaltungsgrundlagen für gutes Webdesign - vom perfekten Layout über die richtigen Farben und die passende Schrift bis hin zum Design von Grafiken, Bildern und Icons mit Photoshop. Das Besondere dabei: Der Autor zeigt Ihnen in einem Beispielprojekt und in vielen zusätzlichen Praxisbeispielen, wie Sie diese Gestaltungsprinzipien im Web anwenden und sie konkret umsetzen. Dass dabei mit HTML5 und CSS3 gearbeitet wird, versteht sich von selbst. Auch Barrierefreiheit, Usability und Responsive Webdesign werden groß geschrieben. So entstehen moderne und attraktive Websites, die jeder gerne besucht!Text textformat='02'

Björn Rohles ist Webdesigner, Usability-Experte und Medienwissenschaftler. Als Projektmanager in einer Onlineagentur betreut er kleine und mittelständische Kunden bei Fragen rund um die Themen Webdesign, Usability und Suchmaschinenoptimierung. Als freier Autor schreibt er für netzpiloten.de und das t3n-Magazin. Über all diese Themen bloggt er auf jorni.de.

Usability, Webstandards und Responsive Webdesign

1. Die richtige Ausrüstung ... 16

1.1 ... Was Sie für diesen Kurs brauchen ... 16

1.2 ... Denken Sie wie ein Webdesigner! ... 20

1.3 ... Die wichtigsten Technologien ... 31

1.4 ... Zusammenfassung ... 36

2. Website-Konzeption ... 38

2.1 ... Konzeptionsphasen ... 38

2.2 ... Projektstart: Die Zielgruppe definieren ... 39

2.3 ... Das Konzept entwickeln: Analysephase ... 42

2.4 ... Der Weg zur richtigen Idee -- Kreativitätstechniken ... 45

2.5 ... Die Ideen bewerten ... 51

2.6 ... Inhalte sammeln und ordnen ... 55

2.7 ... Auf die richtige Ordnung kommt es an -- Webstandards ... 59

2.8 ... Beispielprojekt -- Konzeption ... 69

3. Benutzerfreundliche Websites ... 82

3.1 ... Usability ... 82

3.2 ... Accessibility -- Zugänglichkeit und Barrierefreiheit ... 93

3.3 ... Responsive Webdesign ... 99

4. Layout und Komposition ... 108

4.1 ... Die Grundlagen moderner Gestaltung ... 108

4.2 ... CSS-Layouts und -Elemente ... 128

4.3 ... Typen von CSS-Layouts ... 135

4.4 ... Gestaltung mit CSS ... 138

4.5 ... Raster -- Inhalte im Layout anordnen ... 156

4.6 ... Raster als Grundlage für Responsive Webdesign ... 166

4.7 ... Beispielprojekt -- Media Queries und CSS-Grundgestaltung ... 173

5. Typografie im Web ... 182

5.1 ... Was ist Typografie? ... 182

5.2 ... Kategorien von Schriften ... 183

5.3 ... Schriften in CSS ... 191

5.4 ... Websichere Schriften ... 192

5.5 ... Webfonts ... 199

5.6 ... Die richtige Schrift auswählen ... 208

5.7 ... Texte mit CSS gestalten ... 214

5.8 ... Detailtypografie ... 229

5.9 ... Beispielprojekt -- Typografie ... 236

6. Farbe im Web ... 244

6.1 ... Kleine Farblehre ... 244

6.2 ... Farbkontraste ... 248

6.3 ... Farbassoziationen ... 254

6.4 ... Farbharmonien ... 264

6.5 ... Farben am Monitor und im Web ... 271

6.6 ... Farben und Farbschemata für Webseiten ... 283

6.7 ... Beispielprojekt -- Farbe ... 291

7. Grafiken und Bilder ... 298

7.1 ... Tipps für die Bildwahl ... 298

7.2 ... Freie Grafiken und Bilder verwenden ... 306

7.3 ... Creative-Commons-Inhalte verwenden ... 308

7.4 ... Grafiken und Bilder einkaufen ... 313

7.5 ... Bilder für das Web optimieren ... 315
7.6 ... Retina: Die Auflösung kehrt zurück ... 322

7.7 ... Looks kreieren -- Hintergründe, Effekte und Spiegelungen ... 326

7.8 ... Buttons gestalten ... 338

7.9 ... Icons einsetzen und gestalten ... 343

7.10 ... Bilder in Websites einbauen ... 352

7.11 ... Grafik-Vermeidungsstrategien ... 360

7.12 ... Beispielprojekt -- Grafiken ... 362

8. Testen und optimieren ... 368

8.1 ... Funktionalitäten in allen Browsern sicher stellen ... 368

8.2 ... Usability und Accessibility testen ... 377

8.3 ... Ladezeiten im Griff ... 380

8.4 ... Suchmaschinenoptimierung ... 386

8.5 ... Beispielprojekt -- letzte Schritte ... 390

9. Weitere Neuerungen in HTML5 und CSS3 ... 400

9.1 ... HTML5 ... 400

9.2 ... CSS3 ... 406

A. Anhang ... 413

A.1 ... Quellen ... 413

A.2 ... Linktipps für Webdesigner ... 415

A.3 ... Die DVD zum Buch ... 416

Index ... 418