Webdesign mit (X)HTML und CSS

Transkript

1 Webdesign mit (X)HTML und CSS Das Praxisbuch zum Einsteigen, Auffrischen und Vertiefen Deutsche Ausgabe der 3. englischen Auflage Jennifer Niederst Robbins Übersetzung von Kathrin Lichtenberg O'REILLY* Beijing Cambridge Farnham Köln Paris Sebastopol Taipei Tokyo

2 INHALT Vorwort xi Teil I Der Einstieg Kapitel 1 Wo fange ich an? 3 Komme ich zu spät? 4 Wo fange ich an? 4 Was muss ich lernen? 5 Muss ich Java lernen? 8 Was muss ich kaufen? 12 Was Sie gelernt haben 18 Testen Sie sich 18 Kapitel 2 Wie das Web funktioniert 19 Internet und Web im Vergleich 19 Ihre Informationen anbieten 20 Ein Wort zu Browsern 20 Webseitenadressen (URLs) 21 Die Anatomie einer Webseite 23 Zusammenfassung 26 Testen Sie sich 28

3 Kapitel 3 Das Wesen des Webdesigns 29 Browserversionen 29 Alternative Browser 32 Benutzereinstellungen 35 Unterschiedliche Plattformen 38 Verbindungsgeschwindigkeit 39 Größe des Browserfensters und Monitorauflösung 40 Farbdarstellung des Monitors 44 Lernen Sie Ihr Publikum kennen 47 Behalten Sie das Gesamtbild im Auge 48 Testen Sie sich 48 Teil II HTML für die Struktur Kapitel 4 Eine einfache Seite anlegen 51 (HTML-Überblick) Eine Webseite, Schritt für Schritt 51 Starten Sie zuerst einen Texteditor 52 Schritt 1: Beginnen Sie mit Inhalt 55 Schritt 2: Strukturieren Sie das Dokument 57 Schritt 3: Kennzeichnen Sie Textelemente 60 Schritt 4: Ein Bild hinzufügen 63 Schritt 5: Das Aussehen mit einem Stylesheet ändern 66 Wenn gute Seiten Fehler haben 67 Testen Sie sich 69 (X)HTML-Überblick: Elemente für die Dokumentstruktur 70 Kapitel 5 Text auszeichnen 71 Blöcke bauen 72 Listen 76 Zeilenumbrüche hinzufügen 79 Inline-Textelemente 81 Generische Elemente (div und span) 86 Einige Sonderzeichen 89 Zusammenfassung 91 Testen Sie sich 93 (X)HTML-Oberblick: Textelemente 94

4 Kapitel 6 Links hinzufügen 95 Das Attribut href 96 Auf Seiten im Web verweisen 97 Links innerhalb Ihrer eigenen Site 98 Ein neues Browserfenster ansprechen Links 111 Testen Sie sich 111 (X)HTML-Überblick: Das Ankerelement 113 Kapitel 7 Bilder hinzufügen 115 Ein Wort zu den Bildformaten 115 Das img-element 116 Imagemaps 123 Testen Sie sich 127 (X)HTML-Überblick: Bild- und Imagemap-Elemente 128 Kapitel 8 Tabellen auszeichnen 129 Wie Tabellen benutzt werden 129 Die minimale Tabellenstruktur 130 Tabellenheader 134 Verbundene Zellen 134 Zelleninnenabstand und Zellenabstand 136 Titel und Zusammenfassungen 138 Barrierefreie Tabellen 139 Zusammenfassung 140 Testen Sie sich 142 (X)HTML-Überblick: Tabellen 142 Kapitel 9 Formulare 143 Wie Formulare funktionieren 143 Das form-element 145 Variablen und Inhalt 147 Barrierefreie Formulare 148 Große Zusammenfassung der Formularelemente 150 Formularlayout und -design 162 Testen Sie sich 162 (X)HTML-Überblick: Formulare 163

5 Kapitel 10 Die Standards verstehen 165 Alles, was Sie über HTML wissen wollten, aber nicht zu fragen wagten Weiter mit XHTML 169 Aus Sicht des Browsers 174 Den Dokumenttyp deklarieren 174 Welche sollen Sie nehmen? 176 Ihre Dokumente validieren 177 Zeichenkodierung 180 Zusammenfassung 181 Testen Sie sich 183 Teil III CSS Für die Darstellung Kapitel 11 Einführung in Stylesheets 187 Die Vorteile von CSS 187 Wie Stylesheets funktionieren 188 Die großen Konzepte 194 Weiter mit CSS 200 Testen Sie sich 202 Kapitel 12 Text formatieren 203 (und weitere Selektoren) Die Schrifteigenschaften 204 Die Textfarbe ändern 217 Einige weitere Selektorentypen 218 Textzeilenänderungen 222 Unterstriche und andere»dekorationen«225 Die Großschreibung ändern 226 Platz da! 227 Testen Sie sich 230 CSS-Überblick: Schrift- und Texteigenschaften 232

6 Kapitel 13 Farben und Hintergründe 233 (und noch mehr Selektoren und externe Stylesheets) Farbwerte angeben 233 Vordergrundfarbe 238 Hintergrundfarbe 239 Darf ich vorstellen: Pseudoklassenselektoren 240 Pseudoelementselektoren 242 Hintergrundbilder 246 Die Kurzschrifteigenschaft background 254 Zu guter Letzt: externe Stylesheets 254 Stylesheets für Druck (und andere Medien) 257 Testen Sie sich 259 Überblick: Färb- und Hintergrundeigenschaften 260 Kapitel 14 Das Box-Modell in CSS 261 (Innenabstände, Rahmen und Außenabstände) Die Element-Box 261 Die Größe des Inhalts einstellen 262 Innenabstand (padding) 266 Rahmen 269 Außenabstand (margin) 275 Display-Rollen zuweisen 281 Das Box-Modell im Überblick 282 Testen Sie sich 282 Überblick: Grundlegende Box-Eigenschaften 284 Kapitell 5 Ausrichten und Positionieren 285 Normaler Fluss 285 Ausrichten 286 Grundlagen der Positionierung 295 Relative Positionierung 296 Absolute Positionierung 297 Feste Positionierung 307 Testen Sie sich 309 Überblick: Grundlegende Layouteigenschaften 310

7 Kapitel 16 Seitenlayout mit CSS 311 Layoutstrategien 311 Flüssiges Seitendesign 312 Feste Layouts 314 Elastische Layouts 316 Vorlagen für das Seitenlayout 318 Eine Seite fester Breite zentrieren 334 CSS-Layouts im Überblick 335 Testen Sie sich 336 Kapitel 17 CSS-Techniken 337 Stileigenschaften fürtabellen 337 Listenanstriche und -nummern ändern 340 Listen für die Navigation verwenden 344 Techniken zur Bildersetzung 347 CSS-Rollover 349 Ein Rückblick auf Stylesheets 354 Testen Sie sich 354 Überblick:Tabellen- und Listeneigenschaften 356 Teil IV Webgrafiken erzeugen Kapitel 18 Grundlagen von Webgrafiken 359 Bildquellen 359 Zu den Formaten! 362 Bildgröße und Auflösung 373 Mit Transparenz arbeiten 377 Das Webgrafik-Einmaleins zusammengefasst 385 Testen Sie sich 385

8 Kapitel 19 Schlanke Webgrafiken 387 Wozu optimieren? 387 Allgemeine Optimierungsstrategien 388 GIFs optimieren 390 JPEGs optimieren 394 PNGs optimieren 400 Auf Dateigröße optimieren 401 Optimierung im Überblick 402 Testen Sie sich 402 Teil V Von Anfang bis Ende Kapitel 20 Der Prozess der Site-Entwicklung Entwurf und Recherche Inhalt erzeugen und verwalten Das»Look and Feel«entwickeln Einen funktionierenden Prototyp herstellen Tests Veröffentlichen Sie die Site Pflegen Sie die Site 413 Der Entwicklungsprozess im Überblick 413 Testen Sie sich 414 Kapitel 21 Ihre Seiten ins Web bringen Serverplatz suchen 417 DerVeröffentlichungsprozess 420 Dateien mit FTP übertragen 423 Testen Sie sich 426

9 Anhang A Antworten 427 Anhang B CSS2.1 -Selektoren 451 Index 453