Um die grafische Gestaltung der Website zu definieren, ermöglicht WebSite X5 Die Verwendung einer vordefinierten Vorlage, einer eigenen Vorlage oder einer neuen Vorlage. Unabhängig von der getroffenen Wahl, können die im Fenster verfügbaren Optionen verwendet werden. Struktur der Vorlage Um die ausgewählte vordefinierte Vorlage/eigene Vorlage anzupassen oder im Falle einer neuen Vorlage, um diese von Grund auf neu zu erstellen.
Zur Erleichterung der Arbeit finden Sie im Fenster Struktur der Vorlage eine Vorschau mit einer schematischen Darstellung der Seite. Sie können die Sektion, die Sie bearbeiten wollen, aus der Liste auswählen oder in der Vorschau direkt auf die jeweiligen Bereiche der Seitenstruktur klicken, um sie auszuwählen und mit den verfügbaren Befehlen zu bearbeiten. Das Ergebnis wird jeweils sofort in der Vorschau angezeigt.
Wenn Sie ein eigenes Template erstellen wollen, müssen Sie zunächst den Menütyp definieren, also festlegen, wo und wie das Navigationsmenü auf den Seiten der Website positioniert werden soll. Folgende Alternativen stehen zur Verfügung:
|
Horizontal - Menü über dem Header
|
|
Horizontal - Menü unter dem Header
|
|
Horizontal - Menü unter dem Header
|
|
Vertikal - linksbündiges Menü
|
|
Vertikal - rechtsbündiges Menü
|
|
Nach der Auswahl des Menütyps wählen Sie den Seitenbereich, den Sie bearbeiten möchten. Eine Seite ist folgendermaßen gegliedert:
|
Seitenhintergrund: Dieser externe Bereich ist sichtbar, wenn das Fenster vom Browser größere Abmessungen hat als die Auflösung der Website selbst erlaubt.
|
|
Header-Hintergrund: Bestandteil vom Seitenhintergrund hinter dem Header.
|
|
Header: Der Header ist ein vorwiegend grafisch gestalteter Bereich, ideal für Elemente wie Überschriften, Untertitel, ein Firmenlogo, Suchfelder, Service-Menüs mit Links, beispielsweise zur Sitemap oder die Sprachauswahl.
|
|
Menü: Dies ist der feste Navigationsbereich mit den Menüpunkten der ersten Ebene, die auf jeder Seite unverändert angezeigt werden müssen. Die Position dieses Bereichs variiert natürlich je nach dem gewählten Menütyp .
|
|
Seiteninhalt: Dieser Bereich enthält den eigentlichen Inhalt der Seiten und eventuell ein Untermenü für die Navigation.
|
|
Fußzeile: Die Fußzeile ist ein ebenfalls vorwiegend grafisch gestalteter Bereich, der visuell die Seite abschließt. Im Allgemeinen enthält dieser Bereich Elemente wie Hinweise, Disclaimer, Informationen zum Urheberrecht, Steuernummer, E-Mail-Adressen usw.
|
|
Hintergrund der Fußzeile: Bestandteil vom Seitenhintergrund hinter der Fußzeile.
|
|
Wird der Header-Hintergrund oder der Hintergrund der Fußzeile Transparent eingestellt, erscheinen diese Bereiche wie der Seitenhintergrund und sehen identisch aus. Andernfalls erscheinen der Header und/oder der Fußzeile als Streifen, die über die gesamte Breite des Browserfensters verlaufen.
|
|
Für alle Seitenbereiche können die folgenden Grafische Eigenschaften festgelegt werden:
| ▪ | Farbe: Hier kann die Farbe für den Hintergrund auswählt werden. |
| ▪ | Bilddatei: Wählen Sie hier das Bild für den Hintergrund der Zelle aus. Sie können Dateien in den Formaten JPG, GIF und PNG verwenden. In den Header oder den Fußzeile können auch Flash-Animationen (.SWF) eingefügt werden. |
| ▪ | Anordnung: Hier können Sie festlegen, ob das ausgewählte Hintergrundbild wiederholt werden soll. Das Bild kann nur horizontal, nur vertikal oder in beide Richtungen wiederholt werden, bis es den zur Verfügung stehenden Platz ausfüllt. Nur im Seitenhintergrund kann ein eingefügtes Bild so angepasst werden, dass es den gesamten Hintergrund ausfüllt. In diesem Fall können jedoch möglicherweise die ursprünglichen Proportionen nicht eingehalten werden. |
| ▪ | Ausrichtung: Legen Sie hier fest, wie das Bild zur Seite ausgerichtet werden soll. |
Nur für den Seitenhintergrund steht folgende Option zur Verfügung:
| ▪ | Im Hintergrund fixiert: Bei Aktivierung dieser Option wird das Hintergrundbild fixiert, auch wenn der Seiteninhalt mit der Bildlaufleiste verschoben wird. |
|
Für einige Seitenbereiche kann auch die Größe festgelegt werden:
Für das Header, Menü und den Horizontal - Menü unter dem Header steht folgende Option zur Verfügung:
| ▪ | Breite: Breite des Bereichs in der ausgewählten Seite, angegeben in Pixeln. Für vertikale Menüs ist die Breite standardmäßig auf 960 im Bereich Header und 120 Pixel im Bereich Menü eingestellt, kann aber frei geändert werden. Für horizontale Menüs, die unterhalb oder oberhalb der Kopfzeile (Header) positioniert sind, beträgt der Wert des Breite der eingestellt wurde für denHeader und wird automatisch auch für den Menüund den Seiteninhalt und den Fußzeileverwendet. |
|
Die voreingestellte Breite wird automatisch berechnet und ist für eine Anzeige mit 1024 x 768 Pixeln optimiert.
|
Für alle Bereiche außer den Seitenhintergrund und den Seiteninhalt steht folgende Option zur Verfügung:
| ▪ | Höhe: Höhe des ausgewählten Seitenbereichs in Pixeln. |
Nur für den Seiteninhalt ist ferner folgende Option verfügbar:
| ▪ | Mindesthöhe: Mindesthöhe in Pixeln, die der Bereich auf der Seite, in den die Inhalte eingefügt werden sollen, haben muss, unabhängig von der Höhe der effektiv enthaltenen Inhalte. |
Wenn schließlich für den Menütyp die Option Horizontal - Menü unter dem Header, nur für den Bereich Menü eingestellt wurde, stehen die folgenden Optionen zur Verfügung
| ▪ | Distanz X: bestimmt, wie viele Pixel das Menü gegenüber dem Header nach rechts/links verschoben wird. |
| ▪ | Distanz Y: bestimmt, wie viele Pixel das Menü gegenüber dem Header nach unten/oben verschoben wird. |
|
Dank der verfügbaren Optionen gibt es praktisch keine Einschränkung im Hinblick auf die Festlegung der Größe und Position des horizontalen Menüs, das in die Kopfzeile (Header) eingefügt wird, und so erhält man jeweils kreative Ergebnisse.
|
|
Für einige Seitenbereiche können auch Eigenschaften der Inhalte festgelegt werden:
Für die Bereiche Seitenhintergrund, Menü und Seiteninhalt steht folgende Option zur Verfügung:
| ▪ | Ränder: Geben Sie die Breite der Ränder in Pixeln ein. Dieser Abstand ist der Freiraum zwischen dem Rand eines Bereichs und seinem Inhalt. |
Nur für die Bereiche Seitenhintergrund und Menü ist außerdem folgende Option verfügbar:
| ▪ | Ausrichtung: Definiert beim Seitenhintergrund, wie er zum Browserfenster ausgerichtet werden soll, und beim Menü, wie die Menüeinträge zur Seite ausgerichtet werden sollen. |
|
|
Die effektive Breite der Seiten entspricht der Breite des Bereichs Seiteninhalt (abhängig vom Header) abzüglich linkem und rechtem Rand.
|
|
Der Header kann mit Texten, Bildern, Flash-Animationen, Slideshows, Suchfeldern und Links vervollständigt werden. Die entsprechenden Funktionen finden Sie im Fenster Template-Gestaltung, das Sie auch mit der Schaltfläche Weiter öffnen können.
|
Praktische Anwendung:
