Für professionelle Webseitenersteller, die komplexe Webseiten in einer visuellen Umgebung erstellen möchten, hat sich Dreamweaver nach und nach auf dem Markt für Webseitenbearbeitungstools etabliert und ist für Profis zur besten Wahl zum Schreiben von Webseiten geworden. 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).
7. Tastaturkürzel ändern Dreamweaver ermöglicht es Benutzern, die Benutzeroberfläche anzupassen. Dieses Design ist sehr flexibel. Benutzer können beispielsweise das Menü ändern, indem sie Programme schreiben oder Objekte hinzufügen. Sie müssen kein Experte sein, um Tastaturkürzel zu ändern, da Dreamweaver über eine grafische Benutzeroberfläche namens Tastaturkürzel-Editor verfügt. Wählen Sie einfach „Bearbeiten · Tastaturkürzel“ und das Dialogfeld wird geladen und listet eine Liste der Tastenkombinationen auf, die geändert werden können. So können Sie den Schlüssel schnell auf den gewohnten Einstellwert umstellen. Um eine Tastenkombination zu ändern, verwenden Sie einfach die Dropdown-Menüs der Liste „Aktueller Satz“ und „Befehl“, suchen Sie unter den vorhandenen Befehlen den Befehl, den Sie ändern möchten, und wählen Sie dann die aktuelle Tastenkombination aus. Sie wird in der Liste der Schnelltasten angezeigt. in der Schlüsselliste. Wenn Sie außerdem eine Schnelltasteneinstellung hinzufügen möchten, können Sie die Plus-Schaltfläche auswählen, die neue Schnelltaste eingeben, die Sie auf der Tastatur verwenden möchten, und „Ändern“ auswählen. Gleichzeitig können Sie auch eine Tastenkombination auswählen und die Taste zum Entfernen (Minus) auswählen, um eine Tastenkombination zu entfernen.
8. Setzen Sie die Spaltenbreite des Site-Fensters zurück. Wählen Sie einfach „Ansicht·Dateiansichtsspalten“ im Site-Fenster, um die Größe und Darstellung der Spaltenbreite beim Anzeigen der Site-Ansicht anzupassen. Wählen Sie eine Spalte mit Namen aus und verwenden Sie die Aufwärts- und Abwärtspfeile, um die Größe zu ändern, oder deaktivieren Sie das Kontrollkästchen „Feld anzeigen“, um die Spalte auszublenden. Darüber hinaus können Sie durch Auswahl der Plus-Schaltfläche auch Spalten hinzufügen und eigene Spaltennamen erstellen. Darüber hinaus können Sie eine Spalte mit einer Design-Notiz verknüpfen, indem Sie eine vorhandene Notiz aus dem Dropdown-Menü auswählen.
9. Wenn Sie die O'Reilly-Code-Referenz (Fenster · Referenz) öffnen, um die Eigenschaften oder die Browserkompatibilität zu überprüfen, werden im Standardfenster die Referenzeinstellungen in kleinen Schriftarten angezeigt. Wenn Sie jedoch die rechte Taste in der oberen rechten Ecke des Fensters (direkt unter der Schaltfläche „Schließen“) drücken, wird eine Reihe von Dropdown-Menüs angezeigt, in denen Sie die Schriftgröße des Originaldokuments auswählen können (klein, bis mittel usw.). groß). . Die Wahl großer Schriftarten schont die Augen, da Sie beim Betrachten der ursprünglichen HTML-Datei keine Lupe halten müssen, um auf den Bildschirm zu schauen!
10. Fügen Sie eine neue Flash-Schaltfläche hinzu. Oben habe ich Ihnen gezeigt, wie Sie 20 voreingestellte Schaltflächentypen verwenden, um Flash-Schaltflächen in Dreamweaver zu erstellen. Für diese Methode ist keine Installation zusätzlicher Dateien oder Programme erforderlich. Im Folgenden finden Sie eine weitere Methode: Die Installation von Fireworks-Schaltflächen. Diese erweiterte Funktion hat den gleichen Effekt wie Tipp 5. Gehen Sie zu Exchange for Dreamweaver (Dreamweaver Extension Exchange Center), geben Sie das Stichwort „InstaGraphics Extensions for Dreamweaver“ ein und laden Sie dann diese 577 KB große Datei herunter. Wechseln Sie zu Dreamweaver, wählen Sie Befehle·Erweiterungen verwalten und dann Datei·Erweiterung installieren, um die Installation zu starten. Sobald Dreamweaver reaktiviert ist, gibt es sechs neuartige und interessante Schaltflächentypen, darunter Surfbrett und Bulletbar. Verwenden Sie zu diesem Zeitpunkt einfach den Befehl „Interaktive Bilder einfügen“ und „Feuerwerksschaltfläche“, um eine coole Schaltfläche zu erstellen. Sie können auch die Befehle „Aufzählungszeichen in Bilder konvertieren“ und „Text in Bilder konvertieren“ verwenden. Beide oben genannten Methoden können Fireworks automatisch ausführen.
11. Fügen Sie der Webseite die Funktion „Als Favoriten festlegen“ hinzu und suchen Sie in Exchange. Dort finden Sie die Erweiterungsfunktion „Zu Favoriten hinzufügen“. Diese kleine Datei belegt nur 3 KB und die Downloadzeit wird nicht allzu lange dauern. Befolgen Sie dann die gleichen Schritte, um sie über den Erweiterungsmanager zu laden (Befehle · Erweiterungen verwalten, Datei · Erweiterung installieren). Aktivieren Sie dann Dreamweaver erneut. Diese neu geladene Erweiterungsdatei fügt Dreamweaver eine neue Funktion hinzu. Wenn Sie diese Funktion „Zu Favoriten hinzufügen“ zu Ihrer Webseite hinzufügen, kann ein Internetnutzer, wenn er Ihre Website besucht, Ihre Website ganz einfach mit nur einem Klick zu den Favoriten seines Browsers (oder zu seinen persönlichen Lesezeichen) hinzufügen. Darüber hinaus können Sie auch den Namen der bevorzugten Verknüpfung und das kleine Symbol anpassen, das vor dem Namen der bevorzugten Verknüpfung angezeigt wird (im Allgemeinen ist das kleine Symbol vor der bevorzugten Verknüpfung im IE der Standardwert von IE. Wenn Sie Ihr eigenes kleines Symbol ist viel cooler. Beachten Sie, dass diese Funktion nur Browser mit IE 4.0 und höher unterstützt. Wählen Sie einfach das Verhaltensfeld im Windows-Menü und wählen Sie diese Option im Dropdown-Menü IE
Möchten Sie eincooles
Diagramm erstellen, müssen Sie noch Zeit damit verbringen, den Quellcode der Webseite einzutippen? Es gibt bereits ein fertiges Formular zum Herunterladen von Exchange Um ein Formular mit Feldern wie Land, Geschlecht, Familienstand, Altersgruppe und anderen Kategorien sofort zu kopieren, laden Sie diese kleine Datei (nur 11 KB) von Exchange herunter und verwenden Sie dann den Erweiterungsmanager ·Erweiterung installieren). Aktivieren Sie dann einfach Dreamweaver und wählen Sie „FormBuilder einfügen“. Nach der Auswahl werden alle anwendbaren Formatmenüs angezeigt.