Hussein Morsy Adobe Dreamweaver CS6 Der praktische Einstieg
Inhalt Vorwort 26 Teil I Einführung 1 Ein Platz im Internet 1.1 Wie kommt meine Site ins Internet? 26 Was ist eine Website? 26 Ein Platz im WWW 27 1.2 Die eigene Domain 27 Was ist eine Domain? 28 Subdomains 28 Top-Level-Domains 29 Ist meine Domain noch frei? 29 Domains registrieren 31 1.3 Einen Provider finden 32 Auswahl eines Webhosters 32 Das passende Angebot finden 33 Brauche ich einen eigenen Webserver? 34 Wie konfigurieren Sie Ihren Webspace? 34 2 Die Sprachen des Web 2.1 Welche Sprachen gibt es? 38 2.2 Hypertext Markup Language 39 Strukturieren von Inhalten 40 Tag-Attribute 41 HTML-Entities 41 Header und Body 41 Darstellung im Browser 42 Extensible Hypertext Markup Language (XHTML) 42 HTML5 43
Inhalt 2.3 Cascading Stylesheets 44 Externe CSS-Datei 44 CSS3 45 2.4 JavaScript 46 2.5 Ajax 47 2.6 PHP und MySQL 47 2.7 Webbrowser und Rendering-Engines 49 3 Dreamweaver CS6 - los geht's 3.1 Neues in Dreamweaver CS6 54 Fließendes Rasterlayout 55 Multiscreen-Vorschau 55 Erstellung von mobilen Applikationen 56 CSS-Übergänge 56 Detailverbesserungen 57 3.2 Dreamweaver installieren und aktualisieren 58 Updates 58 3.3 Der Programmstart 59 3.4 Schnellstart: Probieren Sie Dreamweaver aus 60 Ihre erste HTML-Seite erstellen 60 Eine Website mit Hyperlinks und Bildern erstellen 65 4 Die Arbeitsumgebung 4.1 Dokumentenfenster 74 Entwurfsansicht 74 Live-Ansicht 75 Code-Ansicht 76 Teilen-Ansicht 76 Statuszeile 77 Der Code-Navigator 78 4.2 Das Eigenschaften-Bedienfeld 79 Texteigenschaften 79 6
CSS-Eigenschaften 80 Bildeigenschaften 80 Weitere Eigenschaften 81 Eigenschaftsfenster in zwei Darstellungen 81 4.3 Bedienfelder 81 Bedienfelder organisieren 81 Bedienfelder gruppieren 82 Das»Einfügen«-Bedienfeld 83 4.4 Anpassen der Arbeitsumgebung 84 Arbeitsbereiche 84 Voreinstellungen 84 HTAAL5 voreinsteüen 85 Teil II Ein Websiteprojekt 5 Eine neue Website 5.1 Unser Beispielprojekt 90 Beispielwebsite herunterladen 91 Lokaler Site-Ordner 91 5.2 Neue Site anlegen und konfigurieren 92 5.3 Site bearbeiten oder importieren 94 Wechseln zwischen Sites 95 6 Eine Vorlage anlegen 6.1 Vorlage entwerfen 98 Was ist eine Vorlage? 98 Beispiele im Web 99 Vorlage planen 100 6.2 Ein Layout erstellen 101 6.3 Beispielinhalte erstellen 104 6.4 Eine Vorlage mit bearbeitbaren Bereichen erstellen... 107 Speicherort für Vorlagen 109
flpb '"halt 7 Seiten mit Inhalten füllen 7.1 Neue Webseite erstellen 112 Neue Dateien aus Vorlage erzeugen 113 Seitentitel vergeben 115 7.2 Seiteninhalte einfügen 116 Texte erstellen 117 Überschriften 119 Listen erstellen 119 Bilder einfügen 120 Tabellen erstellen 123 8 Erstellen einer Navigation 8.1 Hauptnavigation 128 AAenüeinträge bearbeiten 131 8.2 Fußzeilennavigation 134 8.3 Vorlage speichern und auf Seiten anwenden 137 9 Das Design festlegen 9.1 Erstellen von Grafik-Segmenten 140 Das Kopf-Segment 141 Das Inhalts-Segment 141 Das Fuß-Segment 142 9.2 Aufbau von CSS-Dateien 142 CSS-Datei bearbeiten 144 9.3 CSS-Regeln für das Layout der Beispielwebsite 146 Die CSS-Regel»body«148 Die CSS-Regel Die CSS-Regel Die CSS-Regel Die CSS-Regel Die CSS-Regel».Container«149».header«151»h1«153».content«155».sidebart«155 Die CSS-Regel».footer«156 8
CSS-Regel für die Links in der Fußzeile erstellen 159 CSS-Regeln für die Navigation 161 10 Websites testen, veröffentlichen und verwalten 10.1 Website im Browser testen 166 Browservielfalt 166 Browsershots 167 Browservorschau einstellen 168 Website im Browser testen 170 Webseite im Adobe BrowserLab testen 170 Alle Hyperlinks testen 171 Browserkompatibilität und Zugänglichkeit prüfen 173 10.2 FTP-Übertragung konfigurieren 173 10.3 Übertragen der Site auf den Server 176 Übertragen über das Fenster»Dateien«176 Übertragung im Dokumentenfenster 179 Website synchronisieren 181 10.4 Website verwalten 182 Teil III Dreamweaver im Detail 11 Texte eingeben und strukturieren 11.1 Textinhalte erstellen 188 Text eingeben 188 Sonderzeichen eingeben 189 Leerzeichen eingeben 190 11.2 Inhalte strukturieren 191 Überschriften 191 Absätze 192 Einrückungen 193 Vorformatierte Absätze 194 Listen 195 Hervorhebungen 196 9
Inhalt 11.3 Importieren aus Word 197 Word-HTML optimieren 197 Texte aus der Zwischenablage einfügen 198 Stylesheets und Word 201 12 Arbeiten mit CSS 12.1 Was sind Cascading Stylesheets? 204 Vorteile von CSS 205 Externe und interne CSS 205 CSS in Vorlagen einsetzen 206 12.2 Methoden zur CSS-Erstellung 207 12.3 CSS für Einsteiger 207 CSS über Seiteneigenschaften 208 CSS über das Eigenschaften-Bedienfeld 211 12.4 Fortgeschrittene CSS-Techniken 215 Das Fenster»CSS-Stile«216 Neuen CSS-Stil erstellen 217 CSS-Stile bearbeiten 224 CSS-Stile-Eigenschaften 224 Überprüfen-Modus 226 CSS-Regeln löschen oder deaktivieren 226 Klassen-Selektoren umbenennen 227 CSS-Stile Texten zuweisen 227 Externe Stylesheets verknüpfen 229 Stylesheets verschieben 230 CSS-Übergänge 231 13 Bilder einfügen 13.1 Bilder bearbeiten 238 13.2 Bildformate für das Web 238 GIF 239 JPEG 240 PNG 241 10
Inhalt 13.3 Bilder, Platzhalter und Hintergründe 242 Bilder einfügen 242 Bild-Platzhalter einsetzen 244 Bilder oder Platzhalter austauschen 245 Rollover-Bilder einsetzen 246 13.4 Bildeinstellungen 246 Alternativtext eingeben 247 Bildgröße einstellen 247 Bilderzuschneiden 249 Helligkeit und Kontrast anpassen 250 Bild scharf stellen 251 14 Tabellen erstellen 14.1 Tabellen für Daten und Layout 254 14.2 Verschiedene Tabellenansichten 256 Standard-Ansicht 256 Erweiterte Ansicht 256 14.3 Erstellen einer Tabelle 257 14.4 Eigenschaften von Tabellen 260 Tabellen markieren 260 Einstellungen für komplette Tabellen vornehmen 262 Höhe und Breite anpassen und zurücksetzen 263 14.5 Eigenschaften von Tabellenbereichen 263 Spalten, Zeilen und Zellen auswählen 264 Einstellungen für Tabellenbereiche 265 Tabellenzellen gruppieren 266 Spalten und Zeilen hinzufügen und löschen 268 14.6 Tabellen sortieren 269 15 Hyperlinks einsetzen 15.1 Navigieren mit Hyperlinks 272 Funktionsweise von Hyperlinks 272 Das Wichtigste: die URL 273 1
15.2 Hyperlinks anlegen in Dreamweaver 274 Externe und interne Hyperlinks 275 Links innerhalb einer Webseite 276 Löschen von Hyperlinks 279 15.3 Spezielle Hyperlinks anlegen 279 Leere Links 279 E-Mail-Links 279 Imagemaps 281 Download-Links 283 Automatische Weiterleitung 283 16 Interaktivität mit JavaScript 16.1 Wie funktioniert JavaScript? 286 16.2 JavaScript im Eigenschaften-Bedienfeld 287 16.3 JavaScript über Menüs einfügen 289 16.4 JavaScript über Verhalten integrieren 290 Funktionsweise eines Verhaltens 291 Ein Verhalten einfügen 292 Aktionen hinzufügen 295 Aktionen bearbeiten und löschen 296 Ereignis festlegen 297 16.5 Das JavaScript-Framework Spry 298 Sryp-Funktionen einfügen 299 16.6 Widgets: Skripte übernehmen 300 17 Formulare erstellen 17.1 Eigenschaften von Formularen 304 17.2 Erstellen von Formularen 305 Formularbereich einrichten 305 17.3 Formularelemente 306 Aufbau eines Formularelements 306 Formularelemente einfügen 307 12
Einfache Textfelder 308 Kennwortfelder 309 Mehrzellige Textfelder/Textbereich 309 Auswahllisten 310 Kontrollkästchen 311 Optionsschalter 312 Schaltflächen 313 Versteckte Felder 314 Dateifeld 314 Feldgruppe 315 17.4 Formulare gestalten 315 Formulare mit Tabellen gestalten 315 Formulare mit CSS gestalten 316 17.5 Formularüberprüfung einbauen mit Spry 322 Felder überprüfen 323 Eigene Fehlermeldungen festlegen 324 Spry-Überprüfungen bearbeiten 325 17.6 Benutzereingaben per Skript auslesen 325 18 Mobiles Web 18.1 Websites für mobile Geräte entwickeln 330 18.2 Responsive Webdesign 331 Wie funktioniert Responsive Webdesign? 332 Seite mit flexiblem Layout anlegen 332 Layout für mobile Geräte 335 Layout für Tablet-Geräte 338 Layout für Desktopgeräte 340 18.3 Mobile Web-Apps mit j'query Mobile 341 Charakteristika von mobilen Websites 342 Was ist jquery Mobile? 343 Eine Web-App mit Dreamweaver CS6 erstellen 343 Neue Seite hinzufügen und verlinken 347 18.4 Native mobile Apps mit PhoneGap-ein Ausblick 351
Teil IV Über Dreamweaver hinaus 19 Dreamweaver und die Creative Suite 19.1 Die Creative Suite 6 356 19.2 Adobe Photoshop CS6 357 Photoshop-Dateien in Dreamweaver importieren 357 Bilder aus der Zwischenablage einfügen 359 Bilder in Photoshop bearbeiten 360 Voreinstellungen 361 19.3 Adobe Fireworks CS6 362 Fireworks-Dateien in Dreamweaver importieren 363 Bilder in Fireworks bearbeiten 364 19.4 Adobe Flash CS6 364 So funktioniert Flash 364 Plugin erforderlich 365 Flash-Filme integrieren 365 Eigenschaften von Flash 366 19.5 Adobe Bridge 367 20 Bloggen mit Word Press 20.1 Was sind Weblogs? 370 20.2 Leistungsmerkmale von WordPress 371 20.3 Weblog mit WordPress erstellen 371 WordPress installieren 372 20.4 WordPress administrieren 377 Einloggen im Administrationsbereich 377 Schreiben von Beiträgen 378 Verwalten von Beiträgen 379 20.5 Word Press-Templates 379 Themes anpassen 382
21 Gesucht und gefunden bei Google 21.1 Ihre Website mit Google bekannt machen 385 21.2 Tipps zur Suchmaschinenoptimierung 387 Verwenden Sie Titel und»alt«-attribute 388 AAeta-Tags 389 Website von anderen Websites verlinken 391 Was Sie unbedingt vermeiden sollten 391 21.3 Besucherstatistiken mit Google Analytics 392 Google Analytics einrichten 393 21.4 Anzeigen mit Google AdWords 396 21.5 Geld verdienen mit Google AdSense 396-22 Mashups YouTube, GoogleMaps und Twitter integrieren 22.1 YouTube-Videos einbinden 402 22.2 Google AAaps integrieren 405 22.3 Twitter integrieren 408 Index 408