Übersicht über die Funktionen

Dreamweaver CC 2017.5 unterstützt die folgenden neuen Funktionen und Erweiterungen:

• Git-Unterstützung zur Verwaltung von Dateien in Dreamweaver
• Neue Codethemen
• Verbessertes Einführungstutorial für neue Benutzer

Im Folgenden erfahren Sie mehr über diese Funktionen und Verbesserungen.

Git-Unterstützung in Dreamweaver

Dreamweaver CC, Version 2017.5, unterstützt Git, ein Open-Source-Versionskontrollsystem. Mit der neuen Git-Unterstützung können Sie nun auf einfache Weise Ihre Dateien einschließlich des Quellcodes in Dreamweaver verwalten.

Sie können jetzt gängige Git-Vorgänge in Dreamweaver ausführen, ohne dass Sie dazu Tools von Drittanbietern benötigen. Im neuen Git-Bedienfeld („Fenster“ > „Git“) können Sie diverse Git-Vorgänge ausführen, einschließlich Commit, Übertragen, Abrufen und Laden.

Sie können Git als Werkzeug für die Zusammenarbeit nutzen, indem Sie Verzweigungen und Remote-Repositorys erstellen und zusammenführen. Sie können auch die Unterschiede zwischen zwei Versionen einer Datei anzeigen sowie Datei- und Repository-Verläufe überprüfen. 

Zudem unterstützt das Bedienfeld „Dateien“ in Dreamweaver nun eine neue Git-Ansicht. In dieser Ansicht können Sie die geänderten, bereitgestellten, übernommenen und nicht verfolgten Dateien Ihrer Site verwalten. 

Weitere Informationen zum Verwenden von Git zur Versionskontrolle und Zusammenarbeit finden Sie unter Verwenden von Git in Dreamweaver.

Neue Codethemen

Dreamweaver CC 2017.5 unterstützt jetzt zwei neue Codethemen: Monaki und Classic. Sie können diese Codethemen auswählen und nutzen, die ähnliche Codefarben wie in Dreamweaver CC 2015 bereitstellen. 

Wählen Sie „Dreamweaver“ > „Voreinstellungen“ (macOS) bzw. „Bearbeiten“ > „Voreinstellungen“ > „Benutzeroberfläche“ (Windows), um die neuen Codethemen auf bessere Lesbarkeit und ein besseres optisches Erscheinungsbild zu testen.

Verbessertes Einführungstutorial

Wenn Sie Dreamweaver CC 2017.5 zum ersten Mal starten, wird im Begrüßungsbildschirm ein verbessertes Einführungstutorial angezeigt. Im neuen Einführungstutorial wird je nach ausgewähltem Arbeitsbereich eines der folgenden beiden Videotutorials angezeigt:

• Eine Kurzeinführung zum Entwickler-Arbeitsbereich
• Eine Kurzeinführung zum Standard-Arbeitsbereich

Sie können über das Menü „Hilfe“ auf die beiden Videotutorials zugreifen. Klicken Sie auf „Hilfe“ > „Kurzeinführung“, um die Tutorials anzusehen.

Weitere Verbesserungen

Dreamweaver CC 2017.5 hat jetzt eine neue Version von CEF integriert. Mit der neuen CEF-Version zeigt die Live-Ansicht in Dreamweaver benutzerdefinierte HTML-Elemente, benutzerdefinierte CSS-Eigenschaften und vieles mehr an.

Adobe Dreamweaver CC, Version 2017.1

Dreamweaver CC 2017.1 bietet mithilfe der folgenden Funktionen zusätzliche Unterstützung bei der Programmierung:

• Unterstützung für PHP 7.1
• Verbessertes Suchen und Ersetzen

Im Folgenden finden Sie einen kurzen Überblick über diese Verbesserungen.

Unterstützung für PHP 7.1

In früheren Versionen von Dreamweaver konnten Sie auf Codehinweise und Parser-Überprüfungen für PHP 5.6 zugreifen. Dreamweaver 17.1 ist für die PHP-Versionen 5.6 und 7.1 konfiguriert.

Über das Dialogfeld „Site-Definition“ oder Bearbeiten > Voreinstellungen können Sie festlegen, dass die PHP-Dateien Ihrer Site mit Version 5.6 oder 7.1 kompiliert werden sollen.

Weitere Informationen zur Unterstützung für PHP 7.1 finden Sie in den folgenden Artikeln:

• PHP-Voreinstellungen festlegen
• PHP-Codehinweise

Verbessertes Suchen und Ersetzen

In dieser Version wurden die Funktionen zum Suchen und Ersetzen deutlich verbessert. 

Sie können jetzt mit dem Dialogfeld zum Suchen und Ersetzen (Suchen > In Dateien suchen und ersetzen) nach Attributen und Tags suchen. Dieses Dialogfeld kann auch verwendet werden, wenn keine Dateien in Dreamweaver geöffnet sind (um z. B. in einem Ordner zu suchen).

Außerdem wurde die Schnellsuchleiste „Suchen und ersetzen“ (Suchen > Suchen und ersetzen) an den unteren Rand des Dreamweaver-Arbeitsbereichs verschoben. Verwenden Sie dieses Bedienfeld, um schnell Text und Attribute im aktuellen Dokument zu suchen und zu ersetzen.

Weitere Informationen zum Suchen und Ersetzen finden Sie unter Suchen und Ersetzen von Text, Tags und Attributen. Informationen zu bekannten Problemen beim Suchen und Ersetzen in Dreamweaver 17.1 finden Sie unter In Dreamweaver CC 2017-Versionen behobene bekannte Probleme und Fehler.

Neue Tastaturbefehle zum Suchen und Ersetzen:

• Im aktuellen Dokument suchen: Strg + F (Windows) bzw. Befehl + F (Mac) 
• In Dateien suchen und ersetzen: Strg + Umschalt + F (Windows) bzw. Befehl + Umschalt + F (Mac) 
• Im aktuellen Dokument ersetzen: Strg + H (Windows) bzw. Befehl + Alt + F (Mac)
  

Eine vollständige Liste der Tastaturbefehle zum Suchen und Ersetzen finden Sie unter Tastaturbefehle zum Suchen und Ersetzen.

Update für Dreamweaver CC 2017 (17.0.2)

E-Mail-Kampagnen mit Dreamweaver und Campaign erstellen

Mithilfe der Campaign-Erweiterung für Dreamweaver können Sie jetzt personalisierte E-Mail-Kampagnen erstellen. 

Personalisierte Inhalte spielen eine wichtige Rolle dabei, den Leser direkt anzusprechen und so mit E-Mail-Marketing möglichst eine höhere Erfolgsquote zu erzielen. 

Wenn Sie Vorlagen für E-Mail-Kampagnen mit Dreamweaver erstellen, haben Sie weitere Möglichkeiten, indem Sie personalisierte Inhalte (z. B. den Namen des Empfängers oder einen personalisierten Aktionsaufruf) auf Grundlage von Daten aus Adobe Campaign hinzufügen.

Laden Sie zunächst die Campaign-Erweiterung herunter, indem Sie auf Fenster > Erweiterungen > Erweiterungen durchsuchen klicken, einen E-Mail-Newsletter erstellen oder einen bestehenden Newsletter bearbeiten. Anschließend können Sie Inhalte mit Campaign-Feldern und -Inhaltsblöcken zur Personalisierung anpassen. 

Dreamweaver synchronisiert Ihre Inhalte automatisch mit Campaign, sodass Ihre Änderungen aus Dreamweaver in Campaign verfügbar sind. Sie brauchen nur eine E-Mail-Adresse einzugeben und eine personalisierte Kampagne an Ihren E-Mail-Empfänger zu senden.

Weitere Informationen finden Sie unter Erstellen personalisierter E-Mail-Kampagnen.

Update für Dreamweaver CC 2017 (17.0.1)

Integrierte Unterstützung für farbige Codehervorhebung

Sie können jetzt Codethemen auf Grundlage des hellen oder dunklen Standardthemas erstellen und anpassen. Außerdem können Sie die Codefarben anpassen, indem Sie die entsprechenden Selektoren in der Themendatei ändern.

Wählen Sie das helle oder dunkle Standardcodethema unter „Bearbeiten“ > „Voreinstellungen“ > „Benutzeroberfläche“. Wenn Sie die Codefarben ändern möchten, speichern Sie das Thema unter einem neuen Namen und bearbeiten Sie die Themendatei. 

Weitere Informationen zum Anpassen der Codefarben finden Sie unter Anpassen der Codehervorhebung.

Dreamweaver CC-Version 2017 (17.0)

Dreamweaver CC 2017 bietet Ihnen einen völlig neuen Codeeditor, eine intuitive Benutzeroberfläche mit einem frei wählbaren dunklen oder hellen Farbthema sowie verschiedene Verbesserungen, etwa die Unterstützung für neue Arbeitsabläufe wie CSS-Präprozessoren.

Im Folgenden finden Sie eine Liste der Neuerungen und Änderungen in Dreamweaver CC 2017:

Umgestalteter Codeeditor

Am Codeeditor von Dreamweaver wurden verschiedene Produktivitätsverbesserungen vorgenommen, die Ihnen ein schnelles und effizientes Programmieren ermöglichen.

Codehinweise helfen Einsteigern beim Erlernen von HTML, CSS und anderen Webstandards. Visuelle Hilfen, z. B. automatischer Einzug, farbige Codehervorhebung und skalierbare Schriften, machen den Code leichter lesbar und helfen Ihnen, Fehler zu vermeiden. 

Codehinweise

Die Codehinweise in Dreamweaver wurden verbessert und bieten jetzt hilfreichere Informationen für den ausgewählten Code.

Wenn Sie in früheren Versionen von Dreamweaver eine öffnende spitze Klammer eingegeben haben, wurde eine Dropdown-Liste mit relevantem Code angezeigt.

In dieser Version erhalten Sie nicht nur den relevanten Code, sondern auch zusätzliche Informationen, die Ihnen helfen, innerhalb von Dreamweaver schnell HTML, CSS und andere Webtechnologien zu verwenden. 

Weitere Informationen finden Sie unter Codehinweise und Codevervollständigung.

Verbesserungen der Codeanzeige

Die allgemeine Darstellung von Code wurde jetzt verbessert, um ihn übersichtlicher zu gestalten. Sie werden Verbesserungen bei der Codeformatierung und der farbigen Codehervorhebung feststellen. 

Codeformatierung

Beim Schreiben von Code wird dieser in Dreamweaver automatisch eingerückt, um falsches manuelles Einrücken zu verhindern und die Lesbarkeit zu verbessern. 

Farbige Codehervorhebung

Dreamweaver unterstützt jetzt die farbige Codehervorhebung für weitere Dateitypen.

Die farbige Codehervorhebung wird jetzt für HTML, JS, CSS, PHP, XML, LESS, Sass, SCSS, SVG, Bash, C, C#, C++, clojure, CoffeeScript, Dart, Diff, EJS, Embedded Ruby, Groovy, Handlebars, Haskell, Haxe, Java, JSON, Lua, Markdown, Markdown (GitHub), Perl, Properties, Python, RDF Turtle, Ruby, Scala, SQL, Stylus, Text, VB, VBScript, XML und YAML unterstützt. 

Sie können die Syntaxhervorhebung für unterschiedliche Dateitypen direkt über die Statusleiste in der Codeansicht ändern.

Weitere Informationen zu diesen Verbesserungen finden Sie unter Programmierumgebung in Dreamweaver.

Unterstützung von CSS-Präprozessoren

Dreamweaver unterstützt jetzt verbreitete CSS-Präprozessoren wie Sass, Less und SCSS mit farbiger Codehervorhebung und Kompilierung. So sparen Sie Zeit und erstellen leichter fehlerfreien Code.

Weitere Informationen zur Unterstützung von CSS-Präprozessoren in Dreamweaver finden Sie unter Verwenden von CSS-Präprozessoren in Dreamweaver.

Echtzeitvorschau im Browser

Sie können in Echtzeit eine Vorschau Ihrer Codeänderungen in einem Browser anzeigen, ohne die Browseranzeige manuell aktualisieren zu müssen. Dreamweaver stellt jetzt eine Verbindung mit dem Browser her, sodass Änderungen sofort und ohne erneutes Laden der Seite angezeigt werden. 

Weitere Informationen finden Sie unter Echtzeitvorschau im Browser.

Schnelle Bearbeitung zugehöriger Codedateien (Schnellbearbeitung)

Um schnell Änderungen an Ihrem Code vorzunehmen, setzen Sie den Cursor auf bestimmte Codefragmente und verwenden das Kontextmenü oder drücken Strg+E (Windows) bzw. Befehl+E (Mac), um auf die Schnellbearbeitung zuzugreifen.

Dreamweaver bietet Ihnen kontextspezifische Code-Optionen und Werkzeuge direkt im Code.

Weitere Informationen finden Sie unter Schnellbearbeitung.

Kontextabhängige CSS-Dokumentation (Schnelldokumentation)

Dreamweaver bietet eine kontextabhängige Dokumentation zu CSS-Eigenschaften direkt in der Codeansicht.

Sie müssen jetzt nicht mehr außerhalb von Dreamweaver eine Webseite mit Informationen oder einer Referenz zu bestimmten CSS-Eigenschaften öffnen. Drücken Sie einfach Strg+K (Windows) bzw. Befehl+K (Mac), um die CSS-Hilfe anzuzeigen.

Weitere Informationen finden Sie unter Über die Schnelldokumentation in Dreamweaver Hilfe zu CSS anzeigen.

Code mithilfe mehrerer Cursors schreiben und bearbeiten

Durch den Einsatz mehrerer Cursors können sie verschiedene Codezeilen gleichzeitig schreiben. 

Mit dieser Funktion arbeiten Sie sehr viel effektiver, da Sie dieselbe Codezeile nicht mehrmals schreiben müssen.

Wenn Sie mehrere Cursors verwenden möchten, gehen Sie wie folgt vor:

• Um Cursors zu mehreren, aufeinanderfolgenden Zeilen hinzuzufügen, halten Sie die Alt-Taste gedrückt und ziehen dann bei gedrückter Maustaste in vertikaler Richtung. 
• Um Cursors in mehreren, nicht zusammenhängenden Zeilen hinzuzufügen, halten Sie die Strg-Taste gedrückt und klicken auf die verschiedenen Zeilen, um dort einen Cursor zu platzieren.
• Um Text in mehreren, aufeinanderfolgenden Zeilen auszuwählen, halten Sie die Alt-Taste gedrückt und ziehen dann bei gedrückter Maustaste in diagonaler Richtung.
• Um Text in mehreren, nicht zusammenhängenden Zeilen auszuwählen, markieren Sie einen Textabschnitt, drücken die Strg-Taste (Windows) bzw. die Befehlstaste (Mac) und wählen dann weitere Textabschnitte aus. 

Weitere Informationen erhalten Sie unter Mehrere Cursors zum Hinzufügen oder Ändern von Text an mehreren Stellen verwenden.

Moderne Benutzeroberfläche

Die überarbeitete Benutzeroberfläche von Dreamweaver lässt sich intuitiver verwenden und stärker anpassen, bietet einfacheren Zugriff auf Menüs und Bedienfelder sowie eine kontextabhängige und konfigurierbare Symbolleiste, auf der nur die benötigten Werkzeuge angezeigt werden.

Für die neue Benutzeroberfläche gibt es außerdem vier Kontraststufen von hell bis dunkel, die das Lesen und Bearbeiten von Code erleichtern.

Hier zum Vergleich eine Abbildung der früheren und der neuen Benutzeroberfläche:

Änderungen an Menüs, Arbeitsbereichen und Symbolleisten

Die Menüs, Arbeitsbereiche und Symbolleisten von Dreamweaver wurden für diese Version überarbeitet. Im Folgenden erfahren Sie mehr über diese Änderungen.

Änderungen an Arbeitsbereichen

Die Benutzeroberfläche von Dreamweaver wurde optimiert und enthält standardmäßig die folgenden Arbeitsbereiche:

• Entwickler-Arbeitsbereich

Dieser Arbeitsbereich ist minimal. Standardmäßig enthält er nur die Bedienfelder, die für Entwickler, die Sites kodieren, am wichtigsten sind, z. B. die Bedienfelder „Dateien“ und „Codefragmente“.

• Standard-Arbeitsbereich 

Dieser Arbeitsbereich enthält alles, was Sie benötigen, wenn Sie mit Code- und Entwurfselementen arbeiten – z. B. die Bedienfelder „Dateien“, „CC-Bibliotheken“, „CSS Designer“, „Einfügen“, „DOM“, „Elemente“ und „Codefragmente“.

Im Folgenden finden Sie eine Zusammenfassung der Unterschiede zwischen den Arbeitsbereichen in Dreamweaver CC 2015 und Dreamweaver CC 2017.

Weitere Informationen zu Änderungen am Arbeitsbereich finden Sie unter Der Dreamweaver-Arbeitsbereich.

Änderungen an den Menüs

Wir haben selten verwendete Menüelemente aus dem Applikationsmenü entfernt. Bei anderen Menüelementen wurde die Position angepasst, um den Zugriff intuitiver zu gestalten.

Eine ausführliche Beschreibung der Änderungen am Applikationsmenü von Dreamweaver finden Sie unter Umgestaltete Menüs.

Änderungen an der Symbolleiste

Alle Ansichten verwenden jetzt dieselbe Symbolleiste. Die Symbolleiste enthält nur noch diejenigen Werkzeuge, die innerhalb der Ansicht, in der Sie arbeiten, erforderlich sind.

Sie können die Symbolleiste allerdings anpassen, sodass Sie den von Ihnen benötigten Werkzeugsatz enthält. 

Weitere Informationen finden Sie unter Überblick über die Symbolleiste.

Änderungen an der Statusleiste

Die Statusleiste zeigt jetzt hilfreiche Informationen an, wenn Sie in der Codeansicht arbeiten. 

Sie haben jetzt folgende Möglichkeiten:

• Wechseln zwischen dem Einfüge- und Überschreibmodus
• Anzeigen der Zeilen- und Spaltennummern am unteren Rand des Bildschirms. Diese Nummern zeigen an, in welcher Zeile und Spalte sich der Mauszeiger befindet
• Auswählen einer gewünschten farbigen Codehervorhebung für unterschiedliche Typen von Codedateien

Weitere Informationen finden Sie unter Überblick über die Statusleiste.

Änderungen am Bedienfeld „Codefragmente“

Das Bedienfeld „Codefragmente“ verfügt jetzt über eine übersichtlichere Darstellung und wurde überarbeitet, um das Einfügen von Codefragmenten zu vereinfachen.

In der folgenden Abbildung werden die wichtigsten Änderungen am Bedienfeld „Codefragmente“ aufgezeigt:

In früheren Versionen von Dreamweaver mussten Codefragmente mithilfe von Tastaturbefehlen eingefügt werden.

Dies war aus den folgenden Gründen keine effektive Arbeitsweise:

• Benutzer mussten sich nicht intuitive Tastaturbefehle merken
• Potenzielle Konflikte mit Tastaturbefehlen für produktspezifische Schlüsselwörter

In dieser Version von Dreamweaver können Sie zum Einfügen von Codefragmenten Auslöserkürzel verwenden.

Bei Auslöserkürzeln handelt es sich um einfache Textzeichenfolgen, die Codefragmenten zugewiesen sind. Beispielsweise können Sie für ein Codefragment, das einen mailto-Hyperlink erstellt, „mailto“ eingeben – dies ist dann das Auslöserkürzel.

Nachdem Sie ein Auslöserkürzel zugewiesen haben, können Sie den Cursor im Dokument platzieren, „mailto“ eingeben und die Tab-Taste drücken. Das entsprechende Codefragment wird dann von Dreamweaver in das Dokument eingefügt.

Weitere Informationen über das Bedienfeld „Codefragmente“ erhalten Sie unter Wiederverwenden von Code mit Codefragmenten.

Änderungen am Bedienfeld „Dateien“

Das Bedienfeld „Dateien“ wurde umgestaltet, um die Verwendung und Bedienung zu vereinfachen.

In der einfachsten Form wird im Bedienfeld „Dateien“ lediglich eine Liste der lokalen Dateien auf Ihrem Computer angezeigt. Wenn Sie das Bedienfeld „Dateien“ intensiver verwenden, zum Beispiel eine Site einrichten, Verbindungen zu Remote-Servern herstellen und das Ein- und Auschecken aktivieren, werden mehr Optionen angezeigt.

Weitere Informationen zu diesen Änderungen finden Sie unter Umgestaltetes Bedienfeld „Dateien“.

Änderungen am Begrüßungsbildschirm und Einführungstutorial

Ein neuer Startarbeitsbereich wird angezeigt, wenn Sie Dreamweaver starten oder alle Dreamweaver-Dokumente schließen. Über den Startarbeitsbereich haben Sie bequem Zugriff auf Ihre zuletzt verwendeten Dateien, Bibliotheken und Startvorlagen.

Wenn Sie die früheren Dialogfelder bevorzugen, können Sie Strg/Befehl+O drücken, um das Dialogfeld „Öffnen“ aufzurufen, oder zum Zugriff auf das Dialogfeld „Neues Dokument“ Strg/Befehl+N drücken.  

Wenn Sie sich die Neuerungen am Arbeitsbereich von Dreamweaver CC 2017 schnell aneignen möchten, können Sie sich unser Einführungstutorial ansehen. Dieses bietet einen Schnellüberblick über die Anpassungsmöglichkeiten, sodass Sie den für Sie richtigen Arbeitsbereich und passende Themenoptionen finden. 

Weitere Informationen finden Sie unter Der Dreamweaver-Arbeitsbereich.

Live-Hervorhebung beim Suchen und Ersetzen

Die neue unaufdringliche Symbolleiste „Suchen und ersetzen“ befindet sich am oberen Rand des Fensters, ohne einen Teil des Bildschirms zu blockieren.

Die Funktion „Suchen und ersetzen“ wird im Allgemeinen schneller und effizienter als in früheren Versionen von Dreamweaver ausgeführt. Während Sie im Suchbedienfeld den Suchtext eingeben, sucht Dreamweaver nach dieser Zeichenfolge und hebt alle Übereinstimmungen der Zeichenfolge im aktuellen Dokument hervor. 

Weitere Informationen finden Sie unter Suchen und Ersetzen von Text.

Verbesserungen an Creative Cloud-Bibliotheken

Alle in Creative Cloud gespeicherten Assets – z. B. Dateien in Ihren Creative Cloud-Bibliotheken, mit Desktop-Produkten erstellte Inhalte oder Projekte mit Adobe-Apps – können Sie archivieren, wiederherstellen und mit Kommentaren versehen. Sie können außerdem einen Versionsverlauf anzeigen.

Automatische Wiederherstellung von Dateien nach einem Absturz

Wenn Dreamweaver aufgrund von Systemfehlern, Stromausfall oder anderen Problemen unerwartet abstürzt, können Sie nicht gespeicherte Änderungen an den Dateien, die Sie gerade bearbeitet haben, wiederherstellen.

Weitere Informationen finden Sie unter Automatische Wiederherstellung von Dateien.