phpbuddy.eu
Aktuelles
Startseite
TP Wettbewerbe
Sitemap
Service
Hilfe-Forum
Kolumnen
Linktipps
Buchrezensionen
Traum-Team
Newsletter
Traumquelle
Dreamweaver
Fireworks
Photoshop
Flash
Traum-Start
gimp
GoLive
php / Apache
Sonstige
Grundlagen
Usability
CSS
Apple / Mac
3D
Intern
TP-Sponsor
TP SHOP
Bild Galerie
TP Wallpapers
Forum-Archiv
Link zu uns
Impressum
Zurück  
TP Portal > Fireworks > FW HTML-Setup

Fireworks HTML-Setup

Einiges zur HTML-Einrichtung (File-->HTML Setup).

Diese Geschichte ist schon etwas verwirrend gerade für Fireworksneulinge, daher hier einige Erläuterungen zu diesem Thema.

Register Allgemein: tooltipp

Bei HTML-Stil wird der entsprechende Editor gewählt mit dem man arbeitet. Die Erweiterung gibt die Dateiendung an, die beim Export automatisch angefügt wird wenn nichts anderes angegeben ist. Der Dateiname sollte immer in Kleinbuchstaben angegeben werden. Viele Systeme unterscheiden zwischen Groß und Kleinschreibung (Test.html ist nicht gleich test.html). Damit geht man evtl. Konflikten aus dem Weg.

HTML-Kommentare einschließen erleichtert später das finden von Fireworks generiertem Code, dieser wird dann in entsprechende Kommentare im Quelltext eingeschlossen.

Register Tabelle: tooltipp

Abstand mit gibt an wie der Tabellenaufbau beim Export von Segmentierten Grafiken erfolgt. Die Transparenten 1 Pixel-Abstandshalter (spacer.gif) dienen zum korrekten ausrichten einer Tabelle im Browser. Gerade für Netscape kann diese Einstellung von Vorteil sein.

Verschachtelte Tabellen-Keine Abstandshalter bedeutet, die Tabellen werden in sich verschachtelt (Tabelle in Tabelle). Diese Methode ist von der Anzeige im Browser eher langsamer, dafür aber über den Code besser zu verwalten. Außerdem empfielt sich diese Einstellung, wenn Inhalt in Zellen länger wird als es in der exportierten PNG vorgesehen war. Manche kennen es vielleicht, man schreibt und schreibt in eine Zelle und plötzlich zieht es das ganze Layout auseinander. Mit verschachtelten Tabellen kriegt man dies besser in Griff durch die Top-Ausrichtung der einzelnen Tabellen. Ist aber abhängig wie man vor dem Export als HTML segmentiert, deshalb hier nur kurz erwähnt.

Einzelne Tabelle-Keine Abstandshalter bedeutet, eine einzigeTabelle und Tabellenzellen werden zwar erzeugt, jedoch leer, sofern Segmente als Typ: Textsegment festgelegt sind. Bei Editoren mit Grafischer Oberfläche wie Dreamweaver sind diese dann meißt nur über den Code auszumachen. Hier sollte bei Inhalt zumindest ein Geschütztes Leerzeichen " " angegeben werden. Außerdem wird es sicher passieren, dass das ganze Layout zusammenfällt. Besser hier mit Bildsegmenten arbeiten oder entsprechend Inhalt in Textsegmente einfügen.

Zellfarbe: Leinwandfarbe ist die Farbe der Leinwand im FW-Dokument, nicht die Hintergrundfarbe der HTML-Datei. Kein Häkchen erlaubt die Auswahl der Farbe aus dem Popupmenü Farben.

Inhalt: Der Inhalt bezieht sich auf leere Tabellenzellen (nicht segmentiert oder Textsegmenten). Er kommt zur Geltung bei deaktivierter Option "Bereiche ohne Segmente einschließen" im Register Dokumentspezifisch.

Kein Inhalt, die Zellen bleiben leer, das Layout fällt sicher zusammen.

Abstandshalter-Bild, es wird ein "leeres" Bild (spacer.gif) in der gesamten Zellengröße eingefügt, die Tabelle bleibt stabil.

Geschützes Leerzeichen, die Zelle bekommt in den Tag <td>dieses Zeichen: & nbsp;</td>, sollte man immer angeben, wenn kein Bild! Je nach Segmentierung um die "leeren Zellen", ist die Tabelle mehr oder weniger stabil.

Register Dokumentspezifisch: tooltipp

Alle Einstellungen hier beziehen sich immer auf das aktuelle Dokument. Davon ausgeschlossen sind die letzten beiden Optionen, diese gelten für alle FW-Dokumente.

Die Alternative Bildschreibung (Alt-Text) wird angezeigt wenn ein Bild nicht geladen werden kann, sollte immer angegeben werden, ist später auch über den Code per Hand noch möglich! Bereiche ohne Segmente einschließen heißt, die Leinwand in FW die keine Segmente enthält wird beim Export mit Bildern aufgefüllt.

HTML-Seiten mit mehreren Navigationsleisten: Man kann Webseiten verschieden strukturieren. Framesets sind ein beliebtes Gestaltungsmittel, aber auch nicht immer leicht zu handhaben. Ein Frameset besteht aus einer Startdatei und je nach Aufbau aus den zu ladenden HTML-Dateien in den einzelnen Frames. Ruft man die Startdatei auf werden also gleichzeitig mehrere HTML-Dateien angezeigt und eine davon enthält die Navigation. Klickt man auf einen Button/Link in der Navigation wird gewöhnlich im anderen Frame eine neue Datei angezeigt mit anderem Inhalt, ohne das die Navigationsdatei neu geladen werden muss. Für diesen Fall kann das Häkchen deaktiviert werden.

Die andere Möglichkeit Seiten zu strukturieren wäre, bei jedem Klick auf einen Link eine komplett neue Seite zu laden die wiederum die Navigation enthält. Es gibt also keine Seite nur für die Navigation oder den Inhalt, die aufzurufende Seite enthält jeweils beides. Hier kommt die Option HTML-Seiten mit mehreren Navigationsleisten zum Einsatz.

Hat man eine Seite mit FW gemacht die z.B. drei Buttons enthält, dann wird bei aktivierter Option für jeden Button eine Seite generiert. FW speichert also 3 HTML-Dateien zusätzlich. Aber... nur dann - und das ist jetzt der eigentliche Punkt- wenn bei Schaltflächen die "Down" Funktion aktiviert ist. Das heißt, der Button den man anklickt bleibt in gedrückter Form und geht nicht wieder zurück wie das der Fall wäre bei einem einfachen MouseOver. Die drei zusätzlichen HTML-Dateien enthalten also jeweils den geklickten Button in gedrückter Form.

Ist vielleicht nicht so verständlich, daher gibts hier eine PNG als Beispiel. Einfach die PNG mit FW und aktivierter Option HTML-Seiten mit mehreren Navigationsleisten exportieren. Sie sollten daraufhin vier Dateien erhalten, setup.html, setup_1.html, setup_2.html, setup_3.html. Starten Sie die setup.html und klicken einfach auf die Button, den Rest sehen Sie.

Diese Option hatte mir ne Menge Kopfzerbrechen bereitet, konnte das Anfangs nicht nachvollziehen und habs dann halt gelassen, aber jetzt.

Die Lösung hier verdanke ich einigen Lesern des Tutorials.

Dank an: Wolfgang Wagner, Ulf Maywald und den anderen deren Namen ich leider nicht mehr hab. So, endlich geändert:)

Dateinamen: Kommt zum tragen bei automatischer Vergabe von Dateinamen. Hier muss ich betonen, Vorsicht! Viele Segmente in einem Fireworksdokument erfordern eindeutige Dateinamen der einzelnen, da jedes Segment eine separate Bilddatei beim Export darstellt. Die Einstellungen hier sind sehr stark auch vom verwendeten Server/System abhängig auf dem sich der Webspace befindet, die wenigsten akzeptieren zum Beispiel Leerzeilen (ohne Unterstrich/Bindestrich). Weiterhin besteht die Gefahr beim Export die Dateien immer wieder zu überschreiben, so das letztendlich trotz 100 exportierter Dateien/Segmente nur ein Bild im Zielordner zu finden ist. Die einzelnen Möglichkeiten hier aufzählen wäre des guten zuviel.

Empfehlung: Experimentieren ja, aber die Grundkonfiguration auf jeden Fall sichern!! Eine automatische Vergabe der Dateinamen so wie sie hier eingestellt ist, ist die sicherste Methode für den Anfang.

Die Vergabe von eigenen Dateinamen für jedes Segment stellt man in folgendem Bedienfeld ein. [Abbildung 4 - Segmente selbst benennen

 

Autor: (ar)

Abbildungen

Abbildung 1 - Allgemeine Einstellungen

Abbildung 1 - Allgemeine Einstellungen

Abbildung 2 - Tabellengrundeinstellung

Abbildung 2 - Tabellengrundeinstellung

Abbildung 3 - Diese Grundkonfiguration sollte gesichert werden.

Abbildung 3 - Diese Grundkonfiguration sollte gesichert werden.

Abbildung 4 - Segmente selbst benennen

Abbildung 4 - Segmente selbst benennen

Buchrezension

Coverimage
AJAX Hacks
Dynamische Webseiten mit AJAX programmieren - dieses Handbuch bietet einen praktischen Einblick.
[mehr]
Gimahhot - Shopping


Ferienwohnungen
TP-Partner
Sprachreise London
Webmasterpro
Computerhilfen
Computerhilfen
Eventagentur Hamburg
it-rechtsinfo.de
Designguide
Getreidemühlen
sk-typo3
Kochkurs Berlin
d. Webdesigner
PSD Tutorials
Medizin

Hier könnte Ihre Werbung stehen

 >> INFO << 

\ Startseite | Forum | Impressum | nach oben | Seite zurück /