Bedienfelder. Bedienfeld Einfügen

Transkript

1 DER DREAMWEAVER BILDSCHIRM: Titelleiste Menüleiste Symbolleiste Bedienfelder Eigenschafteninspektor Statuszeile Bedienfeld Einfügen DAS DOKUMENTFENSTER: DER EIGENSCHAFTENINSPEKTOR: Der Eigenschafteninspektor zeigt alle Eigenschaften des aktuell markierten Objekts an. Man kann diese Eigenschaften auch hier ändern. Eigenschaftsinspektor (eines Bildes) Eigenschaftsinspektor (einer Tabelle) Seite 1 von 5

2 DIE SITE ERSTELLEN: Site/Neue Site Kategorie: Lokale Infos Sitename wählen Lokalen Stammordner eingeben (hier ist das im Explorer erstellte Verzeichnis zu wählen) http-adresse eingeben (kann vorerst noch leer gelassen werden, wenn noch keine Adresse vorhanden) Kategorie: Remote-Informationen Hier kann man die Servereinstellungen falls schon bekannt eingeben. 2 Bereiche: a) Bereich zum Erstellen des Dokuments = zum Erstellen der Webseiten = Dokumentenfenster b) Site-Bereich = zur Verwaltung der Seiten, um Dokument auf Web-Server zu stellen. NEUES DOKUMENT ERSTELLEN: Datei/Neu Seite erstellen Datei/Speichern Unter Erscheint in der Titelleiste neben dem Dateinamen ein *, so bedeutet dies, dass die vorgenommenen Änderungen noch nicht gespeichert wurden. Erscheint in der Titelleiste neben dem Dateinamen kein *, so bedeutet dies, dass die vorgenommenen Änderungen bereits gespeichert wurden. VORSCHAU IM BROWSER: Mit F12 (Browser festlegen: Bearbeiten Voreinstellungen) TABELLEN: Tabellen sind ein beliebtes Mittel für das Layouten von Webseiten und für die übersichtliche und Platz sparende Darstellung von Daten. Man kann Tabellen beispielsweise verwenden, um Aufstellungen, Pro-und-Kontra-Gegenüberstellungen oder Vergleiche darzustellen. Oftmals werden Tabellen auch verwendet, um ein stabiles Seitenlayout zu erzielen. HTML als solches ist nicht besonders layoutfähig. Tabellen sind ein guter Weg aus diesem Problem, nicht zuletzt deshalb, da sie von fast allen Browsern unterstützt werden. TABELLEN EINFÜGEN: Einfügen/Tabelle Im darauffolgenden Dialogfenster lässt sich bereits einiges vordefinieren: Seite 2 von 5

3 Zeilen: Spalten: Zellauffüllung: Zellenabstand: Prozent: Anzahl der Tabellenzeilen Anzahl der Tabellenspalten Abstand zwischen Zellinhalt und Zellwand in Pixel Anzahl der Pixel zwischen den einzelnen Tabellenzellen Maßeinheit für die Tabellenbreite Auswahl zwischen einer absoluten Angabe der Werte in Pixel und einer relativen Breite, welche als Prozentsatz des Browser-Fensters definiert wird TABELLE BEARBEITEN: Hier kommt der Eigenschafteninspektor zum Einsatz. Gewünschte Tabelle oder einzelne Zellen markieren und Änderungen vornehmen. Schriftart Textfarbe fett kursiv Textausrichtung Ungeordnete Liste 1. Geordnete Liste Texteinzug Zellen verbinden/zellen teilen Hintergrundfarbe Rahmenfarbe Zum Formatieren und Ausrichten von Tabellen verwendet man aber besser CSS!!! DATUM EINFÜGEN: Einfügen/Datum Im darauffolgenden Dialogfenster lässt sich das Datum formatieren: Seite 3 von 5

4 HORIZONTALE LINIE EINFÜGEN: Einfügen/Horizontale Linie BILD EINFÜGEN: Wichtig: vorher Ordner images in der Site erstellen und die zu verwendeten Bilder dorthin kopieren. Einfügen/Bild oder besser einfach vom Sitebereich ins Dokumentfenster ziehen Bild bearbeiten: Hier kommt wieder der Eigenschafteninspektor zum Einsatz. Bei Alt kann man einen Text eingeben, der in einem kleinen gelben Fenster erscheint, wenn der Mauszeiger über dem Bild ist oder erscheint, wenn jemand das Laden der Bilder eingeschaltet hat. Hier sollte immer etwas Aussagekräftiges stehen (zb Otto Schenk beim Interview ). Bei Hyperlink kann ein Link eingefügt werden, wenn mit dem Klick aufs Bild eine Website aufgehen soll. Wichtig ist, dass externe Links immer mit eröffnet werden müssen. Bei Ziel kann man bestimmen, ob dieser Link in einem neuen Browserfenster (_blank) aufgeht oder im gleichen Fenster (nichts hineinschreiben). ROLLOVERBILD EINFÜGEN: Einfügen/Grafikobjekte/Rollover-Bild Mittels Schaltfläche Durchsuchen Pfad von Originalbild und Rollover-Bild auswählen Event. Frage, ob Bild im Startordner gespeichert werden soll mit Ja beantworten (Im Unterorder images speichern) Wenn angeklickt, gehe zu URL: Kann mit URL oder Dateiname belegt werden. FLASH SCHALTFLÄCHE EINFÜGEN: Einfügen/Interaktive Bilder/Flash Schaltfläche Stil auswählen Schaltflächentext eingeben Schriftart wählen Hyperlink (URL oder #Ankerpunkt) angeben Seite 4 von 5

5 SONDERZEICHEN EINFÜGEN: Einfügen/Sonderzeichen -HYPERLINK EINFÜGEN: An die Stelle klicken, an der der -Hyperlink gesetzt werden soll Einfügen/ -Verknüpfung Im Feld Text den gewünschten Hyperlink-Text eingeben Im Feld die -Adresse des Empfängers eingeben. Bild für den -Hyperlink verwenden: Hier kommt wieder der Eigenschafteninspektor zum Einsatz. Im Feld Hyperlink des Eigenschafteninspektors mailto: -adresse eingeben ANKERPUNKT EINFÜGEN: An die Stelle klicken, an der der Ankerpunkt gesetzt werden soll Einfügen/Unsichtbare Tags/Benannter Ankerpunkt Name des Ankerpunkt angeben HYPERLINKS ZU ANKERN: Im Eigenschafteninspektor im Feld Hyperlink ein Rautezeichen (#) und den Ankernamen eintragen Seite 5 von 5