Tutorial Dreamweaver 4.0
 
Das Einbinden von Grafiken und Bildern

Grafiken werden in Dreamweaver am einfachsten über das Menü Einfügen/Bild in Webseiten eingebaut. Man kann bequem seine Wunschgrafik auf der Festplatte anwqählen. Wer noch nicht genau weiß, für welches Bild er sich entscheiden soll, kann sich anhand der Bildvorschau orientieren. Nach Anwahl von Einfügen/Bild erscheint folgender Dialog:

Beim Einfügen eines Bildes oder einer Grafik in eine Webseite erzeugt DW einen dokumentrelativen Pfad im Quellcode. Dabei ist allerdings Voraussetzung, das sich das Bild in einem Verzeichnis innerhalb der Site befindet.

Falls der Speicherort der Datei außerhalb des Startordners der Site liegt, fordert DW einen auf, das Bild in einen Ordner innerhalb der Site zu kopieren.

Dies sollte man bejahen und sich im darauffolgenden Fenster einen geeigneten Ordner aussuchen. Wenn die Webseite noch nicht gespeichert wurde, erscheint folgender Hinweis:

"Um einen dokumentrelativen Pfad zu erstellen, muß das Dokument zuerst gespeichert werden. Ein Pfad "File://" wird verwendet, bis sie ihr Dokument speichern."

Man sollte also baldmöglichst speichern - es ist unter Windows sowieso empfehlenswert, in regelmäßigen Abständen zwischenzuspeichern.
Wie die Meldung ankündigt, wird der dokumentrelative Pfad eingefügt, sobald die Webseite gespeichert wird.

Die Eigenschaften eines Bildes festlegen

Die Eigenschaften eines Bildes lassen sich am besten im Eigenschaftsfenster festlegen.


Schalter ”Bearbeiten”

Falls in den Voreinstellungen in ”Dateitypen / Editoren” ein Editor für das Bildformat angegeben wurde, startet bei Klick dieser Editor (Für das Einrichten in dem entsprechenden Fenster das Dateiformat links markieren und die Programmdatei des Editors auswählen. Evtl als Primäreditor kennzeichnen.)

Größe zurücksetzen

Falls man die Bildgröße verändert hat, und dies rückgängig machen will, ist dies der entsprechende Knopf

Ausrichten

Hier geht es darum, Text und Bild zu kombinieren.

  • Grundlinie: Richtet die Grundlinie des Textes am untersten Punkt des ausgewählten Objekts aus.
  • Oben: Hier wird der oberste Punkt des größten Zeichens in der Textzeile am obersten Punkt des ausgewählten Objekts ausgerichtet.
  • Mitte: Stellt die Grundlinie des Textes an der Mitte des ausgewählten Objekts.
  • Unten: wie Grundlinie
  • Textoberkante: Das größte Zeichen wird in der Textzeile am obersten Punkt des ausgewählten Objekts ausgerichtet - im Prinzip gleich wie unter „oben“
  • Absolut unten: Richtet die absolute Unterkante des Textes, einschließlich Unterlängen (wie bei g), am untersten Punkt des ausgewählten Objekts aus.
  • Absolut Mitte: Richtet die Mitte des ausgewählten Objekts an der Mitte des Textes aus.
  • Links: Bei dieser Option wird das ausgewählte Objekt am linken Rand platziert. Dabei läuft der Text rechts um das Objekt herum. Wenn vor dem Objekt linksbündiger Text steht, bewirkt diese Option normalerweise, dass links ausgerichtete Objekte in einer neuen Zeile erscheinen.
  • Rechts: Genau umgekehrt wie ”Links”.

ImageMaps

Name der Map Hyperlink (bei Frameset auch Zielfenster angeben)
Hotspots: Alt-Tag: Beschriftung einfügen nicht vergessen
Je nachdem, welche Formen angeklickt wurden, entsteht mittels Aufziehen ein Rechteck, ein Kreis oder ein Vieleck
Das Verschieben der ImageMap ist mit der Maus oder den Pfeiltasten möglich
ImageMap


Verhaltensweisen von Bildern

Verhaltensweisen von Bildern werden über den Verhaltensinspektor eingestellt.

Bilder vorausladen

· Bilder sind beim Laden der Seite nicht sofort sichtbar (wohl aber die, die auf diese Seite gehören), werden im Browsercache auf "Vorrat" gespeichert und bei Bedarf angefordert. Zweck: Verringerung der Ladezeit anderer Seiten.

Bilder austauschen

· Ein Bild wird durch ein anderes Bild ersetzt. Voraussetzung ist, daß die Bilder benannt worden sind!!! Im Feld “Bilder” wird die Bildquelle angegebenen, im Feld “Quelle einstellen auf” das Austauschbild. Unten kann angekreuzt werden, ob die Bilder vorausgeladen werden sollen bzw. ob bei onmouseout das alte Bild angezeigt werden soll.

Vertauschtes Bild wiederherstellen

· Nur nötig, wenn man bei “Bilder bei onmouseout wiederherstellen” das Häkchen rausgenommen hatte. Wird normalerweise automatisch an die “Bild austauschen” – Aktion angefügt.

Tracing Bilder

Sie sind ein sehr nützliches Hilfsmittel. Hiermit kann man ein Seitendesign nachbilden, das in einer Grafikanwendung erstellt wurde. Diese Grafik wird in den Hintergrund des Dokumentfensters eingebunden und kann transparent gestellt werden. Sie ist im Browser nicht zu sehen. Man stellt sie über das Menü Ansicht/Tracing-Bild/Laden ein. Mit „Zeigen“ kann man das Tracing Images sichtbar bzw. unsichtbar machen. Mit “Position einstellen” kann man die x- und y-Koordinaten festlegen und damit die Stelle, an der das Tracing Bild eingefügt werden soll.

 

 

© 2001 by http://www.webfeatures.de, Christiane Gerlach, Hannover