Aber woran liegt das? Mit Sicherheit nicht an Fireworks wie man mit folgendem Bild (1-3) rausfindet. Das für und wieder zu Bild 3 am Schluss kurz erläutert.

Ein bisschen Ursachenforschung für häufige Fehler z.b. Navigation:

Für Anwender die mit FW noch nicht so vertraut sind kommt am ehesten Bild 1 in Frage. Hat man endlich das Layout incl. der Segmente und Verhalten mühselig erstellt, dann nichts wie als HTML exportieren und gut, man will ja schließlich fertig werden. Genau das ist aber der Fehler. Eine kleine Mühe noch und man spart sich eine Menge Ärger am Schluss.

Was passiert nun mit Bild 1 beim Export?

Fireworks macht es einem leicht und generiert den Code so, das er funktioniert, dazu sind einige Optionen verfügbar. Nur man sollte nicht vergessen, FW exportiert nach den Vorgaben, nicht wie es am günstigsten ist!

Die Vorgaben in Bild 1 sind einfach die:

Für jede Segmentfreie Stelle muss ein Bild erzeugt werden damit das Layout auch so aussieht und die spätere Tabelle stabil ist. Dabei orientiert sich FW an den Segmenten die schon da sind. Alle freien Stellen werden eigenmächtig ausgefüllt, natürlich so das das Layout zusammenbleibt (allgemeines HTML nehmen wir hier jetzt nicht auseinander). Das bedeutet, es müssen zusätzliche Tabellenzellen und Bilder geschaffen werden. Für diesen Vorgang ist beim Export folgende Option zuständig.

Dies muss eingestellt sein wenn man so wie oben Bild 1 exportiert, ansonsten passt gar nix mehr. So exportieren bedeutet aber auch mehr Code und Bilder.

Nehmen wir Bild 2:

Bild 2 ist vom Prinzip wie Bild 1, nur es sind ein paar weniger Bilder und die fertige Tabelle (Code) ist um ein vielfaches geringer und übersichtlicher. Aber auch hier kann man es nicht als optimal bezeichnen.

Nun zu Bild 3:

Bild 3 ist am Ende vom Code her korrekt und es gibt keinerlei Probleme das irgendwas nicht passt oder die Table gar zusammenfällt wie das oft der Fall ist. Bilder werden nur die erzeugt, die auch wirklich für so eine Navigation nötig sind. Die Option "Bereiche ohne Segmente einschließen wird nicht mehr benötigt, weil es keine Bereiche ohne Segmente gibt.

Ein berechtigtes "So gehts aber nicht..." könnte es an der Stelle trotzdem geben und zwar das Verhalten der Links betreffend.

Das sind nun Kompromisse, die einzugehen jeder für sich entscheiden muss. Wenn man Bild 3 exportiert und der User mit der Maus auf einen Link zeigt, reagiert diese ja schon außerhalb vom "eigentlichen Text/Link".

Wen dies stört, der kommt nicht drumrum Bild 1 zu exportieren, ob dabei selbst der freie Raum durch Segmente ersetzt wird oder die Sache FW überlassen bleibt ist am Ende so egal wie 88. Blickt man mal selbst auf seine Gewohnheiten beim Surfen, dürfte eigentlich nicht viel dagegen sprechen Bild 3 zu erstellen. Arbeitet man mit Rollover sieht der User außerdem noch wo er klickt. Solange ein Link nicht über die halbe Seite geht ist alles in vertretbaren Rahmen und man kann diesen Kompromiss zugunsten der Ladezeit und Stabilität der ganzen Seite eingehen. Wer hier knausrig ist, ist selbst dran schuld!

Ein Test zu Bild 3 wers wissen möchte.

Diese ganze Sache hier ist natürlich auch auf das gesamte Layout anzuwenden, nicht nur für eine Navigation.

Anmerkung:

Bild 3 ist besonders von Vorteil wenn man verschachtelte Tabellen braucht (im Exportfenster auf Optionen klicken, Register Tabelle

(Abstand mit:)). Dies ist oft nötig wenn innerhalb einer Tabelle der Content länger wird als sie selbst. Haben Sie vielleicht schon gemerkt wenn Sie längeren Text geschrieben haben und mit einem mal gibts riesige Zwischenräume in der Tabelle. Das wieder ausbügeln ist mit Bild 1 nicht sehr aufregend, abgesehen davon, den exportierten Code widerum in eine verschachtelte Table einzufügen. Bild 2 würde in dem Fall auch noch gehen.

TIPP! Im Bild ganz oben sehen Sie auch noch wie man Segmente am besten benennt. Das ist zwar nicht unbedingt nötig, erspart einem aber viel Zeit wenn ein bestimmtes Bild später bearbeitet werden soll. Ein Bild mit Namen Unbenannt_1_r3_c2 usw. ist nicht gerade sehr aussagekräftig und wird Sie schon noch ärgern:)

Hinweis: In dem Tut wurden selbsterstellte Segmente erläutert die mit Hilfe der Tranformationswerkzeuge leicht geändert werden können. Bei Schaltflächen die man über den SF-Editor erstellt ist es etwas anders mit den Segmenten durch das automatische festlegen des aktiven Bereiches der Standardmäßig aktiviert ist. In dem Fall müsste dieser im Register Aktiver Bereich auf manuell gesetzt werden und dann kann man gleich dort die Segmente anpassen. Das setzt bisschen Gefühl fürs ganze vorraus, das Ergebnis ist jedoch dasselbe.

Noch was zur Ansicht:

Autor: (ar)