Neue Usability-Erkenntnisse helfen Ihnen bei effektiven Formularen und der Verbesserung Ihrer Website. Von der charakteristischen Seiten-, Text- und Farbgestaltung bis hin zum Einsatz von Ajax und jQuery, CSS-Frameworks, Wikis, Blogs und Podcasts: Vitaly Friedman gibt Ihnen praktische Hilfestellung bei der Gestaltung Ihres Webdesigns.

Leseprobe Praxisbuch Web 2.0 (PDF) (1.95 MB). Hier finden Sie ausgewählte Abschnitte aus Kapitel 5, "Navigation", sowie Vorwort, Inhaltsverzeichnis und Index des Buches.

Zahlreiche Schritt-für-Schritt-Anleitungen – etwa zur Erstellung von grafischen Elementen mit Photoshop oder zur Realisierung eines CSS-Layouts – unterstützen Sie bei der Gestaltung einzelner Komponenten oder vollständiger Web 2.0-Sites.

Web 2.0 verstehen

Informieren Sie sich hier im Detail, was Web 2.0 für Sie als Webdesigner wirklich bedeutet.

Farben und Schriften gezielt einsetzen

Lernen Sie von Grund auf, wie Sie die typische Farb- und Textgestaltung des Web 2.0 in Ihrer Webseite     erreichen können.

Seitenelemente neu gestalten

Schon mal über eine neue Navigation nachgedacht? Oder über Buttons und Badges im Web
2.0-Look? Hier lernen Sie, wie’s geht.

Usability & Accessibility im Einsatz

Zahlreiche Praxisbeispiele, Checklisten und Tools erleichtern Ihnen die Umsetzung barrierefreier
und benutzerfreundlicher Webseiten.

Web 2.0-Anwendungen programmieren

Nutzen Sie Ajax für die Entwicklung desktopähnlicher Online-Anwendungen oder verbinden
Sie populäre Web-APIs in einem Mashup.

Achtung, Aufnahme!

Produzieren und veröffentlichen Sie eigene Podcasts. Praxistipps zur Planung, Konzeption
und Umsetzung helfen Ihnen dabei.

WordPress anpassen

Steigern Sie die Attraktivität Ihres WordPress Blogs mit der Umsetzung eigener Designs.

Zum Autor

Vitaly Friedman ist Entwickler und Designer, der sich für barrierefreie und benutzerfreundliche Seitengestaltung einsetzt und diese realisiert. Er ist Autor des Dr. Web Magazin und Mitgründer des Online-Magazins Smashing Magazine, das zu den populärsten Weblogs der Welt zählt. Zur Zeit studiert Friedman (22) Informatik an der Universität des Saarlandes.

Inhaltsverzeichnis

Teil I ... Web 2.0-Trends

1 ... Das Web im neuen Gewand ... 31

1.1 ... Web 2.0 – wie neu ist das neue Web? ... 31
... 1.1.1 ... Erneuerung statt Neuerfindung ... 32
... 1.1.2 ... Das neue Web: alte Technologien im Einsatz ... 32
... 1.1.3 ... Ein neuer Begriff für die Veränderungen im Web ... 34
... 1.1.4 ... Was ist Web 2.0 – und was ist es nicht? ... 35
1.2 ... Neue Möglichkeiten und neue Konzepte ... 36
... 1.2.1 ... Das Web als Service-Plattform ... 36
... 1.2.2 ... Weisheit der Massen und Architektur der Partizipation ... 37
... 1.2.3 ... Open-Source-Bewegung und offene Technologien ... 40
... 1.2.4 ... The Perpetual Beta ... 42
... 1.2.5 ... Einfachheit und Minimalismus ... 43
... 1.2.6 ... Webkultur 2.0 ... 44
... 1.2.7 ... The Long Tail ... 51
... 1.2.8 ... Crowdsourcing ... 52
... 1.2.9 ... Qualitätsverlust und Datentransparenz ... 53
... 1.2.10 ... Bedarf nach Weiterentwicklung... 54
... 1.2.11 ... Zusammenfassung... 55
1.3 ... Die Nutzer des Web 2.0 ... 56
... 1.3.1 ... Soziale Netzwerke im Trend ... 56
... 1.3.2 ... Die Blogosphäre weitet sich aus ... 57
... 1.3.3 ... Desktop-Anwendungen online ... 58
... 1.3.4 ... Nutzer bestimmen selbst ... 59
1.4 ... Web 2.0 in Deutschland ... 60
... 1.4.1 ... Blogs ... 62
... 1.4.2 ... Soziale Netzwerke ... 62
... 1.4.3 ... Social Bookmarking ... 63
... 1.4.4 ... News-Community ... 63
... 1.4.5 ... Multimedia-Portale ... 63
... 1.4.6 ... Kollektive Intelligenz ... 64
... 1.4.7 ... Dinge übers Netz tauschen ... 64
1.5 ... Ressourcen ... 65
... 1.5.1 ... Online-Artikel ... 65
... 1.5.2 ... Online-Ressourcen ... 66
... 1.5.3 ... Literatur... 66

2 ... Designkultur Web 2.0 ... 67

2.1 ... Seitenstrukturen ... 68
... 2.1.1 ... Zwei- und Dreispalter ... 68
... 2.1.2 ... Kreativität und Kompaktheit ... 71
... 2.1.3 ... Zentrale Positionierung der Inhalte ... 72
2.2 ... Grafische Ansätze ... 73
... 2.2.1 ... Farbschemata ... 73
... 2.2.2 ... Badges, Streifen, Gradiente und Spruchbänder ... 75
... 2.2.3 ... Schatten-, Spiegel- und 3D-Effekte ... 77
... 2.2.4 ... Abgerundete Ecken ... 78
... 2.2.5 ... Icons ... 78
2.3 ... Webtypografie ... 79
... 2.3.1 ... Überproportional große Überschriften ... 79
... 2.3.2 ... Flattersatz oder Blocksatz? ... 81
... 2.3.3 ... Serifen oder Sans-Serifen? ... 81
2.4 ... Seitenelemente ... 82
... 2.4.1 ... Registerkarten ... 83
... 2.4.2 ... Such- und Eingabefelder ... 84
... 2.4.3 ... Tagclouds ... 85
... 2.4.4 ... Zebratabellen ... 85
2.5 ... Neue Konzepte ... 86
... 2.5.1 ... Plakatives und sauberes Design ... 86
... 2.5.2 ... Whitespace ... 87
... 2.5.3 ... Simplicity und Minimalismus ... 90
2.6 ... Zusammenfassung ... 91

Teil II ... Web 2.0-Seitengestaltung

3 ... Textgestaltung ... 95

3.1 ... Was ist Webtypografie? ... 95
... 3.1.1 ... Screen und Print – absolute Flexibilität und absolute Kontrolle ... 97
... 3.1.2 ... Besonderheiten der Webtypografie ... 97
... 3.1.3 ... Warum ist Webtypografie wichtig? ... 98
... 3.1.4 ... Webtypografie in der Praxis ... 100
3.2 ... Grundlagen der Webtypografie ... 101
... 3.2.1 ... Typografische Begriffe im Überblick ... 101
... 3.2.2 ... Hervorhebung von Texten ... 102
... 3.2.3 ... Absätze und Gestaltung ... 105
... 3.2.4 ... Schriftgröße ... 113
... 3.2.5 ... Schriftart ... 120
... 3.2.6 ... Linkgestaltung ... 124
... 3.2.7 ... Typografische Konsistenz ... 126
... 3.2.8 ... Webtypografie und Barrierefreiheit ... 127
3.3 ... Neue Techniken der Webtypografie ... 128
... 3.3.1 ... Simple Image Replacement ... 129
... 3.3.2 ... Moderne Ansätze... 130
... 3.3.3 ... Dynamic Image Replacement ... 131
... 3.3.4 ... Dynamic Flash Replacement ... 137
3.4 ... Schriftart auswählen ... 142
... 3.4.1 ... Georgia ... 142
... 3.4.2 ... Arial... 143
... 3.4.3 ... Lucida Sans Unicode ... 143
... 3.4.4 ... Tahoma ... 143
... 3.4.5 ... Trebuchet MS ... 144
... 3.4.6 ... Times New Roman ... 144
... 3.4.7 ... Verdana ... 144
... 3.4.8 ... Überschriften und Fließtexte ... 145
3.5 ... Praxisbeispiel ... 146
... 3.5.1 ... Fließtext ... 146
... 3.5.2 ... Überschrift ... 151
3.6 ... Unkonventionelle Schriftarten ... 154
3.7 ... Ein Blick über den Tellerrand ... 156
... 3.7.1 ... Serifen: Cambria, Constantia ... 157
... 3.7.2 ... Sans-Serifen: Calibri, Candara, Corbel, Segoe UI ... 157
... 3.7.3 ... Monospaced: Consolas ... 158
3.8 ... Zusammenfassung ... 158
3.9 ... Ressourcen ... 160
... 3.9.1 ... Quellen und weiterführende Beiträge... 160
... 3.9.2 ... Typografie ... 160
... 3.9.3 ... Fonts ... 161
... 3.9.4 ... Dynamic Text Replacement ... 161
... 3.9.5 ... Werkzeuge und Dienste ... 161
... 3.9.6 ... Literatur... 162

4 ... Farbgestaltung Web 2.0 ... 163

4.1 ... Grundlagen der Farben- und Harmonielehre ... 165
... 4.1.1 ... Farbmischung und Farbmodelle ... 166
... 4.1.2 ... Farbwirkung ... 167
... 4.1.3 ... Farbtemperatur ... 168
... 4.1.4 ... Farbkreis ... 168
... 4.1.5 ... Farbkombinationen ... 169
... 4.1.6 ... Kontraste ... 171
... 4.1.7 ... Kontext der Farben ... 175
4.2 ... Farbtheorie in der Praxis ... 176
4.3 ... RGB und CMYK in der Praxis ... 178
4.4 ... Farbpalette im Web 2.0 ... 179
... 4.4.1 ... Neutrale, passive Farben ... 180
... 4.4.2 ... Bunte, aktive Farben ... 182
... 4.4.3 ... Weiß auf Schwarz oder Schwarz auf Weiß ... 184
4.5 ... Werkzeuge für die Farbauswahl ... 186
... 4.5.1 ... Grundfarben auswählen ... 186
... 4.5.2 ... Farben mischen ... 186
... 4.5.3 ... Farbpaletten wählen ... 187
... 4.5.4 ... Farbpaletten erzeugen ... 188
... 4.5.5 ... Farben umwandeln ... 189
... 4.5.6 ... Kontrast prüfen ... 189
... 4.5.7 ... Zugänglichkeit prüfen ... 189
... 4.5.8 ... Bewerten lassen ... 190
... 4.5.9 ... Kostenpflichtige Werkzeuge ... 190
... 4.5.10 ... Weitere Ressourcen ... 190
4.6 ... Ton der Komposition ... 190
4.7 ... Bestimmung von Harmonien ... 193
4.8 ... Helles Design – Praxisbeispiel ... 194
... 4.8.1 ... Header ... 194
... 4.8.2 ... Seitennavigation ... 195
... 4.8.3 ... Banner ... 196
... 4.8.4 ... Harmonische Farbkombination ... 198
... 4.8.5 ... Sidebar ... 200
... 4.8.6 ... Footer ... 200
... 4.8.7 ... Übergänge zwischen Farben ... 201
... 4.8.8 ... Auszeichnung von Texten ... 201
... 4.8.9 ... Auszeichnung von Verweisen ... 202
... 4.8.10 ... Navigationsmenüs ... 205
... 4.8.11 ... Logo ... 207
... 4.8.12 ... Ergebnis ... 207
4.9 ... Dunkles Design – Praxisbeispiel ... 208
... 4.9.1 ... Rahmen, Umgebung, Hintergrund ... 209
... 4.9.2 ... Sidebar ... 210
... 4.9.3 ... Übergänge zwischen Farben ... 211
... 4.9.4 ... Auszeichnung von Texten ... 211
... 4.9.5 ... Auszeichnung von Verweisen ... 213
... 4.9.6 ... Navigationsmenü ... 215
... 4.9.7 ... Footer ... 216
... 4.9.8 ... Ergebnis ... 216
4.10 ... Zusammenfassung ... 217
4.11 ... Ressourcen ... 219
... 4.11.1 ... Online-Artikel ... 219
... 4.11.2 ... Literatur... 220

5 ... Navigation ... 221

5.1 ... Navigationselemente entwerfen ... 221
... 5.1.1 ... Aufgaben der Seitennavigation ... 222
... 5.1.2 ... Platzierung von Navigationsleisten ... 223
... 5.1.3 ... Navigationsleisten gestalten ... 226
... 5.1.4 ... Richtlinien für die Gestaltung von Navigations elementen ... 227
5.2 ... CSS-basierte Ansätze ... 228
... 5.2.1 ... Die (X)HTML-Grundstruktur ... 229
... 5.2.2 ... Simple Navigation mit CSS ... 230
... 5.2.3 ... 2-Level Navigation mit CSS ... 237
5.3 ... Register ansprechend gestalten ... 242
... 5.3.1 ... Abgerundete Ecken ... 242
... 5.3.2 ... Sliding Doors ... 243
... 5.3.3 ... CSS Stripes ... 254
... 5.3.4 ... Weitere Ansätze... 260
... 5.3.5 ... Klappmenüs und Flyouts ... 261
... 5.3.6 ... Suckerfish Dropdowns ... 262
... 5.3.7 ... Hybrid CSS Dropdowns ... 265
... 5.3.8 ... Alle CSS-basierten Techniken im Überblick ... 266
5.4 ... Photoshop-Techniken ... 269
... 5.4.1 ... Abgerundete Registerkarten für die Textnavigation ... 269
... 5.4.2 ... Tiefeneffekt für Navigationsleisten ... 272
... 5.4.3 ... Registerkarten ... 275
... 5.4.4 ... Bildbasiertes Navigationsmenü ... 283
5.5 ... Tag-Clouds ... 285
5.6 ... Favicons ... 288
... 5.6.1 ... Favicons erstellen ... 289
5.7 ... Ressourcen ... 291
... 5.7.1 ... Online-Artikel ... 292
... 5.7.2 ... Tools ... 292
... 5.7.3 ... Tag-Cloud Plug-ins ... 293
... 5.7.4 ... Literatur... 293

6 ... Listen und Tabellen ... 295

6.1 ... Tabellen und Listen im Web 2.0 ... 295
6.2 ... Listen ... 296
... 6.2.1 ... XHTML-Markup für Listen ... 296
... 6.2.2 ... Gestaltung von Listen mit CSS ... 298
... 6.2.3 ... Listen im Web 2.0-Look ... 300
6.3 ... Tabellen ... 309
... 6.3.1 ... XHTML-Markup für Tabellen ... 309
... 6.3.2 ... table, tr, th, td, caption – Tabellen, Zeilen, Zellen, Überschriften ... 309
... 6.3.3 ... Summary, abbr – Zusammenfassung und Abkürzung ... 311
... 6.3.4 ... Zeilengruppen und Spaltengruppen ... 312
... 6.3.5 ... Colspan und rowspan – Zeilen und Spalten verbinden und vereinigen ... 314
... 6.3.6 ... Gestaltung von Tabellen mit CSS ... 316
... 6.3.7 ... Tabellen im Web 2.0-Look ... 318
6.4 ... Ressourcen ... 324

7 ... Schaltflächen ... 327

7.1 ... Einfache Schaltfläche ... 328
7.2 ... Glänzende Schaltfläche im Aqua-Look ... 333
7.3 ... Glänzende 3D-Schaltfläche ... 339
7.4 ... Reflexion ... 343
7.5 ... Schatteneffekt ... 346
7.6 ... Schaltfläche mit 3D-Objekt ... 351
7.7 ... Ressourcen ... 354

8 ... Formulare ... 357

8.1 ... XHTML-Markup für Formulare – Grundlagen ... 358
... 8.1.1 ... optgroup – Optionen gruppieren ... 360
... 8.1.2 ... label – Steuerelemente beschriften ... 361
... 8.1.3 ... fieldset, legend – verwandte Formularelemente gruppieren und beschriften ... 362
8.2 ... Formularfelder mit CSS gestalten ... 364
... 8.2.1 ... Positionierung und Gestaltung von Eingabefeldern ... 364
... 8.2.2 ... multiple-Eigenschaft bei Auswahlmenüs ... 371
... 8.2.3 ... Die Größe der Felder manuell einstellen ... 390
... 8.2.4 ... Formularnavigation ... 391
... 8.2.5 ... Wie geht man mit Spam um? ... 392
8.3 ... Formulare und Usability ... 393
... 8.3.1 ... Beschriftungen von Eingabefeldern ... 394
... 8.3.2 ... Verwendung von visuellen Elementen ... 396
... 8.3.3 ... Primäre und sekundäre Aktionen ... 397
8.4 ... Ressourcen ... 398

9 ... Barrierefreiheit und Usability ... 401

9.1 ... Prinzipien der Barrierefreiheit ... 402
... 9.1.1 ... Vorteile der barrierefreien und standardkonformen Seitengestaltung ... 403
9.2 ... Barrierefreie Seitengestaltung ... 408
... 9.2.1 ... Grundlegende Richtlinien ... 408
... 9.2.2 ... Zugänglichkeit in der Praxis ... 409
... 9.2.3 ... BITV für Dummys ... 425
9.3 ... Prinzipien der Benutzerfreundlichkeit ... 425
... 9.3.1 ... Was ist Benutzerfreundlichkeit? ... 425
... 9.3.2 ... Ziel und Zweck der Usability ... 426
... 9.3.3 ... Häufig auftretende Usability-Fehler ... 427
9.4 ... Verhaltensmuster der Benutzer ... 427
9.5 ... Usability-Heuristiken ... 433
9.6 ... Barrierefreiheit und Benutzer freundlichkeit testen ... 437
9.7 ... Ressourcen ... 441
... 9.7.1 ... Online-Artikel ... 441
... 9.7.2 ... Tools ... 442
... 9.7.3 ... Usability ... 442
... 9.7.4 ... Literatur... 443

10 ... Web 2.0-Layouts mit CSS umsetzen ... 445

10.1 ... Block- und Inline-Elemente ... 446
... 10.1.1 ... Block-Level-Elemente ... 446
... 10.1.2 ... Inline-Level-Elemente ... 447
... 10.1.3 ... Block- und Inline-Elemente in CSS ... 449
10.2 ... Das CSS Box-Modell ... 450
... 10.2.1 ... Beispiel ... 452
... 10.2.2 ... margin und padding ... 452
... 10.2.3 ... border ... 453
... 10.2.4 ... Vertikale Abstände ... 455
... 10.2.5 ... The Box Model Problem ... 456
10.3 ... Die float-Theorie ... 457
... 10.3.1 ... Grundlegende Eigenschaften ... 457
... 10.3.2 ... Positionierung von float-Boxen ... 461
... 10.3.3 ... Das Attribut clear ... 466
... 10.3.4 ... Float-basierte Layouts ... 468
... 10.3.5 ... Spalten mit gleicher Höhe ... 479
10.4 ... Relative und absolute Positionierung ... 484
... 10.4.1 ... Containing Blocks ... 485
... 10.4.2 ... Statische Positionierung ... 486
... 10.4.3 ... Relative Positionierung ... 486
... 10.4.4 ... Absolute Positionierung ... 489
... 10.4.5 ... Feste Positionierung ... 492
... 10.4.6 ... Z-Index ... 492
... 10.4.7 ... Positions-basierte Layouts ... 494
... 10.4.8 ... Floats vs. Positioning ... 504
10.5 ... Auswahl des Layouts – fest, flüssig oder elastisch? ... 507
... 10.5.1 ... Layouttypen im Überblick: Wo liegt der Unterschied zwischen den Ansätzen? ... 507
... 10.5.2 ... Fixed Layout ... 508
... 10.5.3 ... Liquid/Fluid Layout ... 512
... 10.5.4 ... Elastic Layout ... 514
... 10.5.5 ... Hybrid Layouts ... 516
... 10.5.6 ... Weitere Techniken – Chamäleons ... 520
... 10.5.7 ... Feste Layouts mit variabler Breite ... 521
... 10.5.8 ... Text Zooming-Methode ... 522
... 10.5.9 ... Switchy McLayout ... 523
... 10.5.10 ... Zusammenfassung... 523
10.6 ... Umsetzung eines Web 2.0-Entwurfs ... 524
... 10.6.1 ... Zielsetzung und Entwurf ... 524
... 10.6.2 ... Abstimmung von Entwurfs und Schema ... 526
... 10.6.3 ... Grundgerüst entwerfen ... 526
... 10.6.4 ... Breite festlegen: #wrapper, #header, #content, #footer ... 528
... 10.6.5 ... Gestaltung von #content und #sidebar ... 530
... 10.6.6 ... Gestaltung des #header-Bereichs ... 532
... 10.6.7 ... Gestaltung der Navigationsleiste und der Suchbox ... 535
... 10.6.8 ... Gestaltung des Footers ... 536
... 10.6.9 ... Dekoration ... 537
10.7 ... Ressourcen ... 539

11 ... Browserkompatibilität ... 541

11.1 ... Umgang mit Inkonsistenzen ... 542
... 11.1.1 ... Vorbeugung ... 542
... 11.1.2 ... Umsetzung mit CSS und XHTML ... 542
... 11.1.3 ... Welche Hacks sollte man verwenden? ... 544
... 11.1.4 ... IE Conditional Comments ... 545
... 11.1.5 ... Der Internet Explorer ... 547
11.2 ... Browserweichen für den Internet Explorer ... 548
... 11.2.1 ... Sichere CSS Hacks für den Internet Explorer ... 549
... 11.2.2 ... Transparenz von PNG-Bildern ... 550
... 11.2.3 ... Float-Attribut ... 551
... 11.2.4 ... The IE Doubled Float-Margin Bug ... 551
... 11.2.5 ... IE/Win Guillotine Bug ... 551
... 11.2.6 ... Feste Positionierung von Elementen ... 552
... 11.2.7 ... Three Pixel Text-Jog Bug ... 553
... 11.2.8 ... CSS Hover Behavior ... 558
... 11.2.9 ... Fixe Positionierung des Hintergrundbildes ( background-attachment)... 559
... 11.2.10 ... Minimale und maximale Breite/Höhe ... 559
... 11.2.11 ... Weitere Mängel des Internet Explorers ... 559
... 11.2.12 ... Häufige Lösungsansätze ... 560
11.3 ... Kompatibilitätstabellen ... 563
... 11.3.1 ... HTML 4.01/XHTML 1.0 ... 563
11.4 ... Ressourcen ... 566
... 11.4.1 ... Werkzeuge, Dienste ... 566
... 11.4.2 ... Tipps ... 567

Teil III ... Web 2.0-Programmierung

12 ... Ajax ... 571

12.1 ... Ajax-Anwendungen in der Praxis ... 572
... 12.1.1 ... Google Mail (GMail): clever, robust und elegant ... 572
... 12.1.2 ... Netvibes: personalisierbare Startseiten ... 574
... 12.1.3 ... Mite: Zeiterfassungstool für Web-Worker ... 574
... 12.1.4 ... Typische Merkmale von Ajax-Applikationen ... 575
12.2 ... Klassisches Modell und Ajax-Modell ... 576
12.3 ... Architektur von Ajax ... 579
... 12.3.1 ... Strategie der Ajax-Programmierung ... 580
... 12.3.2 ... XMLHttpRequest (XHR) ... 580
... 12.3.3 ... Methoden des XMLHttpRequest-Objekts ... 581
... 12.3.4 ... Attribute des XMLHttpRequest-Objekts ... 582
... 12.3.5 ... Praxis-Beispiel ... 583
12.4 ... Ajax-Bibliotheken und Frameworks... 597
12.5 ... Nachteile von Ajax ... 600
12.6 ... Ressourcen ... 602

13 ... Mikroformate... 603

13.1 ... Was sind Mikroformate? ... 605
13.2 ... Mikroformate im Überblick... 606
13.3 ... Mikroformate im Einsatz ... 607
13.4 ... Visitenkarte als hCard ... 609
13.5 ... Mikroformate kombinieren ... 612
13.6 ... Zusammenfassung ... 613
13.7 ... Ressourcen ... 613

14 ... Mashups ... 615

14.1 ... Was sind Mashups? ... 616
14.2 ... Feeds im Einsatz ... 617
... 14.2.1 ... Personalisierbare Startseiten ... 618
... 14.2.2 ... Feeds mischen, filtern und aufbereiten ... 618
... 14.2.3 ... Feed Bundler ... 619
... 14.2.4 ... Feed Filter ... 619
... 14.2.5 ... Manuelle Implementierung von Feed-basierten Mashups ... 619
... 14.2.6 ... Feed Mixer ... 620
14.3 ... Widgets... 621
... 14.3.1 ... Was haben Widgets zu bieten? ... 621
... 14.3.2 ... Wo finde ich Widgets? ... 622
... 14.3.3 ... Wie programmiere ich Widgets? ... 623
14.4 ... Web Scraping ... 624
14.5 ... Zugriff auf APIs ... 625
... 14.5.1 ... Was sind APIs? ... 625
... 14.5.2 ... Wie verwende ich APIs? ... 627
14.6 ... Zusammenfassung ... 628

Teil IV ... Web 2.0-Publishing

15 ... Podcasts, Vidcasts & Screencasts ... 631

15.1 ... Was ist Podcasting? ... 632
15.2 ... Möglichkeiten des Podcastings ... 633
15.3 ... Podcasts produzieren ... 633
... 15.3.1 ... Grundlegende Richtlinien des Podcastings ... 634
... 15.3.2 ... Plan und Entwurf ... 635
... 15.3.3 ... Achtung, Aufnahme! ... 636
... 15.3.4 ... Technische Aufrüstung ... 636
... 15.3.5 ... Vorbereitung der Dateien ... 640
... 15.3.6 ... Veröffentlichen ... 640
15.4 ... Zusammenfassung ... 641

16 ... Wikis ... 643

16.1 ... Was ist ein Wiki? ... 644
16.2 ... Wiki-Engines in der Übersicht ... 646
... 16.2.1 ... Allgemeine Lösung ... 646
... 16.2.2 ... Software-Management und Dokumentation ... 646
... 16.2.3 ... All-In-One-Lösung für große Unternehmen ... 647
... 16.2.4 ... Schnelle und einfache Lösung ... 647
... 16.2.5 ... Kompaktes Werkzeug für kleine Gruppen ... 648
... 16.2.6 ... Volltextsuche in hochgeladenen MS Office-Dateien ... 648
... 16.2.7 ... Weitere Informationen... 649
16.3 ... Installation einer Wiki-Engine – MediaWiki ... 649
16.4 ... Zusammenfassung ... 653

17 ... Weblogs ... 655

17.1 ... Was sind Weblogs? ... 656
17.2 ... Weblog-Engines in der Übersicht ... 658
... 17.2.1 ... Professionelle Lösung für anspruchsvolle Aufgaben ... 658
... 17.2.2 ... Mächtiges CMS mit einfacher Markup-Sprache ... 661
... 17.2.3 ... Intuitiver Alleskönner ... 662
... 17.2.4 ... Leistungsstark und einfach zu bedienen ... 663
... 17.2.5 ... Weitere Lösungen ... 664
17.3 ... WordPress-Theme entwerfen ... 665
... 17.3.1 ... Vorüberlegung und Vorbereitung ... 666
... 17.3.2 ... Grundlagen ... 667
... 17.3.3 ... Methoden und Attribute ... 668
... 17.3.4 ... Installation von WordPress ... 669
... 17.3.5 ... Analyse und Strukturierung des statischen Templates ... 671
... 17.3.6 ... Hochladen der Dateien und Umsetzen des Header-Bereichs... 671
... 17.3.7 ... Umsetzung des Content-Bereichs ... 673
... 17.3.8 ... Umsetzung der Sidebar-, Footer- und Comments- Bereiche ... 674
... 17.3.9 ... Erweiterungen und manuelle Änderungen ... 677
... 17.3.10 ... Validierung, Überprüfung, Zusammenstellung ... 679
17.4 ... Weblogs: Strategie zum Erfolg ... 680
... 17.4.1 ... Heuristiken ... 680
... 17.4.2 ... Strategie ... 683
17.5 ... Zusammenfassung ... 685

18 ... Schlusswort ... 687

18.1 ... Das mobile Web wird zum Standard ... 689
18.2 ... Das Web als Interactive Pool ... 690
18.3 ... Einheitliche Identität und das Web als Betriebssystem ... 690