So verwenden Sie Adobe Dreamweaver

click fraud protection

Adobe Dreamweaver ist ein so mächtiges Werkzeug für Webdesigner, weil es so viele Möglichkeiten bietet. All diese Dinge, die Sie tun können, erschweren das Lernen natürlich. Erfahren Sie mehr über die vielen Möglichkeiten von Dreamweaver, einschließlich der Änderungen in der neuesten Version CS5. Und vergiss nicht, die Dinge zu überprüfen, die sind fehlt in Dreamweaver CS5.

Illustration einer Person, die Adobe Dreamweaver verwendet
Lifewire / Briana Gilmartin

Definieren einer Site

  • Starten Sie eine neue Website
  • Eine Website erstellen
  • Richten Sie nur die Teile der Site ein, die Sie benötigen, wenn Sie sie benötigen *Neu in CS5
  • Richten Sie Remote-, QA- und Testserver für umfassendere Workflows ein *Neu in CS5
  • Neue Verzeichnisse erstellen und veröffentlichen
  • Ändern Sie den Dokumenttyp
  • Fügen Sie Metadaten in Ihre Seiten ein

Ihre Website live schalten

  • Definieren Sie eine Remote-Site
  • FTP-Dateien zum Webserver
  • Verwenden Sie ein Versionskontrollsystem, um Dateien ein- und auszuchecken
  • Verbinden Sie sich mit Subversion für eine erweiterte Versionskontrolle *Neu in CS5
  • Hinterlasse Notizen für deine Teamkollegen

Webseiten erstellen

  • Schreiben Sie eine Seite im WYSIWYG-Modus
  • Schreiben Sie eine Seite in HTML
  • Erstellen Sie eine neue Seite aus einer Vorlage
  • Erstellen Sie eine neue Seite von Grund auf
  • Erstellen Sie eine Vorlage
  • Speichern Sie Dateien in Ihrem Site-Verzeichnis
  • Definieren Sie die Seiteneigenschaften

CSS

  • CSS-Stylesheets verwenden
  • Inline-Stile hinzufügen
  • Erstellen Sie ein externes Stylesheet
  • Anhängen eines externen Stylesheets
  • Klassen-, ID-, Tag- und zusammengesetzte CSS-Selektoren erstellen
  • Bestehende CSS-Regeln bearbeiten
  • CSS für druckbare Seiten erstellen
  • Stileigenschaften aktivieren und deaktivieren *Neu in CS5
  • CSS-Boxmodell visuell prüfen *Neu in CS5

Text

  • Text ändern
  • Verwenden Sie verschiedene Schriftarten
  • Zeilenumbruch einfügen
  • Sonderzeichen verwenden
  • Fügen Sie das heutige Datum ein
  • Kommentare schreiben
  • Anwenden HTML-Tags jemandem eine SMS schicken
  • HTML-Attribute zu Tags hinzufügen

Links

  • Text und Bilder verlinken
  • Site-Links überprüfen
  • Ändern Sie die Standardlinkfarben (Link, besucht, schweben, aktiv)
  • Erstellen Sie Tooltipps zu Links
  • Mailto-Links erstellen
  • Webseiten-Anker erstellen

Bilder

  • Grafiken zu einer Seite hinzufügen
  • Bilder bearbeiten
  • Bilder skalieren
  • Alt-Text zu Bildern hinzufügen
  • Fügen Sie den Bildern zusätzliche Optionen für die Barrierefreiheit hinzu
  • Bilder und Text ausrichten
  • Rollover-Image erstellen
  • Verwenden Imagemaps
  • Tracing-Bilder verwenden
  • Bildplatzhalter verwenden
  • Fireworks-HTML einfügen
  • Photoshop-Dateien einfügen

Layout

  • Verwenden Sie die mitgelieferten kostenlosen Vorlagen *Neue CSS-Starter-Layouts in CS5
  • Divs für das Layout einfügen
  • Bearbeiten Sie Divs im Bedienfeld „CSS-Stile“
  • Absolut positionierte Elemente einfügen
  • Absolut positionierte Elemente im Eigenschafteninspektor formatieren
  • Lineale, Raster und Hilfslinien verwenden

Listen

  • Aufzählungs- und nummerierte Listen hinzufügen
  • Listenaufzählungszeichen und -nummern anpassen

Tabellen

  • Erstellen Sie eine Tabelle
  • Kopfzeilen und -spalten hinzufügen
  • Verwenden transparente Bilder Tabellenzellen offen halten
  • Erstellen Sie Spalten mit fester Breite und flexibler Breite
  • Ändern Sie die Rahmenstile von Tabellen
  • Eine Tabelle in eine Tabelle einbetten
  • Tabellendaten importieren

Formen

  • Verwenden Sie ein Mailto-Formular
  • Formularaktionen definieren
  • Text, Radio, Kontrollkästchen, Datei, Bild, Auswahlfelder und ausgeblendete Formularfelder hinzufügen
  • Machen Sie Ihre Formulare mit Feldern und Beschriftungsfeldern zugänglich
  • Erstellen Sie benutzerdefinierte Schaltflächen zum Senden
  • Formulare mit JavaScript validieren (Spry)

Datenbanken und PHP-Scripting

  • Hängen Sie Ihre Website an eine Datenbank an
  • Richten Sie eine PHP/mySQL-Site ein
  • Verwenden Sie Spry-Elemente, um eine Verbindung zur Datenbank herzustellen
  • Fügen Sie Datenobjekte in Ihre Seiten ein
  • Testen und aktualisieren Sie eine Spry-Datenquelle oder -Anzeige
  • Bearbeiten Sie komplexe dynamische Websites in der Entwurfsansicht
  • Entdecken Sie alle dynamisch verwandten Dateien, um PHP-CMS-Sites zusammenzustellen (WordPress, Joomla und Drupal) *Neu in CS5
  • Benutzerdefinierte Klassenhinweise für PHP-Code, einschließlich Frameworks von Drittanbietern wie dem Zend-Framework *Neu in CS5

Rahmen

  • Erstellen Sie eine gerahmte Website
  • Noframes-Inhalt bearbeiten
  • Formatieren und stylen Sie Ihre Rahmen
  • Richten Sie standardmäßige Linkziele zwischen Frames ein

Interaktivität hinzufügen

  • Erstellen Sie ein Fotoalbum (nicht mehr in CS5)
  • Sound zu Webseiten hinzufügen
  • Erstellen Sie ein Dropdown-Menü
  • Verwenden Sie Dreamweaver-Verhalten, um Popup-Fenster zu öffnen, Sprungmenüs zu erstellen, Sound abzuspielen, Bilder auszutauschen und mehr
  • RSS-Feeds zu einer Site hinzufügen
  • Flash-Text als Rollover einfügen
  • CSS-Text als Rollover einfügen
  • Andere Plugins einfügen
  • Spry-Menüleiste, Bedienfelder mit Registerkarten, Akkordeon, QuickInfo und reduzierbares Bedienfeld hinzufügen
  • Verwenden Sie den Widget-Browser, um neue Widgets für Ihre Website zu finden, ohne JavaScript zu kennen

Testen Sie Ihre Seiten

  • Testen Sie Ihre Seiten in der Live-Ansicht, um die Änderungen aufgrund von JavaScript und Interaktivität zu sehen *Neu in CS5
  • Validieren Sie Ihren HTML-Code
  • Vorschau Ihrer Seiten in mehreren Browsern
  • Verwenden Sie BrowserLab, um eine Vorschau Ihrer Seiten in anderen Betriebssystemen anzuzeigen *Neu in CS5
  • Verwenden Sie Device Central, um zu überprüfen, wie die Seiten auf Mobilgeräten aussehen
  • Browserkompatibilität prüfen
  • Ändern Sie die Einstellungen entsprechend den Anforderungen Ihrer Website
  • Interne Site-Links prüfen
  • Testen Sie die Barrierefreiheit Ihrer Website (nicht mehr in CS5)
  • Konvertieren Sie a Word-Datei zu HTML

Dreamweaver anpassen

  • Erweiterungen hinzufügen
  • Erweiterungen deaktivieren
  • Dreamweaver mit Verknüpfungen anpassen

Steigern Sie Ihre Effizienz

  • Verwenden Sie integrierte Tastenkombinationen
  • Codeschnipsel verwenden
  • Vorlagen erstellen und verwenden
  • Generieren Sie neue Seiten aus benutzerdefinierten Vorlagen
  • Vorlagen aktualisieren
  • Einschließen einer Datei in eine andere mit der Dreamweaver-Bibliothek
  • Bibliothekselemente aktualisieren
  • Einschließen einer Datei in eine andere mit SSI
  • Verwenden Sie Suchen und Ersetzen