Ihr Weg zur eigenen Website beginnt hier! Sie möchten gerne einen eigenen Webauftritt haben, Ihnen fehlen aber die nötigen Vorkenntnisse? Dieses Buch zeigt Ihnen, wie's geht! In lockerer und verständlicher Sprache lernen Sie die Webtechniken HTML, CSS, JavaScript und Suchmaschinenoptimierung für Google (SEO) kennen. Vorkenntnisse werden nicht vorausgesetzt, vielmehr erfahren Sie bereits zu Beginn an einem praktischen Beispiel, was sich aus technischer Sicht hinter den Begriffen Browser, Website und Co. überhaupt verbirgt. Am Ende der Lektüre kennen Sie die Grundlagen der Website-Erstellung und können eine technisch sauber umgesetzte und visuell ansprechende Beispielwebsite erstellen. Sie erfahren außerdem, wie Sie das Layout anpassen und Ihre Website nach den Kriterien des Responsive Webdesign gestalten, damit die Seite auf allen Anzeigegeräten gut aussieht. Das ist aber nur das halbe Ziel: Das Buch macht Sie zudem mit wichtigen, kostenlosen Hilfsmitteln vertraut, mit denen Sie Ihre Website für Google optimieren, Dienste wie Google Maps nutzen oder einen Online-Shop einrichten können. Websites planen, erstellen und bekannt machen ganz ohne Vorwissen! HTML, CSS und JavaScript verständlich erklärtVideos, Fotos, Karten, Kontaktformulare, mobile Websites Aus dem Inhalt:Beispiele, Ziele, ZielgruppenBlogs erstellen und gestaltenHTML5 und CSS3Responsive WebdesignJavaScript einsetzenVideos, Fotos, KartenSoziale Netzwerke einbindenSuchmaschinenoptimierung (SEO)Usability und BarrierefreiheitWebsite bewerbenWebshop einbinden
Inhaltsverzeichnis
Für wen ist dieses Buch? . . . 13
1. Ein eigener Webauftritt in fünf Minuten . . . 17
1. 1 . . . Die Visitenkarte des Zauberers . . . 18
1. 2 . . . Welche Technik lässt das Web ticken? . . . 26
1. 3 . . . Fazit . . . 30
2. Wer braucht was - die eigene Website planen . . . 31
2. 1 . . . Wie sieht eine gute Website aus? . . . 31
2. 2 . . . Warum wollen Sie eine Website? . . . 33
2. 3 . . . Was? Wen? Wie? Womit? . . . 34
2. 4 . . . Umsetzung planen . . . 38
2. 5 . . . Fazit . . . 41
3. Ein besserer Webauftritt in drei Stunden . . . 43
3. 1 . . . Für den Dienst anmelden und die Site einrichten . . . 44
3. 2 . . . Den Seitenaufbau festlegen . . . 45
3. 3 . . . Die Bilder festlegen . . . 47
3. 4 . . . Das Layout umsetzen . . . 47
3. 5 . . . Fazit . . . 51
4. Die ersten Schritte mit HTML und CSS . . . 53
4. 1 . . . Die Vorteile einer eigenen Website . . . 53
4. 2 . . . Alle Webseiten bestehen aus HTML . . . 54
4. 3 . . . Sie schreiben selbst HTML . . . 57
4. 4 . . . Woher kommt die Gestaltung? . . . 66
4. 5 . . . Das richtige Werkzeug - der HTML-Editor . . . 76
4. 6 . . . Besser lesbares HTML für Browser und Mensch . . . 81
4. 7 . . . Fazit . . . 89
5. Die eigene Website erstellen . . . 91
5. 1 . . . Das Konzept . . . 92
5. 2 . . . Den Inhalt mit HTML anlegen . . . 95
5. 3 . . . Die Gestaltung mit CSS . . . 112
5. 4 . . . Fazit . . . 165
6. Die eigene Website im Internet . . . 167
6. 1 . . . Die Website ins Internet bringen . . . 167
6. 2 . . . Browser ist nicht gleich Browser . . . 179
6. 3 . . . Bildschirm ist nicht gleich Bildschirm . . . 191
6. 4 . . . Gerät ist nicht gleich Gerät . . . 215
6. 5 . . . Mit Neugier zu immer besseren Websites . . . 223
6. 6 . . . Fazit . . . 225
7. Ein Kontaktformular anlegen . . . 227
7. 1 . . . Kontaktformular oder E-Mail-Adresse? . . . 227
7. 2 . . . Pflichtangaben zum Kontakt . . . 228
7. 3 . . . Die Standardlösung . . . 229
7. 4 . . . Ein einfaches Kontaktformular . . . 229
7. 5 . . . Planung und Gestaltung . . . 233
7. 6 . . . Der HTML-Code für unsere Arzt-Beispielsite . . . 234
7. 7 . . . Das Skript auf dem Server . . . 237
7. 8 . . . Fazit . . . 241
8. Mehr Interaktivität mit JavaScript . . . 243
8. 1 . . . Das erste JavaScript . . . 244
8. 2 . . . Ein schnelles Skript für die Beispiel-Website . . . 246
8. 3 . . . JavaScript und HTML trennen . . . 250
8. 4 . . . Funktionen . . . 252
8. 5 . . . Variablen . . . 255
8. 6 . . . Arrays . . . 258
8. 7 . . . Ereignisse . . . 260
8. 8 . . . Beispiel: Ein schlaues Formular . . . 260
8. 9 . . . Text auf der Seite einfügen . . . 269
8. 10 . . . Text auf der Seite elegant ändern . . . 271
8. 11 . . . Auf Fehlersuche - Debugging . . . 274
8. 12 . . . Fazit . . . 280
9. Die Site spielend finden und benutzen - Suchmaschinenoptimierung, Usability, Accessibility . . . 281
9. 1 . . . Suchmaschinenoptimierung . . . 282
9. 2 . . . User Experience & Usability /Benutzerfreundlichkeit . . . 306
9. 3 . . . Accessibility - Barrierefreiheit . . . 309
9. 4 . . . Fazit . . . 310
10. Noch mehr Inhalt - Videos, Fotos, Karten und soziale Netze einbinden . . . 311
10. 1 . . . Google Maps & Bing Maps . . . 311
10. 2 . . . YouTube & Vimeo . . . 314
10. 3 . . . Fotodienste - Flickr und Google Photos . . . 316
10. 4 . . . Slideshare . . . 319
10. 5 . . . Soziale Netzwerke - Facebook und Twitter . . . 320
10. 6 . . . Fazit . . . 326
11. Marketing und Werbung - Gutes tun und darüber reden . . . 327
11. 1 . . . Klassische Werbung . . . 328
11. 2 . . . Werbung im Internet . . . 329
11. 3 . . . Marketing im Internet . . . 338
11. 4 . . . Fazit . . . 351
12. Mit der eigenen Website Geld verdienen . . . 353
12. 1 . . . Welche Möglichkeiten gibt es? . . . 353
12. 2 . . . Ein Beispielwebshop - Aro Argentinos Fanshop . . . 358
12. 3 . . . Fazit . . . 363
13. Starke Werkzeuge - so nutzen Sie Ihr neues Wissen für noch bessere Websites . . . 365
13. 1 . . . Was Ihnen Ihr neues Wissen ermöglicht . . . 365
13. 2 . . . Werkzeuge für Einsteiger . . . 367
13. 3 . . . Werkzeuge für Fortgeschrittene . . . 374
13. 4 . . . Werkzeuge für Profis . . . 383
13. 5 . . . Fazit . . . 399
Anhang A. Übersicht der wichtigsten HTML5-Elemente, CSS3-Eigenschaften und -Selektoren . . . 401
A. 1 . . . HTML5-Elemente . . . 401
A. 2 . . . CSS3-Eigenschaften . . . 405
A. 3 . . . CSS3-Selektoren . . . 411
Anhang B. Glossar . . . 413
Index . . . 419
