Details

HTML5 und CSS3 für Dummies


HTML5 und CSS3 für Dummies


Für Dummies 2. Aufl.

von: David Karlins, Judith Muhr

21,99 €

Verlag: Wiley-VCH
Format: EPUB
Veröffentl.: 18.06.2014
ISBN/EAN: 9783527681433
Sprache: deutsch
Anzahl Seiten: 320

DRM-geschütztes eBook, Sie benötigen z.B. Adobe Digital Editions und eine Adobe ID zum Lesen.

Beschreibungen

Mit diesem Buch lernen Sie als Webdesigner die Vorteile von HTML5 und CSS3 kennen und gezielt einzusetzen, um einzigartige Webseiten zu gestalten, die sowohl funktional sind als auch optisch etwas zu bieten haben. Finden Sie heraus, welche Neuerungen HTML5 und CSS3 mit sich bringen und welche Designmöglichkeiten sie Ihnen bieten. Nutzen Sie HTML5, um Inhalte zu organisieren und strukturieren, und spielen Sie Video- und Audiodateien ab. Mit CSS3 verpassen Sie dem Layout dann den letzten Schliff: Animieren Sie Übergänge und Effekte, fügen Sie Schatten und Farbverläufe hinzu und nutzen Sie Responsive Webdesign, um Ihre Seiten auch auf Smartphones und Tablets optimal darzustellen. Zusätzlich hat der Autor zahlreiche Tipps zu praktischen Online-Tools für Sie, beispielsweise zum Erstellen von Grafiken oder Animationen, die Ihnen beim Webdesign sehr hilfreich sein können.
Inhaltsverzeichnis Über den Autor 7 Einführung 19 Über dieses Buch 19 Törichte Annahmen über den Leser 19 Symbole in diesem Buch 20 Wie es weitergeht 20 Teil I Seitenaufbau und Design mit HTML5 und CSS3 21 Kapitel 1 Struktur und Design mit HTML5 und CSS3 23 Zauberei mit HTML5 und CSS3 24 Nicht ganz neu . . . aber anders! 25 HTML5: Aufbau auf HTML-Techniken 28 HTML-Grundlagen verstehen 30 Fünf Dinge, die Sie über HTML wissen müssen 31 Die ersten Schritte bei der Verwendung einer grundlegenden HTML-Vorlage 32 Die HTML-Dokumentstruktur 34 Die grundlegende Element-Syntax 35 Mit dem -Element arbeiten 36 Das -Element und -Tags verwenden 36 Überschriften, Listen und Links 38 Klassenstile verwenden 40 CSS-Grundlagen 41 Ein CSS-Dokument erstellen 43 CSS-Stildefinitionen genauer betrachtet 44 Stildefinitionen kombinieren 46 Weiter mit HTML5 und CSS3 47 Kapitel 2 HTML5 einsetzen 49 Die Vorteile von HTML5 erkennen 49 Der Preis für den Einsatz von HTML5 51 Die vereinfachte doctype-Deklaration – Einführung 52 Die neuen standardisierten Strukturelemente von HTML5 verstehen 54 Neuer Prozess und Ablauf 55 Eine kurze Einführung in semantische Elemente 56 Die -Tags sind tot – es leben die -Tags! 57 Eine neue Rolle für grundlegende Tags 58 Mit HTML5 etwas Eigenes schaffen 59 HTML5-Elemente für Skripting mit JavaScript 64 Das -Element 65 Das -Element verwenden 65 Kapitel 3 CSS3 für Design, Interaktivität und Animation 71 Mit CSS3-Design aus dem rechteckigen Käfig ausbrechen 73 Wie es bisher war 73 Ein neues Design-Paradigma 74 Mit CSS3 Bilder ersetzen 75 Der Ausbruch aus den Kästen 75 Hintergrundverläufe 76 CSS3 und Mobilgeräte – ein perfektes Paar 77 Animation mit CSS3 79 CSS mit JavaScript kombinieren 80 Design mit Web Fonts 81 Web Fonts leicht gemacht 82 Link auf einen Web Font 82 Kapitel 4 Kompatibilitätsprobleme und Lösungen 87 HTML5 und CSS3 in alten Browsern verwenden 88 Was Sie schon immer über IE8 (und älter) wissen wollten, aber bisher nicht zu fragen wagten 89 Hacking-Lösungen 91 Sites in IE8 (und älter) testen 95 Graceful Degradation (Allmähliche Funktionsminderung) für die Abwärtskompatibilität 95 Browser-Kriege wegen HTML5 und CSS3 98 Anbieterspezifische CSS-Präfixe verwenden 98 Konkurrierende Video-Formate 99 Video für IE8 erstellen 100 Mobile Kompatibilität 102 Ein Wort zu Flash 102 Teil II Seiten mit HTML5 erstellen 103 Kapitel 5 Semantische Tags in HTML5 105 Die verschiedenen Arten semantischer Elemente verstehen 105 Semantische Tags in HTML5 für die Seitenstrukturierung 106 Nicht-strukturierende semantische Tags 108 Weitere semantische Tags von HTML5 109 Mit fünf Elementen Inhalt strukturieren 112 Wissen, wann was zu verwenden ist 112 Vorlage für eine grundlegende HTML5-Seite 115 Stile für strukturierende Tags 116 HTML5 für spezifischen Inhalt 118 Verwendung der - und -Elemente 119 Definition von - und -Tags 120 Markieren mit dem -Tag 121 und verwenden 122 Adressen definieren 123 Styling für Inhalts-Tags 124 Vorteile der semantischen Tags von HTML5 124 Kapitel 6 HTML5-Formulare 127 HTML5-Formulare – Eine unterschätzte Ressource 128 Überblick über die neuen Parameter für die HTML5-Formularfelder 129 HTML5 im Vergleich zu JavaScript oder serverseitigen Skripts 131 Kompatibilitätsprobleme 133 HTML5-Formulare erstellen 133 Formularaktionen 134 Definition von Eingabe- und Beschriftungs-Tags 137 Platzhaltertext definieren 137 HTML5-Eingabetypen implementieren 138 Einen Eingabetyp definieren 139 Eingabetypen zur Unterstützung der Barrierefreiheit 139 Eine Datenliste definieren 141 Formularausgabeelemente erstellen 143 HTML-Formularvalidierung 143 Pflichteingaben 143 E-Mail-Adressen validieren 144 Zahlen validieren 144 Ein letztes Wort zu HTML5-Formularen 145 Kapitel 7 Natives Video und Audio 147 Natives Video und Audio – ein Überblick 148 Natives Video und Audio – genauer betrachtet 149 Proprietäre Plug-ins identifizieren 149 Den Aufstieg von nativen Medien verstehen 150 Design für eine komplexe Video-Landschaft 152 Komprimierte Video-Formate 152 Video aus Ihrer Kamera: Nicht Primetime-fähig 153 Konkurrierende native Video-Formate 153 Unterschiedliche Player in unterschiedlichen Browsern 154 Umwandlung von Video in native Formate 159 Ihre Optionen für das Hosting nativer Videos 161 Natives Video optimieren 163 Grundlegende Syntax für HTML5-Video 163 Bereitstellung von Optionen für andere als HTML5-Browser 165 Ein Poster hinzufügen 166 Ein Video vorab laden 166 Natives Audio einbetten 167 MP3-Audio in OGG umwandeln 168 Ein HTML5-Audio-Element einbetten 168 Alternative Audio-Optionen 170 Kapitel 8 Mobile Geräte: Responsives Design und jQuery Mobile 171 Die Natur und die Rolle von responsivem Design verstehen 171 Ein Tag im Leben eines Multigeräte-Benutzers 172 Drei Ansätze für responsives Design 177 Die Evolution und die Rolle des Fluid-Designs 179 Responsives Design mit Medien-Abfragen implementieren 180 Zwei Techniken für Medien-Abfragen 180 Unterschiedliche Ansätze für unterschiedliche Benutzer (-Displays) 182 Definition von Medien-Abfragen mit mehreren CSS-Dateien 182 Geräte zwingen, ihre Breite zu melden 183 CSS-Dateien für unterschiedlich große Displays erstellen 183 Responsives Design in einer einzigen CSS-Datei bereitstellen 187 Web-Apps mit jQuery Mobile erstellen 190 Wie jQuery Mobile funktioniert 191 Eine grundlegende jQuery Mobile-Vorlage erstellen 191 jQuery Mobile und data–role-Elemente 194 jQuery Mobile-Inhalt anpassen 195 Themen zuweisen 196 Themen mit ThemeRoller anpassen 198 Teil III CSS3-Effekte und Transformationen 203 Kapitel 9 Styling mit CSS3-Eigenschaften 205 Die Evolution von CSS 206 Phase 1: Styling mit HTML 206 Phase 2: Styling mit CSS 207 Phase 3: Rechteckige Bereiche und Bilddateien gehören der Vergangenheit an 208 Übergänge in CSS3 208 Eigenschaften von CSS3-Übergängen 210 transition–timing–function verwenden 211 Kompatibilitätsprobleme bei Übergängen 213 Verzögerungen in CSS3 realisieren 213 Syntaxbeispiele für CSS3-Übergänge 214 Geht noch mehr? 216 Farben mit CSS3 neu definieren 217 Reibungsloserer Arbeitsablauf mit RGB und HSL 218 A steht für Alpha 220 Alpha oder Opazität? 220 Unterstützung von RGB- und HSL-Farbe 222 Kapitel 10 Anwendung von CSS3-Effekten 223 CSS3-Effekte optimal nutzen 224 Mit Rahmenradien aus dem Box-Modell ausbrechen! 224 CSS3-Rahmenbilder anwenden 227 Schlagschatten in CSS3 anwenden 228 Effekte und Präfixe für ihre Kompatibilität 229 Effekte animieren 231 CSS3-Effekte definieren 232 Einen Rahmenradius definieren und anwenden 232 Rahmenbilder definieren 235 Feldschatten definieren 238 Textschatten erstellen 239 Textumrisse erstellen 240 Effekte animieren 241 Kapitel 11 CSS3-Transformationen anwenden und animieren 245 Wissen, wie Transformationen angewendet werden 246 Vorteile des Designs mit Transformationen 248 Die Transformationssyntax verstehen 250 Transformationen kombinieren 251 Überlappende Ebenen verwalten 253 Kompatibilität von Transformationen 254 Transformationen mit Übergängen animieren 254 Übergänge für Transformationen 255 Eine animierte Bildgalerie erstellen 256 Animation mit @keyframes 260 Verstehen, wie @keyframes funktionieren 260 Bewegung für @keyframes 263 @keyframes-Eigenschaften 265 Kompatibilität von @keyframes und Präfixe 266 Mit @keyframes ein bewegliches Banner-Element definieren 266 Kapitel 12 Verläufe mit CSS3 erstellen 269 Die Entwicklung der CSS3-Verläufe 270 Gedreht und strahlenförmig 271 Verläufe und mobile Geräte: Ein perfektes Paar 273 Lösungen für Kompatibilitätsprobleme 274 Syntax für CSS3-Verläufe in den verschiedenen Browsern 275 Verläufe mit kostenlosen Online-Generatoren definieren 277 Ultimate CSS Gradient Generator 279 Verwendung voreingestellter Verläufe und die Vorschaufunktion 279 Definition von Farbtabulatoren in Verläufen 281 Hintergrundverläufe speichern und anwenden 281 Teil IV Der Top-Ten-Teil 285 Kapitel 13 Die zehn besten HTML5-DesignRessourcen 287 Notepad++ 287 TextWrangler 289 Komodo Edit 289 Adobe Dreamweaver 291 FileZilla 292 W3Schools 293 W3C Markup Validation Service 293 AMP Express 294 Hipster Ipsum – Blindtextgenerator 295 jQuery Widget Factory 296 Kapitel 14 Die zehn besten CSS3-Design-Tools 297 Ultimate CSS Gradient Generator 297 Adobe Kuler 298 Color Scheme Designer 299 CSS3 Generator 300 CSS3 Box Shadow Generator 301 CSS 3.0 Maker 301 Animate.css 302 Web Designer Wall 303 CSS Menu Maker 304 Notepad RT 305 Kapitel 15 Die zehn besten FormulardatenRessourcen 307 MailChimp 307 FreeFind 308 Google Docs 309 Benutzerdefinierte Google-Suchmaschine 310 TheSiteWizard 311 FormTools 312 jQuery Menu Widget 312 Freedback 313 EmailMeForm 314 Zoho Creator 315 Stichwortverzeichnis 317
David Karlins ist professioneller Webdesigner und erfahrener Fachbuchautor, der auch "Building Websites All-in-One For Dummies" geschrieben hat.