Aus der aktuellen Situation kann man sagen, dass die integrierten Funktionen von Dreamweaver immer umfangreicher, reichhaltiger und vollständiger sind. Hier möchte ich Ihnen einige Anwendungstipps in der Version 4.0 vorstellen.
1. Machen Sie Webseiten flexibler.
Einige Webentwickler nennen die unten vorgestellte Technik, aber ich nenne diese Technik hier dehnbar (flexible Erweiterungstechnik). Dies ist eine Technik, mit der die Größe der Webseite angepasst werden kann, wenn sich die Größe des Browserfensters des Besuchers ändert. Wenn das Fenster zu groß ist, gibt es daher keinen Leerraum, und wenn das Fenster zu klein ist, wird es nach oben und unten verschoben Die nach unten bewegende Leiste wird am Rand nicht angezeigt. Tatsächlich passen die meisten einfachen Webseiten die Seitengröße automatisch an die Größe des Browserfensters an. Wenn jedoch viele verschiedene Frames und Tabellen auf der Webseite verwendet werden, ist es schwierig, die Webseitengröße automatisch anzupassen flexibel anpassbar. Normalerweise verwenden Webdesigner eine Mischung aus Rahmen mit fester Spaltenbreite und GIF-Bildern als Intervalle zum Entwerfen von Webseiten. Auf diese Weise bleibt die Seitengröße unabhängig davon, ob sie den Internet Explorer oder den Mac verwenden, unverändert. Mit Dreamweaver 4.0 können Sie ganz einfach Webseiten entwerfen, die sich automatisch flexibel anpassen. Wie geht das?
Öffnen Sie die Webseite mit den Schaltflächen in der Objektpalette und wechseln Sie zur Layoutansicht. Zu diesem Zeitpunkt können Sie die Spaltenbreite des Textfelds sehen. In der Mitte des Felds befindet sich über jeder Spalte ein kleiner Pfeil. Wählen Sie den kleinen Pfeil über der Spalte aus, für die Sie die flexible Anzeige festlegen möchten Wählen Sie dann „Spalte flexibel anzeigen“ (Spalte automatisch strecken). (Stellen Sie die automatische Anpassung der Spaltenbreite so ein, dass sie auf eine Spalte beschränkt ist.) Zu diesem Zeitpunkt erscheint über dem Spaltenfeld eine Wellenlinie anstelle der ursprünglichen Zahl, die die Spaltenbreite angibt. Dreamweaver erstellt automatisch eine leere Bilddatei mit festem Layout. Diese leere Bilddatei wird durch zwei lange leere Tabellen über den Spalten dargestellt. Auf diese Weise wird das Layout automatisch ausgefüllt und die flexible Layouteinstellung abgeschlossen. (Wenn Sie zum ersten Mal eine leere Bilddatei hinzufügen, wird ein Dialogfeld angezeigt, in dem Sie gefragt werden, ob Sie die integrierte Bilddatei verwenden möchten. Für den besten Effekt empfehle ich, dass Sie Dreamweaver automatisch eine erstellen lassen, andernfalls tun Sie es Sie müssen keine leere Bilddatei verwenden, um das Layout zu füllen.)
2. Erstellen Sie eine personalisierte Farbpalette.
Das neue Bedienfeld „Assets“ von Dreamweaver 4.0 ist ein neues Tool, mit dem Dateien nach Dateitypen verwaltet werden können, z. B. Bilder, Vorlagen usw ., wenn Sie eine neue Website definieren (Site auswählen · Neue Site), werden alle Arten von Komponenten automatisch den entsprechenden Feldern im Asset-Bedienfeld hinzugefügt. Dieses neue Assets-Bedienfeld verfügt außerdem über ein Farbfeld im Eigenschaften-Bedienfeld, in dem alle auf Ihrer Website verwendeten Farben gespeichert werden, einschließlich Textfarben, Hintergrundfarben und Linkfarben. Dies ist eine Website-orientierte Farbpalette, die auf Benutzer zugeschnitten ist. Aktivieren Sie einfach das Assets-Bedienfeld (wählen Sie zuerst „Fenster“ und dann „Assets“ aus) und wählen Sie dann die kleine Farblaufleiste auf der linken Seite aus. Daraufhin werden verschiedene Farboptionen für Ihre Website angezeigt. Natürlich können Sie diese Farben auf bestimmte ausgewählte Texte übertragen. Selbst wenn Sie eine Farbe auswählen, werden der Hexadezimalwert der Farbe und der entsprechende dreifarbige Code (RGB) auf dem Bildschirm angezeigt. Wenn Sie die Symbolleiste Ihrer Palette verkleinern möchten, können Sie den Favoriten Ihrer Palette sogar nur bestimmte Farben hinzufügen. Markieren Sie einfach die ausgewählte Farbe, wählen Sie im Fenster eine Schaltfläche namens „Zu meinen Favoriten hinzufügen“ (die Schaltfläche unten rechts) und schon sind Sie fertig.
3. Erstellen eines Popup
-Menü-Navigationssystems Ursprünglich erforderte das Erstellen eines Popup-Menü-Navigationssystems einige JavaScript-Syntaxkenntnisse, aber wenn Sie Dreamweaver/Fireworks Studio installiert haben, ist es schnell erledigt. Starten Sie zunächst in Fireworks, wählen Sie ein Bild aus und wählen Sie dann im Dialogfeld „Popup-Menü festlegen“ die Option „Einfügen“ aus. Sie können den Namen der Elemente eingeben und auf die Schaltfläche „Plus“ klicken, um das Projekt hinzuzufügen. Im Popup-Meldungsfeld können Sie weiterhin detaillierte Einstellungen vornehmen, wie zum Beispiel den Text und die Links festlegen, die für den Artikel verwendet werden sollen. Natürlich können Sie auch Untermenüs hinzufügen und die Einstellungen für die nächste Ebene neu anordnen. Wenn Sie fertig sind, wählen Sie „Weiter“, um mit der Festlegung von Einstellungen wie Farben, Schriftarten usw. fortzufahren. Nachdem das Menü fertig ist, können Sie eine Vorschau der HTML-Syntax und des Bildes anzeigen. Wählen Sie dann Fertig stellen. Wenn sich die Maus zu diesem Zeitpunkt zum ursprünglichen Muster bewegt, wird eine Liste mit den Inhalten des Menüsystems angezeigt. Wenn Sie dann die erstellte Datei exportieren, generiert Fireworks automatisch alle HTML-, JavaScript- und Bilddateien, die Dreamweaver benötigt.
4. Verschieben Sie die Bilddatei!
Wenn Sie gleichzeitig Dreamweaver/Fireworks Studio installiert haben, werden Sie von der perfekten Kombination dieser beiden Produkte begeistert sein. Auch wenn Sie kein professioneller Grafikdesigner sind, möchten Sie dennoch einige GIF-Bilddateien ändern, um sie beim Entwerfen von Webseiten lebendiger zu gestalten. Mit Dreamweaver können Sie Animationen erstellen, ohne jemanden zu fragen! Wählen Sie im Standardfenster das Bild aus, das Sie ändern möchten, und klicken Sie dann im Eigenschafteninspektor auf die Schaltfläche „Bearbeiten“. Wenn Fireworks in Ihrer Installation von Dreamweaver enthalten ist, ist Fireworks der Standard-Bildeditor von Dreamweaver und die Bilder werden automatisch in Fireworks geladen. (Wenn Sie genau hinschauen, werden Sie feststellen, dass auf dem Fireworks-Bildschirm Text und Grafiken wie „Bearbeiten aus Dreamweaver“ angezeigt werden, was darauf hinweist, dass Sie Bilder aus Dreamweaver bearbeiten können.) Okay, wählen Sie nun das Bild aus, das in Fireworks bearbeitet werden soll, und wählen Sie „Ändern“. Animieren · Auswahl animieren. Vervollständigen Sie als Nächstes die Einstellungen im Dialogfeld „Animieren“, wählen Sie die Anzahl der Frames für die Animation, die Richtung der Animationsbewegung, die Transparenz usw. aus. Sie können auch die Symbolleiste „Bilder“ auswählen, um die Bewegungsgeschwindigkeit festzulegen, und das Bedienfeld „Objekt“ auswählen, um die Einstellungen zu ändern. Um die Datei zu exportieren, wählen Sie einfach die Symbolleiste „Optimieren“ und wählen Sie „Animiertes GIF“ als Dateityp. Nach Abschluss exportiert Fireworks das Bild automatisch mit optimierten Einstellungen, aktualisiert automatisch die GIF-Bilddatei und zeigt die aktualisierte Bilddatei in Dreamweaver an. Wählen Sie „Datei·Vorschau im Browser“, damit Sie eine Vorschau des schönen Bildes, das Sie gerade erstellt haben, im Browser anzeigen können!
5. Versehen Sie die Schaltfläche mit einem blinkenden Effekt.
In Dreamweaver können Sie ein Flash-Schaltflächenobjekt mit blinkendem Effekt erstellen, ohne über ein Flash-Programm zu verfügen. Version 4.0 verfügt über mehrere integrierte Flash-Schaltflächenobjekte, mit denen verschiedene Schaltflächenformen erstellt werden können. Wählen Sie Einfügen·Interaktive Bilder·Flash-Taste, um zu sehen, welche integrierten Tasten verfügbar sind. Sie können sogar mit der Maus auf die Schaltflächenform zeigen, die Sie im Dialogfeld verwenden möchten, und dann sehen, wie sie im Browser funktioniert. Wählen Sie mit dem Mauszeiger die Schaltflächenform aus, die Sie verwenden möchten, und geben Sie dann nacheinander Parameter wie Text, Schriftart, Farbe, Link usw. auf der Schaltfläche oder einen benutzerdefinierten Dateinamen ein. Drücken Sie OK. Als nächstes wird eine SWF-Datei generiert und automatisch auf Ihrer Webseite platziert. Klicken Sie auf die fertige Datei und Sie sehen die Eigenschaften der Datei im Eigenschafteninspektor. Wenn Sie beim Anzeigen von Dateiattributen die Dateiattributliste erweitern, wird eine Wiedergabeschaltfläche angezeigt. Nach der Auswahl können Sie den Blinkeffekt der Schaltfläche in der Vorschau anzeigen, ohne den Browser zu öffnen.
6.
Das Hinzufügen von Fließtext zu einer Webseite ist so einfach wie das Hinzufügen der Flash-Schaltfläche, die ich gerade eingeführt habe. Ebenso müssen Sie Flash nicht installieren, sondern können dies ganz einfach mit den neuen Funktionen von Dreamweaver 4.0 tun. Webseitenersteller, die häufig HTML-Syntax zum Schreiben von Webseiten verwenden und keine Erfahrung mit interaktiven Medien haben, können problemlos kompakten Fließtext in Form von Flash erstellen. Laut Macromedia können 97 % der Internetnutzer Webseiten mit Flash-Effekten anzeigen, sodass diese neue Funktion das Surfen und Leser von Webseiten etwas interaktiver gestalten kann, ohne dass es zu Kompatibilitätsproblemen kommt. Wählen Sie „Einfügen · Interaktive Bilder · Flash-Text“ und geben Sie dann nacheinander die Voreinstellungen ein (z. B. den Text, den Schriftstil, die Schriftfarbe, die Schriftgröße usw., deren Effekt Sie ändern möchten).