1 Fangen wir mit einem Gerüst an – Aufbau einer Seite und die wichtigsten Elemente
21
Die drei ??? – HTML, CSS und JavaScript
22
Struktur einer HTML-Seite
31
Attribute, leere Tags und Links
33
Links zwischen zwei Seiten – über den Gartenzaun
38
Das Ziel im Auge – das Attribut target
41
Text war gestern – Bilder
45
Bevor das Bild geladen wurde …
47
Das sollte man im Kopf haben – mehr vom <head>
50
Andere Länder, andere Zeichen: Character Encoding
52
Denk noch mal drüber nach: Übungen
56
2 Das World Wide Web, unendliche Weiten – Serverkommunikation, Adressen, Standards
59
Wo finde ich denn nun meine Seite? Von Webservern und DNS
60
URLs – alles an der richtigen Adresse
63
Ferngespräch für Herrn Web Server – HTTP
67
Jetzt wird es ernst – unser eigener Webserver
71
Hier geht's weiter für alle Systeme
77
Das obligatorische Geschichtskapitel – die Geschichte des World Wide Web
79
Man nehme ein ARPANET und lasse es reifen …
79
… rühre etwas Hypertext unter …
80
… und köchle alles, bis es bunt wird
82
Das Ende von Mosaic und der erste Browserkrieg
83
Microsofts Monopol und der zweite Browserkrieg – der Rote Panda schlägt zurück
86
HTML ist nicht gleich HTML – eine Sprache, verschiedene Dialekte
88
3 Jetzt kommt Farbe ins Spiel – Einführung in CSS
91
Webseiten mit Stil – Inline Styles und Farben
92
Inline ist out – Stylesheets
95
Welches Element hätten's denn gerne? Selektoren nach Tags, IDs und Klassen
98
Übungen mit dem Regenbogen
106
Drei Farben reichen völlig aus – das RGB-Modell
110
Durchschaut: rgba() und opacity
114
Wir halten uns im Hintergrund – background-image
116
Wohin damit? background-repeat, background-position und background-attachment
118
Hier war ich doch schon mal – Pseudoklassen für Links
125
Farben und Selektoren: Übungen zum Abschluss
127
4 Kaskaden für Bossingen – CSS-Selektoren und Typografie
129
Was heißt jetzt eigentlich Cascading?
130
CSS – den Tätern auf der Spur
134
Größe zeigen – mit font-size
138
Ahnenforschung für Anfänger – Selektoren für Kinder und Nachfahren
143
Für Fortgeschrittene: Nachfahren-Selektoren mit mehreren Ebenen
148
Seichte Kost, nur die direkten Kinder selektieren
149
Von Schriftgrößen und Selektoren: Übungen
150
Es muss nicht immer Times New Roman sein – Schriftarten
156
Gutenbergs Erben – mehr von Schriften und Typografie
162
Die Schriftliche Prüfung: Übungen
166
6 Von der Wiege bis zur Bahre – Formulare
209
Mehr als nur anfragen: endlich mitreden
210
Daten eingeben und zum Server schicken – einfaches Formular
213
Request ist nicht gleich Request – post und get
221
Aber tippen ist anstrengend! Checkboxen und Radiobuttons
224
Wer ist denn nun der Auserwählte? Select-Boxen
228
Jetzt kommt endlich die Suche!
234
Das muss ja nicht jeder sehen – versteckte Felder
237
Jetzt kannst du doch noch Opern quatschen – Textarea
238
Formulare 2.0 – viel Neues in HTML5
241
Formulare müssen nicht nach Behörde aussehen – CSS für Forms
244
Übungen! Neue Felder, neue Stile
249
Alle Dateien laden hoooooch – File Upload
252
7 Von Rändern und Schuhkartons – Seitenlayout in HTML und CSS
255
Die Grundlagen für alles – Block- und Inline-Elemente
256
Das Box-Model – stapelbares HTML
258
Fünf kleine <div>-Container …
264
Das Gesetz des Kompasses
267
Und weiter geht's mit den fünf <div>s
269
Abstände aus der Nähe betrachtet
270
10 Liter HTML in einem 5-Liter-<div> – Overflow
272
Schrödinger in seinem Element – Container schubsen
274
Genau dort – absolute Positionierung
276
Der StapelzeugTM-Stapelplan
278
Mehr zu Positionierung
283
Elemente im Fluss – float und clear
287
Von Boxen und Stapeln
292
Und so sieht der Stylesheet am Ende aus:
297
Semantik statt <div> – was gibt's Neues in HTML5?
298
Die CSS-Eigenschaft display – warum?
300
Wer verdeckt wen? z-index
303
Das Fenster im Fenster
306
9 Schöner wohnen mit CSS3
329
Zum Schutz vor blauen Flecken – runde Ecken
330
Rahmenbilder für Bilderrahmen
334
Urlaubsfotos aus den 80ern
338
Die Kiste im Licht – box-shadow
347
Und es bewegt sich doch
355
Und es bewegt sich noch etwas
359
Die Farbe des Kaffees
362
Gerade war gestern – CSS-Transformationen
364
Jetzt bist du dran mit Drehen und Schieben
367
Auf in die dritte Dimension!
370
Gemeinsam sehen sie stark aus – Effekte mit CSS3
372
Wie in der Zeitung – mehrspaltiges Layout
379
Die richtige Textverteilung
383
10 Jetzt muss es sich aber endlich bewegen – JavaScript
385
JavaScript, was ist das eigentlich?
386
Und wie geht es jetzt?
389
Merk's dir für später – Variablen
395
Daten rein, Daten raus I: Ausgabe
406
Woher weiß ich, wenn ein Fehler auftritt?
411
Zeichen, Zeichen, Zeichenkette
413
Daten rein, Daten raus II: Eingabe
416
Übungen zu Strings und Ausgabe
420
Strings besser zusammenbauen
424
Variablen, solange wir sie brauchen – Block-Scope
431
Formulare – bitte geben Sie Ihre Adresse an
433
Wenn die Praxis funktioniert, dann fehlt noch die Theorie
437
Was? Wie? Wenn? Dann?
440
11 Programmieren mit Bausteinen – Funktionen
443
Funktionen fürs Kochrezept
444
So funktioniert's mit Funktionen
451
Mehr Werte, als man zählen kann – Arrays
455
Eine Übung für zwischendurch
461
Von vorne bis hinten mit for
463
Parameter für Fortgeschrittene
469
Gut verteilt mit dem Spread-Operator
471
Einfach mal anders schleifen – die for-of-Schleife
472
Mehr Zuweisung fürs gleiche Geld
473
Von Dingen und Zeigern
475
Wie funktionieren meine Funktionen?
478
Manchmal geht alles schief – Fehler
480
Funktionen, Bürger erster Klasse
485
Funktionen in Funktionen in Funktionen
492
13 Gerade stand das da noch nicht – DOM-Manipulation
529
Ein DOM für die HTML-Seite
530
Gärtnern für Webentwickler – das DOM als Baum
534
Des Zauberlehrlings Hausaufgabe
537
Mal wieder Wiederholungen – while-Schleifen
546
Von einem Element zum anderen – navigieren im DOM
548
Rein, rauf, runter, raus – Elemente erzeugen, einfügen, entfernen und verschieben
552
Die Meisterprüfung des DOM-Zauberlehrlings
560
15 Halt, hiergeblieben! Cookies, WebStorage und File-API
611
Der Griff in die Keksdose
612
Cookies selbst gebacken
617
Daten, so weit das Auge reicht – Web Storage
623
Iterieren über Web Storage
625
Das Beispiel am Stück – und mit Objekt!
628
Mehr zu Local Storage – Events und Limits
631
Von Sandbox zu Sandbox
632
Heute das Dateisystem, morgen die Welt
635
Was du schon immer über eine Datei wissen wolltest
636
Dateien lesen - der FileReader
637
Dateien in der Praxis
642
Dateien und Bäckereien
651
Dateiauswahl – wir können auch anders
656
Und wir können auch noch anders – noch mal Dateiauswahl
658
16 Alles kann ein Radio sein, oder ein Fernseher, oder sogar eine Leinwand – Multimedia
663
Bild und Ton im Browser
664
Die Fernbedienung für alles – <audio> und <video> mit JavaScript
670
Was alles gehen und schiefgehen kann
675
Was war und was kommt mit Multimedia
677
Schrödingers Terassenradio
680
Picasso, Monet, Schrödinger – zeichnen auf dem <canvas>
683
Das JavaScript für die Grundausstattung
685
Ein Beispiel macht alles klar – das erste Rechteck
686
Transformationen – die Leinwand drehen und strecken
690
Werkzeug zur Hand, das Diagramm wird transformiert
692
Und jetzt mit Tabellen-Daten
693
Farbähnliche Dingsdas
712
Übungen mit interessanter Überschrift
717
Leinwand für Fortgeschrittene
721
18 Jedem das Seine – Responsive Webdesign und Mobile Devices
763
Was ist Responsive Design, und wozu ist es gut?
764
Jedem seine Styles – Media Types in CSS2
767
Media Features – CSS3 schafft neue Möglichkeiten
770
Stapelzeug Responsive
771
Schritt 1: Zuerst wird die Sidebar umpositioniert
774
Schritt 2: Jetzt mit handytauglicher Navigation
776
All die vielen Bildschirme!
780
Das Kreuz mit den Bildern
782
Größer … größer … größer … zu groß!
789
Sparsamer laden mit data-Attributen
792
Was kann so ein Mobildings sonst noch?
796
Wo zum Teufel bin ich?
799
Schrödinger unterwegs
806
Internationalisierung – Formatieren für überall
811
Internationalisierung – gut sortiert, und das überall
817