I > HTML, XHTML und XML: Gemeinsamkeiten und Unterschiede 19. Internet oder World Wide Web? Homepage: Grafik und Querverweise

Inhaltsverzeichnis I > HTML, XHTML und XML: Gemeinsamkeiten und Unterschiede 19 Internet oder World Wide Web?......................................
0 downloads 2 Views 2MB Size
Inhaltsverzeichnis

I >

HTML, XHTML und XML: Gemeinsamkeiten

und

Unterschiede

19

Internet oder World Wide Web?......................................................

19

Homepage: Grafik und Querverweise...............................................

20

HTML, die Sprache für Webseiten.................................................... Das World Wide Web Consortium (W3C)...............................................

21 22 22

HTML, XHTML oder

XML?......................................................................

Was sich hinter WAP verbirgt.........................................................

24

Wo bekommen Sie Ihre Homepage?................................................ Kostenloser Webspace.........................................................................

25 25 26

Die eigene

Domäne.............................................................................

Von Netscape bis Internet Explorer - Eigenheiten der Browsertypen....

27

Tools und Ressourcen...................................................................

28

HTML-Layoutprogramme...................................................................... HTML-Quelltext-Editoren....................................................................... Sonstige Tools..................................................................................... Webressourcen....................................................................................

2

m

Willkommen

im Web: Die erste Seite in HTML

28 30 31 31

33

HTML ist einfach: Head und Body erstellen....................................... Eine Seite ganz schnell erstellen........................................................... Los geht’s: Kopf und Rumpf................................................................. Das Umlaut-Problem............................................................................

33 34 36 37

Verweis auf Dokumenttyp-Definition......................................................

38

Seminararbeit im Netz: Überschriften und Absätze............................ Überschriften, Absätze und Linien......................................................... Tags mit Attributen steuern.................................................................. Nummerierung und Aufzählungszeichen................................................

39 39 41 42

Für die Optik: Erweiterte Schrifteigenschaften...................................

43 43 44

Tags zur

Schriftgestaltung....................................................................

Schriftart und -färbe ändern................................................................. Leerzeilen erzeugen.............................................................................

Lauftext...............................................................................................

3a

45 46

Fotogalerie im Web: Farben und Grafiken

47

Mit Scanner und Digitalkamera - Bilder aufbereiten......................... Vor- und Nachteile der Grafikformate....................................................

47 48

Welches Grafikprogramm?................................................................... Scannen und Nachbearbeiten der Fotos................................................

48 49

Fotos und Grafiken ins Dokument einbinden.................................... Eine Grafik als Verweis nutzen.............................................................. Grafik ausrichten................................................................................. Breite, höhe und Alternativtext.............................................................

50 50 51 53

Tapete für die Homepage: Hintergrund gestalten..............................

Ein-Pixel-Grafik.................................................................................... Farbverlaufeffekt..................................................................................

54 54 54

Hintergrundmuster...............................................................................

55

Tipps und Tricks zu Grafiken........................................................... Sichere Webpalette.............................................................................. Hintergrundfarbe transparent schalten.................................................. Rahmen um die Grafik legen................................................................ Grafik baut sich langsam auf................................................................

56 56 56 57 58

Animationen und Banner erstellen..................................................

59

Textbanner mit Animation Shop........................................................... Animation mit StarOffice......................................................................

59 60

4.

Hyperlinks: Externe und interne Querverweise

63

Querverweise zu anderen Webseiten............................................... Planung muss sein: Struktur festlegen.................................................. Seiten erstellen und miteinander verlinken............................................ Verweise auf Seiten in Unterordnern..................................................... Links auf externe Webseiten setzen......................................................

63 63 64 66 67

Links auf Dateien und Newsgruppen............................................... Verweis auf eine Datei......................................................................... Verweis auf eine Newsgruppe...............................................................

68 69 69

Feedback ist wichtig: Der E-Mail-Link............................................... E-Mail-Link mit Betreff..........................................................................

70 71

Grafik-Links als Schalter................................................................

72

Verweise innerhalb der eigenen Seite.............................................. Die Tipps-und-Tricks-Sammlung............................................................ Interne Anker definieren....................................................................... Verweise auf interne Anker...................................................................

73 73 74 76

Sounds und Videos in die Seiten einbinden.....................................

77

Hyperlink auf Mediadatei...................................................................... Datei per einbinden...............................................................

5a

Klangdateien als Hintergrundsound......................................................

77 78 79

Tipps und Tricks zu Hyperlinks........................................................ Hyperlinks umfärben............................................................................ Neues Browserfenster öffnen................................................................

80 80 81

Hyperlinks mit Quickinfo...................................................................... Image Maps erstellen...........................................................................

81 82

Präsentieren Sie Ihr Büro mit Style Sheets

85

Perfektes Layout durch Formatvorlagen........................................... Ihr Büro präsentiert sich im Web!......................................................... Dokument ohne Formatvorlagen........................................................... Style Sheets in das Dokument einbinden.............................................. Die zweite Version des Dokuments.......................................................

85 86 88 88 91

6a

7■

Klassen, Container und Inline-Style ................................................. Eigene Klassen definieren..................................................................... Kaskadierende Formatvorlagen............................................................. Listen interessant gestalten.................................................................. Freie Gestaltung mit div und span........................................................ Inline-Styles verwenden........................................................................

94 94 94 96 96 98

Elemente absolut positionieren....................................................... Pixelgenaue Ausrichtung mit position ................................................... Reihenfolge festlegen mit z-index.........................................................

98 99 100

Dynamische Hyperlinks erstellen.................................................... Pseudo-Klassen...................................................................................

101 101

Tipps zu Hover-Links............................................................................

102

Style Sheets extern auslagern........................................................

103

Die Meinungsumfrage

105

per Feedback-Formular

Daten abschicken: per E-Mail oder CGI?........................................... Quelltext für das Formular.................................................................... Formularauswertung per CGI................................................................ Formularauswertung per E-Mail.............................................................

105 105 107 107

Ihr Name bitte: Texteingabefelder erstellen...................................... Einfache Texteingabefelder................................................................... Attribute für Texteingabefelder.............................................................. Mehrzeiliges Texteingabefeld................................................................

108 108 109 109

Wählen Sie: Auswahlfelder, Radioknöpfe und Kontrollkästchen.......... Auswahlfelder......................................................................................

110 110

Radioknöpfe........................................................................................ Kontrollkästchen.................................................................................. Submit und Reset................................................................................

110 111 111

Exaktes Layout mit Tabellen

113

So erstellen Sie einfache Tabellen................................................... Einfache Tabelle...................................................................................

114 114

Tabellen Interessant gestalten.............................................................. Zellen verbinden..................................................................................

115 117

8a

Richten Sie den Zellinhalt genau aus............................................... Genaue Maße mit width und height...................................................... Zellinhalt ausrlchten mit allgn und vallgn.............................................. Tabelle passt sich der Breite des Browserfensters an.............................

118 118 121 1 23

Besser navigieren mit Frames

125

Seite in zwei Frames aufteilen........................................................ Dokumente vorbereiten........................................................................ Das Frameset erstellen........................................................................ Zeilen statt Spalten..............................................................................

130

Anzeige der Frames steuern........................................................... Rahmen unterdrücken..........................................................................

131 132

Rollbalken anzelgen und unterdrücken.................................................. Rahmengröße kann nicht verändert werden.......................................... Abstand zwischen Rahmenrand und Rahmeninhalt.................................

9

*

25 1 26 128

1

132 133 134

Ein Logo einbinden: Dreigeteiltes Fenster........................................

135

Ungleichmäßiges Layout: Framesets schachteln...............................

137

Verweise aus dem Frameset heraus................................................

140

Der schnelle Einstieg: Hallo XML

143

Wohlgeformte und gültige Dokumente............................................ Unterschiede zwischen HTML und XML..................................................

143 143

Gültige Dokumente.............................................................................. Der Nutzen von XML............................................................................

145 146

Wohlgeformte Dokumente....................................................................

148

Definieren Sie Ihre eigenen Tags..................................................... Hallo XML!.......................................................................................... Struktur Im Browser betrachten............................................................

148 148 150

Die Bücherliste mit Dokumenttyp-Definition.....................................

151 151

Das

XML-Dokument.............................................................................

Die

Dokumenttyp-Definition..................................................................

Schlüsselwörter und Indikatoren........................................................... Verweis auf die DTD setzen..................................................................

Validierenden Parser verwenden.....................................................

152 153 154 1

56

10

.

XML-Praxis: Datenbank,

Hyperlinks und WML

DTD

und Tags für die Produktdatenbank .......................................... Die DTD planen ................................................................................... Attribute definieren .............................................................................. Das XML-Dokument.............................................................................

159 159 160 162

INamensräume und Dateninseln ...................................................... HTML-Datei in XML einbinden............................................................... Geht auch: XML in HTML......................................................................

163 164 165

Hyperlinks mit XLink......................................................................

166

Grundaufbau einer WML-Datei........................................................

167

Diese Tags können Sie verwenden........................................................ Beispielseite in WML............................................................................

11«

171

XML-Dokumente mit CSS gestalten................................................. Verweis auf CSS-Datei setzen...............................................................

171 172

Display: inline oder block?...................................................................

172

im Internet Explorer.................................................... Das erste Beispiel: Hallo XSL................................................................ Grafik und Tabelle mit XSL...................................................................

174 174 176

Mit Inline-Styles arbeiten......................................................................

177

XSL professionell: Daten aufbereiten und sortieren........................... Schleife bilden mit for-each..................................................................

178 178

gestalten............................................... Datenbank als sortierte Liste ausgeben................................................. Die Produktdatenbank mit XSL

.

167 168

CSS oder XSL? Layout für XML

XSL als XSLT

12

159

181 182

Mehr Dynamik durch JavaScript

185

Durchstarten mit JavaScript........................................................... JavaScript und Java............................................................................. Objekte, Eigenschaften und Methoden.................................................. Hallo Welt - Das erste Programm......................................................... JavaScript und XML/XSL......................................................................

185 186 188 190 194

JavaScript in Funktionen einbinden................................................. Skript in eine Funktion einbauen.......................................................... Funktionen durch Event-handler aufrufen.............................................. Farbwechsler: Mehrere Funktionen kombinieren....................................

195 195 196 199

Umleitung, Passwort, Browserabfrage............................................. Hyperlinks mit JavaScript..................................................................... Surfer auf andere Seiten umleiten........................................................

200 200 202

Begrüßung mit Variablen..................................................................... Einfache Passwortabfragen erstellen.....................................................

204 207 209 210 212 213 216 218

Passwortabfrage in externe Datei auslagern.......................................... hartnäckige Abfrage mit der while-Schleife............................................ Dreimalige Abfrage mit einer Zählschleife.............................................. Passwortabfrage mit Fallunterscheidung............................................... Passwortabfrage, die schwerer zu enträtseln ist..................................... Browserabfrage und Infos zum Surfer...................................................

Bequemer navigieren per Menü...................................................... Pulldown-Menü mit Schaltfläche........................................................... Noch bequemer navigieren mit OnChange.............................................

13.

222 222 225

Eigene JavaScript-Fenster programmieren........................................ Einfache Fenster erzeugen.................................................................... Fensterinhalt rollen und exakt positionieren.......................................... Fenster schließen................................................................................

226 226 228 229

Fenster als Fernbedienung...................................................................

231

Besser

reagieren:

Cookies,

Datum,

Frames

und

Forms

235

Fehlerbehandlung in Formularen.................................................... Versehentliches Reset verhindern.........................................................

235 235

Formularfeld auf Eingabe kontrollieren.................................................. Kontrolle vor dem Abschicken..............................................................

238 240

E-Mail-Adresse auf Gültigkeit prüfen......................................................

242

Datum und Uhrzeit anzeigen.......................................................... Das Datum ausgeben.......................................................................... Arrays helfen: Wochentag und Monatsnamen........................................ Uhrzeitanzeige im Formularfeld............................................................. Besuchszeit ermitteln...........................................................................

245 245 248 251 255

Mit JavaScript Cookies definieren.................................................... Cookies schnell im Griff....................................................................... Surfer wiedererkennen mit Cookies.......................................................

260 260 261

Speicherort der Cookies................ Cookie auslesen und reagieren............................................................. Namentliche Begrüßung mit Cookies....................................................

262 265 268

Besser navigieren in Framesets...................................................... Zwei Frames auf einmal ändern............................................................ Drei Frames auf einmal ändern............................................................. Pulldown-Menü in Frames....................................................................

273 274 278 280

Dokumente in Framesets ein- bzw. ausgliedern.....................................

14

.

Seiten mit Pep: Animation,

Dynamik und DHTML

285 286 288

Ein animiertes Banner erstellen......................................................

289

Banner mit JavaScript.......................................................................... Diashow statt Banner...........................................................................

290 292

Lauftext erzeugen......................................................................... Lauftext im Formularfeld...................................................................... Lauftext in der Statuszeile....................................................................

293 294 295

Ebenentechnik: Objekte fliegen lassen............................................. Objekte animieren............................................................................... Skript für beide Browser tauglich machen.............................................

295 296 300

Pulldown-Menü mit DHTML.............................................................

302

komplette Dokument..................................................................... Das Skript im Überblick........................................................................ Das

.

285

Dynamische Schaltflächen............................................................. Dynamik mit Inline-Skript..................................................................... Skript verbessern durch Vorladen der Grafiken......................................

Style Sheets vorbereiten......................................................................

15

281

Hallo Webmaster, bitte hochladen

303 304 305

309

Meta-Tags und mehr.....................................................................

309

Die Site auf den Server laden

310

Seiten mit WS_FTP auf den Server laden...............................................

16

.

Tipps zu WS_FTP.................................................................................

310 312

Anmeldung bei Suchmaschinen...................................................... Suchmaschinen im Überblick...............................................................

313 313

Seite bei Katalogen anmelden.............................................................. Seite bei Crawlern anmelden................................................................

313 314

Automatische Eintragung........,............................................................

315

Anhang

317

Internetzugang per DFÜ.................................................................

317

Tipps für erfolgreiches Webdesign...................................................

318

Gästebuch und Besucherzähler......................................................

320

Für Umsteiger: HTML versus XHTML................................................. Viele Freiheiten in HTML.......................................................................

320 321

HTML.................................................. Dokumenttyp-Definition (DTD).............................................................. Aufbau eines korrekten XHTML-Dokuments........................................... Weitere Unterschiede........................................................................... XHTML als strenge Fassung von

Fehler im JavaScript-Code finden....................................................

17

.

322 322 324 325 330

Referenz

335

Dateiendungen und Zeichencodes..................................................

335

HTML-Kurzreferenz........................................................................ Farben................................................................................................ Sonderzeichen in HTML........................................................................

336 336 336

Allgemeine Tags..................................................................................

wichtigsten Tags zur Textauszeichnung........................................... Font-Tag.............................................................................................. Tags zur Ausrichtung von Text.............................................................. Listen.................................................................................................. Formulare........................................................................................... Sonstige Tags..................................................................................... Lauftext (marquee)............................................................................... Die

337 338 338 339 339 339 340 340

Grafiken und Mediadateien

einbinden...................................................

341

Anker und Hyperlinks........................................................................... Tabellen..............................................................................................

342 342

Framesets...........................................................................................

343

CSS-Referenz: Die wichtigsten Attribute........................................... Maßeinheiten

in CSS............................................................................

344 344

Schrifteigenschaften............................................................................

345

Texthervorhebungen............................................................................

345

Textausrichtung...................................................................................

346

Listen gestalten...................................................................................

347

Farben und Hintergrund....................................................................... Außenrand und Innenrand....................................................................

348 351

Rahmen..............................................................................................

352

Elemente absolut positionieren.............................................................

354

Pseudo-Klassen

354

für Hyperlinks..................................................

JavaScript-Kurzreferenz.................................................................

355

Skript in HTML-Code einbinden:............................................................ Funktionen definieren..........................................................................

355 355

Event-Handler......................................................................................

357

Rechenoperatoren

357

und Verkettungsoperator..........................................

Vergleichsoperatoren...........................................................................

358

Eingabe, Ausgabe,

358

Bestätigung............................................................

Seiten öffnen, schließen JavaScript-Fenster Informationen Methoden

und auf Seiten verweisen................................

öffnen.....................................................................

über das screen-Objekt

auslesen.....................................

des date-Objekts..................................................................

358 359 360 360

Das history-Objekt............................................................................... Schleifen.............................................................................................

360 361

Bedingungen und Fallentscheidung...................................................... Zeichenketten......................................................................................

361 362

Arrays.................................................................................................

362

Position in Ebenen ansprechen.............................................................

363

Sonstige Anweisungen

363

Stichwortverzeichnis

und Schlüsselwörter..........................................

365

Suggest Documents