Einführung in Web Creator Pro 6

Transcrição

Schnellstart-Benutzeranleitung
Web Creator Pro 6 - Schnellstartanleitung
Inhaltsverzeichnis
Einführung in Web Creator Pro 6 .................................................................................................... 5
Schnellstartanleitung....................................................................................................................... 6
Öffnen einer Vorlage ................................................................................................................... 6
Ändern einer Grafik ................................................................................................................... 10
Hinzufügen eines Elements auf die Seite .................................................................................. 11
Einführung in Containerelemente ............................................................................................. 13
Einführung in das Schwimmverhalten....................................................................................... 13
Ändern des Menüs .................................................................................................................... 15
Erstellen eines Links zu einer anderen Seite ............................................................................. 15
Testen Ihrer Website in einem Browser.................................................................................... 20
Einführung in Blöcke.................................................................................................................. 20
Verwenden von Blöcken............................................................................................................ 23
Fertigstellen des Projekts .......................................................................................................... 24
2.
Metatags............................................................................................................................ 24
3.
Google Analytics ................................................................................................................ 24
Sitemap...................................................................................................................................... 24
Hochladen der Website ............................................................................................................. 25
1.
Optimieren ........................................................................................................................ 25
2.
Neu erstellen ..................................................................................................................... 25
3.
Hochladen.......................................................................................................................... 25
Detaillierte Präsentation der Oberfläche ...................................................................................... 25
Schnellzugriffsleiste ................................................................................................................... 26
Menüband ................................................................................................................................. 27
Registerkarte 'Datei' .............................................................................................................. 27
Registerkarte 'Startseite' ....................................................................................................... 29
Registerkarte 'Projekt' ........................................................................................................... 29
Registerkarte 'Seite'............................................................................................................... 30
Registerkarte 'Einfügen' ........................................................................................................ 31
Registerkarte 'Auswahl' ......................................................................................................... 33
Seite 2 / 77
Registerkarte 'Format' ........................................................................................................... 34
Registerkarte 'Web' ............................................................................................................... 34
Registerkarte 'Tools' .............................................................................................................. 35
Registerkarte 'Hilfe' ............................................................................................................... 36
Symbolleiste 'Elemente' ............................................................................................................ 36
Einfügen eines Elements ....................................................................................................... 36
Elementeigenschaften ........................................................................................................... 37
Elementhierarchie ................................................................................................................. 37
Abschnitt 'Allgemein' ............................................................................................................. 37
Abschnitt 'Layout' .................................................................................................................. 39
Abschnitt 'Sozial'.................................................................................................................... 42
Abschnitt 'Multimedia' .......................................................................................................... 43
Abschnitt 'Daten' ................................................................................................................... 44
Elementeliste ............................................................................................................................. 46
Registerkarte 'Element' ......................................................................................................... 48
Registerkarte 'Blöcke' ............................................................................................................ 49
Die Symbolleiste 'Eigenschaften' ............................................................................................... 50
Registerkarte 'Element' ......................................................................................................... 51
Registerkarte 'Optionen' ....................................................................................................... 51
Registerkarte 'Aktionen' ........................................................................................................ 51
Schaltfläche 'Rollover' ........................................................................................................... 51
Registerkarte 'Link' ................................................................................................................ 51
Registerkarte 'Position'.......................................................................................................... 52
Registerkarte 'Eigenschaften' ................................................................................................ 52
Containerelemente: Boxen und Panels ......................................................................................... 52
Container ................................................................................................................................... 52
Unterschiede zwischen Panels und Boxen ................................................................................ 52
Erstellen eines Layouts mit Containern ..................................................................................... 52
Hinzufügen von Elementen zu einem Container ....................................................................... 53
Hinzufügen eines Elements zu einem Container ................................................................... 53
Hinzufügen mehrerer Elemente zu einem Container ........................................................... 54
Box- und Paneleigenschaften .................................................................................................... 55
Seite 3 / 77
Panels ........................................................................................................................................ 55
Boxen ......................................................................................................................................... 56
Boxen ......................................................................................................................................... 56
Ausrichtungs- und Positionierungstools........................................................................................ 58
Raster......................................................................................................................................... 58
Positionierungshilfen ................................................................................................................. 59
Funktionen der Registerkarte 'Format' ..................................................................................... 59
Schwimm- und Umbruchverhalten ............................................................................................... 61
Schwimmen ............................................................................................................................... 62
Positionierungseinschränkungen .............................................................................................. 63
Optimale Nutzung des Schwimmverhaltens ............................................................................. 67
Hinzufügen eines schwimmenden Elements............................................................................. 68
Verschieben schwimmender Elemente ..................................................................................... 68
Einsatzmöglichkeiten für das Schwimmverhalten .................................................................... 69
Das Umbruchverhalten ............................................................................................................. 71
Verwenden von Gruppen .............................................................................................................. 72
Verwenden von Blöcken................................................................................................................ 74
Einführung in Blöcke.................................................................................................................. 74
Erstellen eines Blocks ................................................................................................................ 74
Wiederverwenden eines Blocks ................................................................................................ 76
Vorsichtsmaßnahmen beim Verwenden von Blöcken .............................................................. 76
Zusammenfassung:.................................................................................................................... 76
Ideale Blockgröße ...................................................................................................................... 76
Leuchtdichte und Transparenz ...................................................................................................... 77
Seite 4 / 77
Einführung in Web Creator Pro 6
Web Creator Pro 6 ist eine leistungsstarke Anwendung, die es Benutzern mit nur geringen oder
keinen Computerkenntnissen ermöglicht, schnell professionell aussehende Websites zu
erstellen. Es geht so schnell! Sie benötigen nur Minuten.
Web Creator wurde als einfaches und leistungsstarkes Tool zur Website-Erstellung konzipiert.
Web Creator ermöglicht es dem durchschnittlichen Benutzer, seiner Kreativität freien Lauf zu
lassen – ganz ohne mühsame Programmierung und umständliche Markupsprachen.
Unsere Lösung hat sich Schritt für Schritt Dank des Benutzerfeedbacks und im Streben nach
einem anregenden Benutzererlebnis weiterentwickelt. Unser Fokus auf Einfachheit wurde dabei
stets bewahrt.
Web Creator Pro 6 ist die bei weitem fortschrittlichste Version, die wir je präsentiert haben. Sie
berücksichtigt neueste technologische Innovationen – beispielsweise die schnell steigende
Anzahl an Smartphones und Benutzern mobiler Browser, die rasch wachsende Welt der sozialen
Netzwerke und die sicheren Zahlungen mit PayPal – und macht deren Implementierung zu
einem Kinderspiel. Unsere neuen Container erleichtern darüber hinaus die Anzeige und
Anordnung der verschiedenen Elemente. Unsere Optionen zum Schwimmen ermöglichen eine
mühelose Neupositionierung. Registerkarten und Faltelemente ermöglichen eine umfassende
Konfiguration.
Das Erstellen einer Website wird zum Kinderspiel. Sie können eine Website ohne Vorlage
erstellen oder eine der vielen unterstützten Vorlagen verwenden, wenn Sie ein wenig Hilfe für
Ihre ersten Schritte benötigen. Zum Onlineschalten Ihrer Website ist anschließend nur ein Klick
erforderlich.
Diese Schnellstartanleitung für Web Creator Pro 6 hilft Ihnen dabei, sich mit den Schritten zum
Ändern verschiedener Elemente, dem Erstellen von Links und dem Verwalten von Seiten
vertraut zu machen. Sie ermöglicht Ihnen das Erstellen Ihrer ersten zwei Seiten und das
Verwenden leistungsstarker Organisationstools wie dem Block, Containern und der Option
Schwimmen. Zu guter Letzt zeigen wir Ihnen, wie Sie Ihre Website optimal nutzen und online
schalten können.
Dieses Symbol wird Sie durch diese Anleitung begleiten.
Es zeigt eine neue Funktion oder eine Verbesserung von Web Creator Pro 6 an.
Seite 5 / 77
Schnellstartanleitung
Werfen wir zuerst einen Blick auf unsere virtuelle Leinwand.
Im Abschnitt Detaillierte Präsentation der Oberfläche finden Sie eine vollständige Erläuterung
aller oben genannten Vorgänge und Funktionen.
Öffnen einer Vorlage
Öffnen Sie Web Creator Pro 6, sofern noch nicht geschehen, rufen Sie die Registerkarte Datei
auf, und wählen Sie Neues Projekt aus. Ein Fenster mit detaillierten Informationen zur
Verwendung von Blöcken und Vorlagen wird angezeigt. Lesen Sie sich die Informationen darin
durch, und schließen Sie es dann. Der Assistent zur Website-Erstellung mit Vorlagen für Web
Creator Pro 6 wird gestartet.
Seite 6 / 77
Der Assistent bietet acht Vorlagen mit allen für eine vollständige Website wichtigen Elementen
sowie die Option, mit einer leeren Seite zu beginnen.
Oben im Fenster befinden sich vier Registerkarten: Stil, Seite, Themen und Farbe/Vorschau. Wir
werden uns gleich auch den anderen Registerkarten zuwenden. Jetzt konzentrieren wir uns aber
erst einmal auf diese.
Direkt unter der Registerkarte befinden sich drei Optionsfelder: Version 6, Version 5 und
Andere Versionen. Wenn Sie auf diese klicken, erhalten Sie Zugriff auf unterschiedliche
Vorlagen.
Web Creator Pro 6 verfügt über völlig neue Funktionen, die in den älteren Vorlagen nicht
berücksichtigt wurden. Wir empfehlen daher für eine optimale Nutzung der Vorlagen, die neuen
Vorlagen zu verwenden, sobald Sie sich mit den grundlegenden Konzepten der Verwendung von
Web Creator Pro 6 vertraut gemacht haben.
Aktivieren Sie wieder das Optionsfeld Version 6, und führen Sie mithilfe der Leiste rechts einen
Bildlauf nach unten aus.
Seite 7 / 77
Für unser Beispiel verwenden wir Stil 5 aus Version 6. Wählen Sie diesen Stil aus, und klicken Sie
auf die Schaltfläche Weiter, oder führen Sie alternativ einen Doppelklick auf die Vorlage aus.
Ihnen sollte jetzt die Registerkarte Seite angezeigt werden.
Oben im Fenster befinden sich einige Felder. Das Feld Seitenname zeigt den „internen“ Namen
der Seite an, d. h. den Dateinamen. Das Feld Titel rechts daneben zeigt an, was ganz oben in
einem Webbrowser angezeigt wird. Das Feld Sprache ermöglicht Ihnen das Ändern der Sprache
Ihrer Website. Standardmäßig ist dies dieselbe wie die Sprache Ihres Betriebssystems.
Seite 8 / 77
Im Hauptbereich haben Sie die Wahl zwischen einer leeren Seite und verschiedenen
Seitenlayouts.
Die Vorlagen A und B sind recht einfach und enthalten nur wenige leere Blöcke. Die Vorlagen
Startseite und Präsentation beinhalten hauptsächlich Text und eignen sich für geschäftliche
Websites. Die Vorlagen Produkt und Produkte sind detaillierter. Sie enthalten einen Grafikblock
und kombinierte Blöcke, bestehend aus Text und jeweils einem Foto. Sie eignen sich für Galerien
und Auflistungen, die eine einheitliche Strukturierung erfordern.
Der Name des Projekts und dessen Ordner auf dem Datenträger werden unten im Fenster
angezeigt. Wenn Sie den Mauszeiger über das Feld mit dem Namen des Ordners führen, wird
Ihnen der vollständige Pfad angezeigt. Dabei handelt es sich standardmäßig um den Pfad zum
Ordner Web Creator. Der Ordner Web Creator befindet sich auf Ihrer Windows-Plattform im
Ordner Eigene Dateien. Sie können diese Position jedoch auch ändern und Ihr Projekt woanders
speichern.
Wählen Sie zum Zweck dieser Demonstration die Seite Startseite aus.
Daraufhin wird die Registerkarte Thema angezeigt. Die Seite sollte leer sein. Über diese
Registerkarte lassen sich Banner oder Hintergründe zu den Seiten hinzufügen. Diese Funktionen
sind jedoch deaktiviert. Neue Optionen, wie Leuchtdichte und Transparenz, ermöglichen
erstaunliche Effekte, die zuvor nicht verfügbar waren (siehe Abschnitt Leuchtdichte und
Transparenz).
Fahren Sie mit der nächsten und letzten Registerkarte fort: Farbe/Vorschau. Auf dieser
Registerkarte können Sie die Paletten ändern. Diese enthält den Farbpool, der für all Ihre Seiten
übernommen wird. Das Feld Stil oben zeigt die allgemeine Farbgebung der Elemente Ihrer Seite
an. Sie können die Liste im Feld Stil öffnen und aus mehr als 170 Farbkombinationen auswählen.
Wir empfehlen, eine Palette auszuwählen, die sich für die von Ihnen erstellte Website-Art
eignet. Auch sollte die ausgewählte Palette die Ihrer Website zugrunde liegende Vision
widerspiegeln.
Für unser Beispiel wählen wir den Honolulu-Stil aus.
Unten werden der Dateiname der Palette und die Farben der Palette angezeigt. Beachten Sie,
dass Sie die Farben ändern können. Auch können Sie jede vorgegebene Palette speichern,
duplizieren und löschen. Verwenden Sie dazu die Schaltflächen auf der rechten Seite der
Farbliste.
Sobald Sie Ihre Auswahl getroffen haben, klicken Sie auf die Schaltfläche Fertig stellen. Ein
kleines Dialogfeld mit einer Statusanzeige wird vorübergehend angezeigt, während Ihre erste
Seite erstellt wird.
Seite 9 / 77
Ändern einer Grafik
Oben links befindet sich eine Grafik mit dem Schriftzug LOGO. Wenn Sie darauf klicken, wird ein
Auswahlrahmen angezeigt, der an einer der vier Ecken eine Größenänderung ermöglicht. Dieser
Rahmen zeigt Ihnen an, dass das Objekt im Fokus ist. Jedes Element in Web Creator Pro 6 kann
auf diese Weise bearbeitet werden.
Auf der rechten Seite der Oberfläche sollten Sie in der blauen mittigen Leiste die Worte
„LogoEdit“ sehen. Dabei handelt es sich um den Namen des Elements. Dieser Bereich zeigt
Ihnen immer an, welches Element ausgewählt wurde. Darunter befinden sich die Registerkarten
mit den Optionen zum Ändern des Elements. Wenn Sie ein Element auswählen, wird die
Registerkarte Element immer zuerst geöffnet. Im oberen Teil dieser Registerkarte befindet sich
das Feld Datei mit vier Symbolen rechts daneben. Sie erhalten Zugriff auf die Grafikbibliothek
von Web Creator Pro 6. Das zweite Symbol öffnet ein Dialogfeld, das Sie auffordert, eine
Grafikdatei auf Ihrem PC zu suchen und die Logografik zu ersetzen. Wenn Sie kein Logo zur Hand
haben, wählen Sie eines aus der Grafikbibliothek aus.
Seite 10 / 77
Unter dem Feld Datei befinden sich Optionen für das Verhalten und die Attribute der Grafik.
Standardmäßig ist das Kontrollkästen Seitenverhältnis beibehalten aktiviert. Dieses ermöglicht
es Ihnen, die Größe von Grafiken unter Beibehaltung des ursprünglichen Aussehens und der
ursprünglichen Proportionen anzupassen. Möglicherweise möchten Sie die Grafik jedoch auch
strecken. Deaktivieren Sie hierzu das Kontrollkästchen. Wenn diese Option deaktiviert ist,
werden neue Steuerelemente angezeigt, die Ihnen eine freie Änderung der Größe ermöglichen.
Hinzufügen eines Elements auf die Seite
Nehmen wir an, wir möchten neben Ihr Logo einen Slogan einfügen. Die Vorgehensweise hierzu
ist ganz einfach. Ganz links in Web Creator Pro 6 befindet sich die Symbolleiste Elemente. Diese
enthält alle Elemente, die einer Seite hinzugefügt werden können. Diese stehen somit immer zur
Verfügung. Weitere kontextabhängige Elemente befinden sich auf dem Menüband der
Registerkarte Einfügen. Über das Menüband können Sie auch auf die allgemeinen Elemente
zugreifen. Die Bibliothekselemente werden in vier Kategorien unterteilt, die einen einfachen
Zugriff ermöglichen: Grafiken, Videos, Sounds und Flash.
Wenden wir uns jetzt der Symbolleiste Elemente zu. Klicken Sie im Abschnitt Allgemein auf die
Schaltfläche Text. In der Mitte der Seite wird ein eingabebereiter, transparenter Textbereich mit
einer Einfügemarke angezeigt.
Der eingegebene Text lässt sich einfach anpassen, indem Sie ihn auswählen und über die
Registerkarte Startseite des Menübands die Schriftart, die Schriftgröße, die Schriftbreite, die
Seite 11 / 77
Ausrichtung der Schrift und deren Einzug auswählen. Sie können auch einen Link hinzufügen.
Beginnen wir mit der Schriftart Brush Script MT und einer Schriftgröße von 40 für optimale
Lesbarkeit.
Seite 12 / 77
Ganz rechts auf der Registerkarte Startseite befindet sich eine Schaltfläche zum Entfernen der
Formatierung und zum Zurücksetzen Ihres Textes auf dessen Standardeinstellungen, sofern
erforderlich.
Sie haben den Text jetzt geändert. Ändern Sie nun die Größe des Elements entsprechend den
Ausmaßen des Textes. Verwenden Sie dazu die grünen Ziehpunkte. Sie können erneut auf das
Element Text klicken, wenn Sie dessen Inhalt bearbeiten müssen.
Einführung in Containerelemente
Platzieren Sie das soeben erstellte Textelement neben das Logo, indem Sie auf
dessen Rahmen klicken und es zum Logo ziehen. Der umgebende Bereich wird grün umrahmt
dargestellt und zeigt Ihnen dadurch an, dass Sie ein Element in einen Container platzieren. Der
im Hintergrund ausgeführte Prozess fügt Ihr Textelement einem so genannten Panel hinzu.
Panels ebenso wie Boxen gehören zu einer besonderen Elementklasse, den übergeordneten
Elementen/Containern. Detaillierte Informationen hierzu finden Sie im Abschnitt
Containerelemente: Boxen und Panels.
Einführung in das Schwimmverhalten
Das Schwimmen ist eine wichtige Funktion von Web Creator Pro 6. Gemeinsam mit
Containern verwendet, kann diese Funktion die Produktivität enorm steigern. Das Schwimmen
bezieht sich auf die automatische Positionierung von Elementen auf einer Webseite und ist eng
mit CSS (Cascading Style Sheets für Webseiten) verbunden.
Wählen Sie Ihr Logo aus, und versuchen Sie, dieses ein kleines Stück nach rechts zu verschieben
(gerade nach rechts, innerhalb desselben Panels). Beachten Sie, wie es zurück in seine Position
springt. Das Textfeld können Sie verschieben, nicht jedoch das Textelement.
Die Ursache hierfür liegt im unterschiedlichen Verhalten dieser beiden Elemente. Die Option
zum Schwimmen (d. h. genauer gesagt die Optionen Schwimmen und Links in diesem Fall)
verschieben das Logo im jeweiligen Container nach oben und nach links. Das Textelement
unterliegt dieser Regel nicht, weil dieses Verhalten dafür nicht aktiviert ist.
Wählen Sie das Textelement aus, rufen Sie die Registerkarte Position auf, und aktivieren Sie im
Abschnitt Verhalten rechts neben Schwimmen das Kontrollkästchen Links. Ihr Textelement wird
nun rechts direkt neben dem Logo positioniert. Wenn Sie jetzt versuchen, das Textelement nach
rechts zu verschieben, kehrt es wieder an seine Position neben dem Logo zurück.
Seite 13 / 77
Diese Funktionalität kann die Bearbeitungszeit beträchtlich verkürzen, wenn sie richtig
eingesetzt wird. Der Abschnitt Schwimm- und Umbruchverhalten bietet weitere Informationen
zum Verwenden dieser Funktionalität und zu ihrer Beziehung zu Blöcken und Containern.
Seite 14 / 77
Ändern des Menüs
Direkt unter dem Logo befindet sich ein Menü mit den Menüoptionen Menu1, Menu2, Menu3
usw. Wählen Sie das Menü aus, indem Sie darauf klicken, und rufen Sie dann die Registerkarte
Eigenschaften unten rechts auf. Die Registerkarte führt die Überschriften des Menüs auf. Wenn
Sie auf eine Überschrift klicken, können Sie den Titel ändern. Wenn Sie den Namen
beispielsweise in „Präsentation“ ändern, wird das Untermenü Neu angezeigt. Klicken Sie darauf,
und ändern Sie den Namen in „Unsere Gesellschaft“ usw. Klicken Sie auf Menu 2, und ändern
Sie dessen Titel in „Produkte“. Erstellen Sie auch einige Untermenüs, um mit dem Erstellen von
Menüs vertraut zu werden. Für eine weitere Anpassung wird neben Visueller Stil ein
Buntstiftsymbol angezeigt, über das ein Dialogfeld mit Parametern aufgerufen werden kann. In
diesem können Sie sowohl das Hauptmenü als auch die Untermenüs ändern.
Erstellen eines Links zu einer anderen Seite
Sobald Sie den Titel des Menüs auswählen, beispielsweise Produkte, wird unter dem Textfeld
ein weiteres Feld für Links angezeigt. Wenn Sie auf das Buntstiftsymbol neben diesem Feld
klicken, wird ein Dialogfeld zum Erstellen von Links angezeigt.
Seite 15 / 77
Sie sollten eine Beschreibung eingeben, die Sie daran erinnert, auf was der jeweilige Link
verweist. Wählen Sie anschließend entsprechend Ihren Bedürfnissen eine der Linkoptionen aus.
Fahren Sie fort, indem Sie die erste Option im Abschnitt Einen Link erstellen zu auswählen:
einer neuen Seite oder einer vorhandenen Seite.
Seite 16 / 77
Die Seite Startseite ist soweit Ihre einzige Seite. Erstellen Sie jetzt eine weitere Seite, indem Sie
auf die Schaltfläche Neue Seite erstellen klicken. Sie gelangen zurück zur Registerkarte Seite,
mit der Sie angefangen haben, als Sie das Projekt erstellt haben. Ihnen werden Seiten angezeigt,
die zu Ihrem Thema passen. Fahren Sie fort, indem Sie die Seite „Produkte“ auswählen.
Bestätigen Sie die Vorgaben auf den Seiten Thema und Farbe/Vorschau, und klicken Sie auf
Fertig stellen. Sie gelangen zurück zur Seitenauswahl. Hier können Sie jetzt Ihre neu erstellte
Seite auswählen.
Seite 17 / 77
Klicken Sie auf OK. Der Name Ihrer Seite wird jetzt im Linkfeld des Dialogfelds Link angezeigt.
Seite 18 / 77
Klicken Sie auf OK. Sie gelangen zurück zum Editor.
Seite 19 / 77
Testen Ihrer Website in einem Browser
Sie haben bereits gelernt, wie Sie Elemente, Menüs, Links und Seiten einfügen und ändern. Wie
testen Sie jetzt deren Funktionstüchtigkeit?
Ganz einfach!
Rufen Sie die Registerkarte Web im Menüband auf. Im ersten Abschnitt werden die auf Ihrem
Computer installierten Browser angezeigt. Web Creator Pro 6 fügt dem Browserabschnitt
automatisch Internet Explorer, Mozilla Firefox, Google Chrome, Opera und Safari hinzu. Sie
werden aufgefordert, Ihre Arbeit zu speichern. Speichern Sie Ihre Arbeit jetzt, damit die bisher
vorgenommenen Änderungen angezeigt werden. Der Browser Ihrer Wahl wird Ihre Seite
anschließend laden.
Einführung in Blöcke
Rufen Sie die Seite Produkte über den von Ihnen im Menü erstellten Link auf. Es
wird das standardmäßige Logo angezeigt, nicht das von Ihnen ausgewählte. Sicherlich wünschen
Sie dasselbe Logo auf jeder Seite. Dies können Sie mit der Funktion Blöcke schnell und effizient
festlegen.
Erinnern Sie sich, dass unser Logo ein Teil eines Containers, genannt Panel, ist. Direkt über der
Symbolleiste Eigenschaften ganz rechts auf der Oberfläche befindet sich die Elementeliste.
Diese Liste zeigt in einer Strukturansicht jedes Element einer Seite und dessen Beziehung zu
anderen Elementen sowie die Reihenfolge an, in der die Elemente erstellt wurden. Ändern Sie
die Größe des Bereichs, bis Sie die ersten fünf Elemente wie folgt deutlich sehen können:
Seite 20 / 77
Oben sehen Sie das erste Panel namens „PanelHeader“, das das Logo, den Slogan und eine
weitere Grafik enthält. Direkt unter diesem Panel befindet sich ein weiteres namens
„PanelMenu“, das nur das Menü enthält.
Klicken Sie auf das Panel „PanelHeader“, um es wie oben dargestellt zu markieren. Beachten Sie,
dass dadurch auch das Element auf der Seite ausgewählt wird. Wenn Sie ein Panel mit
untergeordneten Elementen auswählen, werden diese ebenfalls ausgewählt, auch wenn dies für
Sie nicht sichtbar ist.
Klicken Sie über der Elementeliste auf die Registerkarte Blöcke. Eine Liste vorkonfigurierter
Blöcke wird angezeigt. Sie können diese auf Ihre Seite ziehen und dieser so im Handumdrehen
neue Inhalte hinzufügen. Rufen Sie jetzt die Registerkarte Benutzerdefiniert auf. Diese ist noch
leer.
Seite 21 / 77
Das werden wir jetzt ändern. Klicken Sie bei weiterhin ausgewähltem Panel in Ihrem Editor auf
das Plussymbol (+). Es wird ein neuer Block namens Item 1 erstellt. Ein Vorschaubild mit dem
Inhalt Ihres Blocks wird erstellt. Dieses enthält folgende Elemente: Das Panel, das Logo, den Text
und die Grafik.
Seite 22 / 77
Verwenden von Blöcken
Öffnen Sie im Menüband die Registerkarte Seite. Klicken Sie im Abschnitt Seiten auf das Symbol
Manager. Ein Fenster mit den zwei von Ihnen erstellten Seiten wird geöffnet. Rechts werden
einige Symbole angezeigt. Über das Symbol X können Sie Seiten löschen. Das zweite Symbol
benennt Seiten um. Das dritte Symbol dupliziert Seiten. Wir werden das erste Symbol
verwenden, das Seiten erstellt (das Erstellen einer neuen Seite kann auch über die in der
Symbolleiste Elemente links aufgeführte Schaltfläche zum Erstellen einer Seite erfolgen). Sobald
der Assistent angezeigt wird, behalten Sie die standardmäßige Auswahl der leeren Seite bei, und
klicken Sie auf die Schaltfläche Fertig stellen.
Wählen Sie bei weiterhin geöffnetem Bereich Blöcke im Abschnitt Manager das Element Item1
aus, und klicken Sie auf Zur Seite hinzufügen. Der Block wird automatisch oben links auf der
Seite positioniert. Bei der Seite selbst handelt es sich um einen Container der höchsten Stufe,
und für das eingefügte Panel ist das Verhalten Schwimmen aktiviert, wodurch es seine Position
automatisch findet.
Speichern Sie Ihr Projekt, indem Sie auf das Diskettensymbol in der Schnellzugriffsleiste oben
links auf der Oberfläche klicken. Die Schnellzugriffsleiste enthält auch die zum Testen
verwendete Browserliste und das Symbol zum Rückgängigmachen einer Aktion.
Seite 23 / 77
Fertigstellen des Projekts
Wenn Sie alle Seiten erstellt haben, empfiehlt es sich, zu überprüfen, ob Ihre Website bei
Suchvorgängen einfach gefunden werden kann. Web Creator Pro 6 verfügt über verschiedene
Tools, die Sie dabei unterstützen.
1. Hierzu bieten sich beispielsweise die Kopfzeilentags H1 bis H6 an, die Sie beim Erstellen
der Website festlegen können. Diese stehen Ihnen in der Symbolleiste Elemente im
Layoutabschnitt zur Verfügung. Sie können wie jedes andere Element in der
Symbolleiste Eigenschaften sowie auf der Registerkarte Web im Abschnitt
Referenzierung angepasst werden.
Im Bereich Referenzierung der Registerkarte Web stehen drei weitere Tools zur Verfügung:
2. Metatags: Die hier vorgenommenen Einstellungen werden nicht auf Ihrer Seite
angezeigt, sondern im Code Ihre Seite/Website gespeichert. Dies sind auch
Suchmaschinenoptimierungstags.
3. Google Analytics: Dies ist ein Google Tool, das ebenfalls tagbasiert arbeitet. Web
Creator kann diese Tags für Sie generieren.
Sitemap: Die generierten Informationen basieren auf der Struktur und vorhergesagten
Aktualisierungszeitplänen, die Suchmaschinen von Ihrer Website abrufen.
Weitere Informationen hierzu finden Sie im Abschnitt zur Registerkarte Web.
Seite 24 / 77
Hochladen der Website
Der Abschnitt Webausgabe der Registerkarte Web enthält drei nützliche Tools zum Vorbereiten
des Hochladens Ihrer Website auf den Server.
1. Optimieren: Dieses Tool durchsucht alle Dateien Ihrer Website und erstellt eine Liste
mit Seiten, die nicht funktionstüchtige Links, nicht verwendete Elemente usw.
enthalten. Sie können anschließend entscheiden, ob Sie diese Dateien beibehalten oder
entfernen möchten. Gehen Sie hierbei mit Bedacht vor, denn einige Seiten müssen
möglicherweise lediglich repariert werden und sind nicht ohne Funktion. Sie möchten
sicherlich nicht alle angezeigten Seiten löschen. Bedenken Sie, dass es besser ist, eine
nicht erforderliche Seite beizubehalten, als eine erforderliche Seite aus Versehen zu
löschen.
2. Neu erstellen: Ihre gesamte Website wird nach Ausführen einer Optimierung bereinigt.
Wenn Sie auf diese Option klicken, brauchen Sie sich nur noch entspannt zurücklehnen,
während Ihre Website perfektioniert wird.
3. Hochladen: Ihre Seite wird in das World Wide Web hochgeladen. Sie müssen die
Hostadresse, den Anmeldenamen und das Kennwort eingeben.
Als nützlich hat sich hierbei die Möglichkeit erwiesen, einen Filter festzulegen, der nur
Dateien hochlädt, die ab einem bestimmten Datum geändert wurden. Dies kann den
Hochladevorgang auch bei einer sehr schnellen Internetverbindung noch enorm
beschleunigen, da nur relevante neue Dateien auf den Server geladen werden. Dies ist
ein sehr schlankes Tool im Vergleich zu unserer funktionsreichen
Websiteuploadsoftware FTP Site Manager, die in einer Windows Explorer-ähnlichen
Ansicht den aktuellen Inhalt Ihres Servers anzeigt. FTP Site Manager ermöglicht auch
Drag & Drop-Vorgänge und ist direkt in die Web Creator-Oberfläche integriert.
Detaillierte Präsentation der Oberfläche
Betrachten wir uns die Hauptkomponenten von Web Creator Pro 6 etwas genauer. Um diesen
Abschnitt möglichst kurz und prägnant zu halten, werden wir die eher einfachen Elemente wie
Grafik-, Text- oder Schaltflächenelemente auslassen. Diese sind so benutzerfreundlich, dass Sie
sie nahezu sofort beherrschen werden.
Seite 25 / 77
Wenn Sie bereits mit den neueren Microsoft Office-Versionen gearbeitet haben, werden Sie sich
in Web Creator Pro 6 zu Hause fühlen, da die Anordnung hier vergleichbar ist.
Schnellzugriffsleiste
Die Schnellzugriffsleiste oben links gruppiert häufiger verwendete Funktionen:
Speichern, Rückgängig, Projektseite Seitenliste und verschiedene verfügbare Browser (von links
nach rechts).
Das Symbol Seitenliste ermöglicht es Ihnen, eine andere in der angezeigten Liste enthaltene
Seite mit nur einem Klick zu öffnen.
Die auf Ihrem Computer installierten Browser werden auf der rechten Seite der
Schnellzugriffsliste angezeigt. Web Creator Pro 6 fügt dieser Liste automatisch Explorer, Mozilla
Firefox, Google Chrome, Opera und Safari hinzu, sodass Sie Ihre Webseite schnell in einem
ausgewählten Browser testen können. Wenn Sie einen nicht aufgeführten Browser verwenden,
können Sie diesen manuell hinzufügen, indem Sie im Menüband Web > Browser > Hinzufügen
auswählen.
Seite 26 / 77
Menüband
Das immer verfügbare Menüband befindet sich oben, direkt unter der
Schnellzugriffsleiste. Das Menüband ersetzt das ursprüngliche Menü. Auf ganzer Länge des
Menübands werden Ihnen viele Optionen zur Verfügung gestellt. Die Optionen sind thematisch
gruppiert und grafisch sowie mit Text dargestellt, um Ihnen die Navigation im Menü zu
erleichtern.
Wenn Sie die neueren Microsoft Office-Versionen noch nicht kennen, werden Sie sich erst ein
wenig an diese Menüstruktur gewöhnen müssen, aber sobald Sie damit anfangen zu arbeiten,
werden Sie merken, wie mühelos deren Verwendung ist.
Ganz rechts finden Sie vier Schaltflächen. Die Schaltfläche ganz links reduziert das Menüband,
um mehr Platz zu schaffen. Sobald Sie das Menüband reduzieren, wird der zuvor nach oben
gerichtete Pfeil als nach unten gerichteter Pfeil angezeigt.
Die anderen drei Schaltflächen beziehen sich auf das Projekt. Die zweite versetzt das Projekt in
einen Fenstermodus. Die dritte schließt das Projekt und fordert Sie auf, es erforderlichenfalls zu
speichern.
Wenden wir uns nun den verschiedenen Registerkarten im Menüband zu.
Registerkarte 'Datei'
Hier befinden sich Optionen, die Sie bei der Verwaltung des Projekts unterstützen: Öffnen,
Neues Projekt, Schließen, Speichern, Speichern unter, Drucken und Beenden.
Seite 27 / 77
Die Option Öffnen gibt ihnen zwei Möglichkeiten, fortzufahren.
Die erste Möglichkeit besteht im Laden eines vor kurzem geöffneten Projekts über die
Registerkarte Aktuell. Hinweis: Diese Liste wird erst nach dem Schließen von Web Creator Pro 6
aktualisiert.
Die zweite Möglichkeit zum Öffnen von Projekten bietet die Registerkarte Durchsuchen. Diese
zeigt eine Ordnerstruktur an. Der Web Creator-Projektordner ist der Standardordner:
C:/Dokumente und Einstellungen/Benutzername/Eigene Dateien/Web Creator.
Seite 28 / 77
Registerkarte 'Startseite'
Dies ist die Registerkarte, die Sie am häufigsten verwenden werden.
Sie enthält die Bearbeitungsfunktionen Abbrechen, Ausschneiden, Kopieren, Einfügen,
Auswählen und Löschen.
Die anderen Funktionen steuern die Schriftart, die Seitenformatierung, die Ausrichtung,
Aufzählungen sowie numerische Auflistungen, Einzüge und die Verwaltung von Links. Die letzte
Funktion entfernt die Textformatierung vollständig und setzt den Text auf nicht bearbeiteten
Nur-Text zurück.
Registerkarte 'Projekt'
Über diese Registerkarte wird das Projekt insgesamt verwaltet.
Seite 29 / 77
Der erste Abschnitt, Browserausrichtung, ermöglicht das Festlegen der Bereiche des
Browserfensters, in denen Ihre Website angezeigt wird. Sie können die Position Ihrer Seite mit
den Optionen Links, Rechts und Mitte festlegen.
Der Abschnitt Startseite definiert die erste Seite, die Besuchern Ihrer Website angezeigt wird.
Registerkarte 'Seite'
Über diese Registerkarte wird die aktuell bearbeitete Seite verwaltet.
Der erste Abschnitt, Seiten, ermöglicht es Ihnen, zwischen Seiten zu wechseln, indem Sie
entweder eine neue Seite erstellen oder zu einer anderen bereits erstellten Seite wechseln.
Das dritte Symbol, Manager, öffnet eine Liste der innerhalb des Projekts verfügbaren Seiten mit
der Möglichkeit, die Seitenvorschau ein- oder auszublenden und verschiedene Vorgänge
auszuführen, wie das Wechseln der Seite, das Umbenennen, das Löschen, das Duplizieren oder
das Erstellen einer Seite.
Der Abschnitt Aktuell enthält das Symbol Eigenschaften, über das Sie die mit der aktuellen Seite
verknüpften Optionen über die Symbolleiste Eigenschaften ändern können. Diese Funktion ist
hilfreich, wenn Ihre Seite Elemente enthält, die den Hintergrund verdecken und den Zugriff auf
die Eigenschaften erschweren.
Die Funktion Aktualisieren aktualisiert die Seite und deren Elemente aus dem Speicher. Die
Option Erneut laden hingegen sucht nach Elementen auf Ihrer Festplatte, mit denen Ihre Seite
erneut geladen werden kann, weshalb Web Creator Sie auffordert, die Seite zuvor zu speichern.
Diese Tools sind sehr nützlich, um verirrte Elemente zu entfernen, die nach mehreren
Bearbeitungsvorgängen auf der geöffneten Seite und auf langsameren Computern
möglicherweise angezeigt werden.
Die Option Geräteerkennung ermöglicht es Ihnen, auszuwählen, wie die Seite auf einem
Mobilgerät angezeigt wird. Möglicherweise müssen Sie hierzu vorab eine mobile Version der
entsprechenden Seite erstellen und diese Version als bevorzugte Anzeigeoption für Mobilgeräte
auswählen.
Seite 30 / 77
Das Einrichten eines Kennworts verhindert, dass unberechtigte Benutzer in der Testphase auf
diese Seite zugreifen.
Der Abschnitt Farben ermöglicht es Ihnen, die aktuelle Farbpalette zu ändern, indem Sie in der
bereitgestellten Liste eine neue auswählen. Elemente, die Farben der Palette verwenden,
ändern ihre Farbe anschließend entsprechend Ihrer Auswahl.
Die Schaltfläche Farben konfigurieren ermöglicht es Ihnen, Farbelemente der auf dieser Seite
verwendeten Vorlage zu ändern.
Registerkarte 'Einfügen'
Diese Registerkarte gruppiert alle verfügbaren Web Creator-Elemente.
Seite 31 / 77
Der Abschnitt Allgemein enthält dieselben Elemente wie die Symbolleiste Elemente und ist auch
genauso wie diese kategorisiert.
Der Abschnitt Bibliothek ermöglicht Ihnen das bequeme Auswählen von in Web Creator Pro 6
bereitgestellten Multimediadateien aus vier Kategorien: Grafiken, Videos, Sounds und Flash.
Seite 32 / 77
Registerkarte 'Auswahl'
Die auf dieser Registerkarte bereitgestellten Funktionen beziehen sich auf Elemente, die auf der
Seite ausgewählt sind.
Die Abschnitte Aktionen und Z-Ordnung sind recht einfach zu verwenden. Der Abschnitt Links
wurde bereits besprochen.
Der Abschnitt Gruppe stellt Funktionen bereit, mit denen Sie Elemente zu einer Gruppe
hinzufügen oder aus einer Gruppe entfernen können. Sie können auch eine ganz neue Gruppe
erstellen, der Elemente hinzugefügt werden.
Seite 33 / 77
Der Abschnitt Übergeordnetes Element ermöglicht es Ihnen, ausgewählte Elemente in ein
Containerelement zu übertragen, das auf der Seite verfügbar ist. Sie können auch ein Element
vom Typ Container (Panel oder Box) erstellen. Detaillierte Informationen zu Containern finden
Sie im Abschnitt Containerelemente: Boxen und Panels.
Registerkarte 'Format'
Diese Registerkarte stellt Ihnen zahlreiche Optionen zum Ausrichten eines oder mehrerer
Elemente bereit und ist eng mit dem Konzept Übergeordnetes Element/Container (Boxen,
Panels oder Seite) verbunden, was das Verhalten betrifft.
Detaillierte Informationen hierzu finden Sie im Abschnitt zur Ausrichtung und Positionierung.
Registerkarte 'Web'
Diese Registerkarte enthält alle Funktionen zum Fertigstellen und Hochladen Ihrer Website.
Der erste Abschnitt, Browser, zeigt die auf Ihrem Computer installierten Browser an. Dieser
Abschnitt ermöglicht Ihnen die Anzeige Ihrer Website aus Benutzersicht.
Die Symbole ganz rechts in diesem Abschnitt ermöglichen es Ihnen, einen Verweis zu einem
Browser, der zwar auf Ihrem Computer installiert ist, aber nicht von Web Creator Pro 6 erkannt
wurde, hinzuzufügen, zu entfernen oder zu ändern.
Im Abschnitt Seite ermöglicht es Ihnen die Option Benutzerdefinierter Code, Javascript oder
HTML-Code über einen Texteditor zur aktuellen Webseite hinzuzufügen.
Die Option Seitenumfang berechnet, wie jedes einzelne Element auf Ihrer Webseite sich auf die
Ladezeit Ihrer Seite auswirkt, und informiert Sie, wie lange ein Benutzer mit einer 256 KBit/sVerbindung zum Herunterladen und Anzeigen Ihrer Seite benötigt.
Im Abschnitt Referenzierung werden vier Tools zur Verfügung gestellt, die Ihnen dabei helfen,
Ihre Website bei Suchmaschinenergebnissen möglichst weit vorne zu positionieren.
Seite 34 / 77
Über die Option Metatags können Sie Suchmaschinen Beschreibungen und Schlüsselwörter
bereitstellen. Sie können die Tags selbst erstellen oder die Informationen einfach in Web
Creator eingeben, damit Web Creator die Tags für Sie erstellt.
Das Symbol Kopfzeilen ermöglicht Ihnen das Festlegen von wichtigen Informationen für
Suchmaschinen. Sie können diese über das Menüband oder die Symbolleiste Elemente
einfügen. Weitere Informationen hierzu finden Sie unter Abschnitt 'Layout'.
Wenn Sie auf Google Analytics klicken, können Sie Schlüsselwörter für die
Schlüsselwortsuchmaschine von Google definieren.
Im Abschnitt Webausgabe führen Sie die finalen Schritte zum Hochladen Ihrer Website aus.
Wenn Sie auf Optimieren klicken, wir Ihre gesamte Website nach Komponenten durchsucht, die
nicht mehr verwendet werden. Wenn Sie auf Neu erstellen klicken, wird Ihre Website bereinigt
wiederhergestellt. Wenn Sie auf Hochladen klicken, wird Ihre Website auf den Server
übertragen, der Ihre Website dem Internet bereitstellt. Sie müssen Web Creator Pro 6 hierzu die
für das Herstellen einer Verbindung zum Server und zum Übertragen Ihrer Dateien
erforderlichen Anmeldeinformationen bereitstellen. Beachten Sie, dass die eingegebenen
Anmeldeinformationen mit dem geladenen Projekt verknüpft werden. Dies erleichtert die Arbeit
mit Projekten auf mehreren Servern.
Registerkarte 'Tools'
Diese Registerkarte gibt Ihnen Zugriff auf zusätzliche Ressourcen von Web Creator Pro 6.
Der erste Abschnitt enthält Ressourcen von LMSOFT.
Der zweite Abschnitt enthält Programme zur Überprüfung der Rechtschreibung und Grammatik
von Druid Informatique
Der Abschnitt Raster stellt eine Methode zur vereinfachten Positionierung der Elemente auf der
Seite zur Verfügung.
Der Abschnitt Symbolleisten ermöglicht Ihnen das Aus- und Einblenden der Elementeleiste links.
Diese Funktion ist nützlich, wenn Sie bereits viele Elemente positioniert haben, die Sie auf der
Seite benötigen, und mehr Platz für Ihre Arbeit benötigen. Das Symbol Auf Standard
zurücksetzen setzt Ihre Web Creator Pro 6-Oberfläche auf die werkseitigen Einstellungen
zurück.
Seite 35 / 77
Registerkarte 'Hilfe'
Die Funktionen auf dieser Registerkarte sind recht einfach. Beachten Sie, dass für die meisten
dieser Funktionen eine Internetverbindung erforderlich ist.
Symbolleiste 'Elemente'
Diese Symbolleiste ermöglicht Ihnen den Zugriff auf die wichtigsten Web CreatorElemente zum Erstellen Ihrer Website. Wir nennen diese Symbolleiste Elemente, weil hier
Grundpfeiler jeder Seite bereitgestellt werden. Einige zeigen Informationen an, andere erfassen
Informationen, und alle können angepasst werden.
Die Symbolleiste Elemente teilt sich in fünf übersichtliche Abschnitte auf: Allgemein, Layout,
Sozial, Multimedia und Daten.
Jeder Abschnitt kann mit den Pfeilen rechts neben der Abschnittsbezeichnung reduziert bzw.
erweitert werden. Eine Bildlaufleiste steht zur Verfügung, wenn die unteren Elemente verdeckt
sind oder Ihre Bildschirmauflösung zu gering ist.
Einfügen eines Elements
Klicken Sie zum Einfügen eines Elements auf Ihre aktuelle Seite einfach auf das entsprechende
Symbol bzw. den entsprechenden Namen. Das Element wird anschließend in der Mitte der Seite
auf oberster Ebene angezeigt.
Um Fehler zu vermeiden, werden Elemente immer so auf die Seite eingefügt, dass sie
ausgewählte Seitenelemente nicht beeinträchtigen. Vorgänge zum Gruppieren oder
Überordnen von Elementen werden erst ausgeführt, wenn Sie diese auswählen. Die folgenden
Abschnitte bieten Ihnen weitere Informationen zu Elementen: Containerelemente: Boxen und
Panels, Verwenden von Blöcken, Verwenden von Gruppen.
Seite 36 / 77
Elementeigenschaften
Wenn Sie der Seite ein Element hinzufügen, öffnet die Symbolleiste Eigenschaften die
Registerkarte Element, damit Sie das Element sofort anpassen können.
Jedes Element, das Sie der Seite hinzufügen, kann in Bezug auf Farbe, Form und Abmessungen
angepasst werden. Einige weisen auch weitergehende Funktionen auf, wie die Elemente PayPal,
Blog und Formular.
Die Symbolleiste Eigenschaften rechts auf der Oberfläche ermöglicht den Zugriff auf all diese
Einstellungen. Weitere Informationen finden Sie im Abschnitt Symbolleiste 'Eigenschaften'.
Elementhierarchie
Es wurde bereits erläutert, wie jedes Element bei seiner Erstellung unabhängig von allen
anderen Elementen (mit Ausnahme der Seite natürlich, da es Teil der Seite ist) in die Mitte der
Seite positioniert wird. Wenn Sie der Seite Elemente hinzufügen, werden diese in einer
hierarchischen Reihenfolge nach Erstellungsdatum sortiert. Anschließend können diese
Elemente geändert werden, indem Container, Blöcke und Gruppen verwendet werden.
Die hierarchische Beziehung zwischen den Elementen wird in der Elementeliste angezeigt, die
im Abschnitt Elementeliste behandelt wird.
Wenden wir uns jetzt den verschiedenen Abschnitten der Symbolleiste Elemente und deren
Funktionen zu. Einige der Elemente sind selbsterläuternd und müssen daher hier nicht
ausführlich besprochen werden. Wir werden jedoch sicherstellen, dass Sie nach der Lektüre
dieser Anleitung die Funktionsweise aller Elemente kennen.
Abschnitt 'Allgemein'
Textelement
Sobald Sie das Textelement einfügen, können Sie sofort damit beginnen, Text einzugeben, das
Design zu ändern und teilweise oder vollständige Textlinks hinzuzufügen usw. (Schaltfläche Link
im Menüband der Registerkarte Startseite).
Hyperlinks können ganz einfach über die Schaltfläche Link im Menüband konfiguriert werden.
Die Transparenz und Leuchtdichte des Hintergrunds kann auf den Text angewendet werden.
Hierzu stehen attraktive visuelle Schichteffekte zur Verfügung (Symbolleiste Eigenschaften >
Registerkarte Element > Hintergrundfarbe).
Seite 37 / 77
Grafikelement
Wenn Sie eine Grafik einfügen, wird ein Rechteck mit einer Platzhaltergrafik erstellt. Diese
Platzhaltergrafik können Sie einfach durch eine Grafik Ihrer Wahl ersetzen, indem Sie in der
Symbolleiste Eigenschaften die Registerkarte Element sowie eines der vier neben dem Textfeld
bereitgestellten Symbole verwenden. Das erste Symbol ermöglicht Ihnen den Zugriff auf
Grafiken der WC6-Bibliothek. Das zweite Symbol ermöglicht es Ihnen, Ihren Computer nach
einer Grafik zu durchsuchen. Das dritte Symbol ermöglicht es Ihnen, eine auf einer Website
vorhandene Grafik zu verknüpfen (hierzu müssen Sie den vollständigen Pfad der Grafik kennen).
Das Erweitern der Grafik, sobald darauf geklickt wird, ist eine sehr nützliche und
platzsparende Funktion. Wenn Sie eine sehr große Grafik auf Ihrer Seite positionieren möchten,
können Sie diese einfach verkleinern, sodass sie bequem auf Ihre Seite passt, und Ihren
Besuchern die Möglichkeit geben, die Grafik in voller Größe anzuzeigen, wenn Sie darauf klicken
(Sie können auch auswählen, wie groß die Grafik angezeigt wird).
Seite 38 / 77
Schaltflächenelement
Wenn Sie eine Schaltfläche einfügen, können Sie auf diese doppelklicken, um den angezeigten
Text zu ändern. Sie können hierzu aber auch das Textfeld in der Symbolleiste Eigenschaften
verwenden. Auf der Registerkarte Element können Sie die Anzeige der Schaltfläche je nach
Aktion (Erhaben, Gedrückt und Rollover) ändern. Unten wird eine Vorschau angezeigt.
Menülelement
Wenn Sie ein Menü hinzufügen, wird ein quadratisches Symbol angezeigt, das für ein Menü
steht. Rufen Sie zum Befüllen Ihres Menüs die Symbolleiste Eigenschaften auf, rufen Sie den
Bereich Elemente auf, und klicken Sie auf Hinzufügen. Der Fokus wechselt zum Textfeld, in das
Sie den Titel für diesen Abschnitt eingeben können. Sie können auf dieselbe Weise Untermenüs
hinzufügen. Mithilfe der Felder unter dem Titelfeld können Sie Links hinzufügen.
Abschnitt 'Layout'
Panel- und Boxelemente
Seite 39 / 77
Panel- und Boxelemente haben das folgende Ziel: Container. Sie sind so konzipiert,
dass sie alle anderen Elemente aufnehmen, sogar andere Container.
Ein Containerobjekt ist ein übergeordnetes Element: Wenn andere Elemente einem Container
hinzugefügt werden, werden diese anderen Elemente dessen untergeordnete Elemente. Diese
Beziehung wirkt sich entscheidend auf das Verhalten aus, denn sobald das übergeordnete
Element verschoben wird, werden auch die untergeordneten Elemente verschoben. Dies trifft
auch auf Löschvorgänge zu. Wenn Sie ein Panel mit Schaltflächen darin löschen, gehen die
Schaltflächen verloren. Die Seite selbst ist im Grunde ebenfalls ein Container und das
übergeordnete Element aller darin enthaltenen Elemente. Wenn Sie die Seite löschen, löschen
Sie auch alles darin.
Der Hauptunterschied zwischen Boxen und Panels besteht darin, dass Panels nur eine
Organisationsrolle erfüllen, während Boxen auch zu Präsentationszwecken verwendet werden.
Im Vergleich zum Panel ist eine Box sehr viel anpassungsfähiger.
Jedes dieser Elemente erfordert eine intensive Auseinandersetzung. Weitere Informationen
hierzu finden Sie im Abschnitt Containerelemente: Boxen und Panels.
IFrame-Element
Das IFrame-Element ermöglicht Ihnen das Einbeziehen einer gesamten Webseite in
Ihre Seite, gleichgültig, ob es sich bei dieser Webseite um Ihre eigene oder um eine aus dem
Internet handelt. Sie können die Größe und Farbe des Viewports als auch dessen Namen
ändern. Wenn Sie diesen der Seite hinzufügen, wird eine Platzhaltergrafik eingefügt, die zeigt,
wo die Seite angezeigt wird und welche aktuellen Abmessungen diese hat. Sie können über die
Symbole der Registerkarte Element der Symbolleiste Eigenschaften auswählen, welche Seite
angezeigt wird.
Faltelement
Das Faltelement ist mit einem animierten Stapelmenü vergleichbar. Wenn Sie auf
einen Abschnitt klicken, wird dieser erweitert und zeigt den Inhalt dieses Abschnitts an. Sie
können die Farbe der Faltelemente ebenso wie die der Schaltflächenelemente ändern.
In WC6 müssen Sie Seiten im Vorfeld vorbereiten und diese einem Abschnitt Ihrer Wahl
zuweisen.
Registerkartenelement
Seite 40 / 77
Das Registerkartenelement gibt Ihnen die Möglichkeit, mehrere Webseiten in
einem Bereich einzufügen und darauf über die bereitgestellten Schaltflächen im Menüstil
zuzugreifen. Bei den Seiten kann es sich um Ihre eigenen oder um Seiten einer online
geschalteten Website handeln, auf die Sie verweisen.
Die Größe der angezeigten Seiten bleibt normal, und eine Bildlaufleiste wird angezeigt, die eine
Navigation durch die Seiten ermöglicht.
Einer der Unterschiede zwischen dem Faltelement und der Registerkarte besteht darin, dass
das Faltelement nur interne Seiten anzeigt, während das Menü gestapelt und animiert ist.
Labelelemente (H1 bis H6)
Das Label (H1 bis H6) ermöglicht Ihnen das Einfügen referenzierender Tags von H1
bis H6.
Diese werden häufig verwendet, um die Organisation Ihrer Website zu definieren und die
Wichtigkeit bestimmter Informationen auf Ihrer Website zu unterstreichen. Sie sind nach
Wichtigkeit gestaffelt (1 bis 6) und teilen Suchmaschinen die wichtigsten Informationen über
Ihre Seite mit.
Sie sind nützlich, wenn es darum geht, sicherzustellen, dass Suchmaschinen keine wichtigen
Informationen auf Ihrer Website übersehen, wenn Benutzer eine Abfrage nach relevanten
Informationen machen. Beschriftungselemente steigern somit beträchtlich die Wahrnehmung
Ihrer Website im Internet.
Sie unterscheiden sich deutlich von Textelementen und sollten mit Bedacht verwendet werden.
Seite 41 / 77
Sobald sie Ihrer Seite hinzugefügt sind, können Sie die Stufe der Wichtigkeit auswählen, die der
folgende Textblock in der Symbolleiste Eigenschaften erhält. Jede Kopfzeile weist einen
vordefinierten Stil sowie eine vordefinierte Farbe und Schriftart auf. Sie können diese
Einstellungen jedoch ändern und die Kopfzeile dem Stil Ihrer Seiten anpassen. Sie können den
Stil sämtlicher Kopfzeilen projektübergreifend ändern, indem Sie das Symbol Kopfzeile auf der
Registerkarte Web des Menübands verwenden. Wenn Sie den Stil nur für die aktuelle Seite
ändern möchten, nehmen Sie Ihre Änderungen im Abschnitt zur aktuellen Seite vor.
Popup-Element
Popups ermöglichen es Ihnen, eine andere Webseite über Ihrer eigenen
anzuzeigen. Das Popup muss von einem Ereignis ausgelöst werden, damit es angezeigt wird.
Wenn das Popup aktiviert ist, wird die dieses aufrufende Seite dunkler dargestellt, damit die
Aufmerksamkeit des Benutzers auf die neu geöffnete Seite gelenkt wird.
Abschnitt 'Sozial'
Elemente sozialer Netzwerke
Das Element Soziale Netzwerke ermöglicht es Ihnen, Links zu einer vordefinierten
Liste beliebter sozialer Websites schnell zu integrieren: Facebook, Twitter, Google+, Delicious,
Seite 42 / 77
Reddit, Stumbleupon, Tumblr, LinkedIN und Digg. Sie können dieses Element stilistisch ändern,
damit es sich besser in Ihre Seite integriert.
Blogelement
Sobald dieses Element in Ihrer Seite positioniert wurde, klicken Sie in der Symbolleiste
Eigenschaften auf die Schaltfläche Neu. Der Standardname Blog wird angezeigt.
Wenn Sie Feedback von den Besuchern Ihrer Website wünschen, müssen Sie eine E-MailAdresse angeben, an die das Feedback gesendet werden soll.
Sie können Ihren ersten Eintrag in den Bereich unten schreiben, indem Sie das Plussymbol (+)
rechts verwenden. Das Datum wird mit dem Hinweis Neuer Eintrag darunter angezeigt. In den
folgenden Feldern können Sie Links auf andere Seitenartikel oder auf Seiten in Ihrem Projekt
hinzufügen. Jedes Mal, wenn Sie einen Eintrag hinzufügen, wird Ihren Lesern angezeigt, wann
dieser erstellt wurde. Sie können Ihren Text mit den vier Symbolen direkt über dem Textbereich
ändern.
Abschnitt 'Multimedia'
Galerieelement
Das Galerieelement ermöglicht es Ihnen, eine Sammlung von Grafiken auf Ihrer Webseite
anzuzeigen. Bei der anfänglichen Ansicht kann es sich entweder um ein Mosaik handeln, das
Ihre Sammlung mit kleinen Vorschaubildern anzeigt, oder um eine Diashow, die die Grafiken im
Wechsel anzeigt. Beachten Sie, dass diese Einstellung nur die anfängliche Anzeige bestimmt. Die
Mosaikeinstellung wird auf eine Diashow zurückgesetzt, sobald ein Besucher ein Foto auswählt.
Sound- und Videoelemente
Seite 43 / 77
Die Sound- und Videoelemente funktionieren fast genauso. Jedes Element zeigt einen Player
genau so an, wie dieser in einem Browser angezeigt würde. Sie können eine Vorschau des in der
Symbolleiste Eigenschaften direkt ausgewählten Videos oder Sounds aufrufen. Viele weit
verbreitete Formate werden unterstützt. Sie haben die Möglichkeit, einen Player zum Abspielen
auszuwählen.
Google Maps-Element
Dank des Google Maps-Elements können Sie Ihrer Website eine interaktive Karte
zu jeder vorgegebenen Adresse hinzufügen. Sie können die jeweilige Adresse einfach auf der
Registerkarte Element der Symbolleiste Eigenschaften angeben und erhalten Zugriff auf Karten, Satelliten- und Straßenansicht des jeweiligen Bereichs.
Abschnitt 'Daten'
PayPal-Element
Das PayPal-Element ermöglicht es Ihnen, einen Link zu einem PayPal-Konto
einzufügen und so eine sichere Möglichkeit zur Onlinezahlung einzurichten. Auf der
Registerkarte Element der Symbolleiste Eigenschaften können Sie den Typ des Links auswählen:
Zum Einkaufswagen hinzufügen, Einkaufswagen anzeigen und Jetzt kaufen. Sie können diesen
Link anschließend mit dem PayPal-Konto verknüpfen, den Preis festlegen und auswählen, ob der
ausgewählte Artikel mehrmals bestellt werden kann.
Webelement
Seite 44 / 77
Benutzern mit Erfahrung in den Bereichen Codierung und dem Erstellen von Skripts bietet das
Webelement Möglichkeiten zum Einfügen von Javascript, PHP oder anderen webbasierten
Programmiersprachen. Wir können nicht für die Ergebnisse garantieren, wenn Sie dieses Objekt
verwenden, da diese von der Qualität des Codes sowie vom lesenden Browser und dem
verarbeitenden Server abhängen. Wenn Sie dieses Objekt also verwenden, stellen Sie sicher,
dass Sie über umfangreiche Informationen zur Verwendung von Programmiersprachen
verfügen, und führen Sie Tests durch. Dieses Element ist eng mit der Funktion
Benutzerdefinierter Code im Abschnitt Seite der Registerkarte Web auf dem Menüband
verbunden.
Google Übersetzer-Element
Das Google Übersetzer-Element gibt Ihren Benutzern die Möglichkeit, Ihre Website
sofort in sämtlichen Sprachen Ihrer Wahl anzuzeigen. Sie müssen dieses Element lediglich Ihrer
Seite hinzufügen. Benutzer Ihrer Seite können anschließend die gewünschte Sprache in der
Dropdownliste auswählen.
Formular- und Formularfeldelemente
Die Formular- und Formularfeldelemente müssen gemeinsam definiert werden. Sie
ermöglichen Ihnen das kostenlose Verwenden eines beliebten von LMSOFT bereitgestellten
Dienstes. Wenn Sie eine Empfängeradresse angeben, erfasst das von Ihnen erstellte Formular
Informationen, die Ihre Benutzer einsenden können. Die erfassten Daten werden auf unseren
Servern verarbeitet und an Sie gesendet. Sie können diese Daten anschließend nach Wunsch
verwenden.
Sie beginnen, indem Sie ein Formular erstellen und in der Symbolleiste Eigenschaften einen
Aktionstyp auswählen. Die ersten zwei Aktionen führen dazu, dass Ihnen eine E-Mail mit den
erfassten Informationen gesendet wird. Benutzer werden jedoch die erste Auswahl vorziehen,
da diese weniger Aufwand für sie bedeutet und ihr Browsen nicht unterbricht.
Die dritte Option sendet die Daten an eine Webseite, die die Informationen anschließend
mithilfe von Skripts oder serverseitigem Code analysiert (dafür wären Sie dann verantwortlich).
Diese Option ist für das Eingeben von Informationen in eine Datenbank sehr nützlich.
Die vierte Option sendet die Informationen an eine Javascript-Funktion, die Sie entweder in
einem Webelement (wie zuvor gezeigt) oder im Bereich Benutzerdefinierter Code der
Registerkarte Web des Menübands erstellt haben. Sobald das Formular übermittelt wird, wird
die Javascript-Funktion mit den von Ihnen festgelegten Informationen aufgerufen.
Sobald das Formular erstellt ist, müssen Sie über das Formularfeldelement Eingaben
vornehmen. Beim Einfügen wird das Formular als weißes Textfeld angezeigt. Es stehen jedoch
andere Eingabetypen zur Auswahl zur Verfügung, um dies zu ändern. Testen Sie sämtliche
Möglichkeiten durch, um die für Sie am besten passende zu ermitteln.
Seite 45 / 77
Zählerelement
Das Zählerelement zeigt Ihnen an, wie viele Besucher Ihre Website besucht haben. Da Sie die
Wahl unter einer Vielzahl von Zählern haben, müssen Sie dieses Element mit Code füllen. Sie
können den Code selbst schreiben, wenn Sie Erfahrung damit haben. Im Internet lassen sich
jedoch auch viele Javascript-Codeausschnitte finden, die Sie hierfür verwenden können.
Elementeliste
Die Elementeliste befindet sich ganz rechts auf der Oberfläche. Sie ist das obere
Fenster der zwei auf der rechten Seite angezeigten Fenster.
Seite 46 / 77
Diese Liste kann jederzeit getrennt werden. Führen Sie hierzu einfach einen Doppelklick auf die
oben angezeigte Leiste aus, und Sie können sie überall hin verschieben wo Sie möchten.
Doppelklicken Sie erneut auf die Leiste, um sie wieder an ihre ursprüngliche Position zu
verschieben. Die Elementeliste enthält zwei Registerkarten: Elemente und Blöcke.
Seite 47 / 77
Registerkarte 'Element'
Die Registerkarte Element enthält eine Liste aller auf der aktuellen Seite
enthaltenen Elemente in einer Strukturansicht. Die Strukturansicht zeigt deren jeweilige Position
hinsichtlich Reihenfolge, Erstellung, Beziehungen und Abhängigkeiten zu anderen Elementen an.
Es wird auch berücksichtigt, ob die Elemente zu anderen Elementen gehören oder andere
Elemente beinhalten (weitere Informationen hierzu finden Sie im Abschnitt Containerelemente:
Boxen und Panels).
Die Symbole neben den Elementnamen ermöglichen das Aus- oder Einblenden von Elementen
sowie das Reduzieren oder Erweitern des Inhalts des Containers.
Suchen eines Elements
Der Bereich Suchen ermöglicht Ihnen das einfache Auffinden eines Elements auf Grundlage
seines Namens oder sogar eines Teils seines Namens. Wenn Sie auf den Pfeil klicken, rufen Sie
die Ergebnisse nacheinander auf. Diese werden in der Elementeliste rot hervorgehoben und,
wenn Sie darauf doppelklicken, auf der Seite ausgewählt.
Ändern der Reihenfolge von Elementen
Rechts neben der Suchfunktion befindet sich das Feld Z-Ordnung mit zwei vertikalen Pfeilen.
Diese Funktion steuert die Ordnung des Elements auf der Seite. Standardmäßig werden
Elemente in der Reihenfolge ihrer Erstellung angeordnet. Diese Anordnung kann sich ändern,
wenn sie einem übergeordneten Element hinzugefügt werden (da Elemente im übergeordneten
Element möglicherweise vor dem fraglichen Element erstellt wurden). Die vertikalen Pfeile
ermöglichen es Ihnen, die Z-Ordnung eines Elements auf der Seite zu ändern.
Anzeigen von Elementen und Gruppen
Über der Liste befindet sich das Dropdownfeld Hierarchische Ansicht der Seitenelemente.
Wenn Sie darauf klicken, können Sie die Auswahl in Elementgruppen und ihre Inhalte anzeigen
ändern.
Seite 48 / 77
Suchen von Gruppen
Wie bei den Elementen, ermöglichen Ihnen die Suchfelder ein einfaches Suchen von Gruppen
auf Grundlage ihres Namens oder eines Teils ihres Namens. Wenn Sie auf den Pfeil klicken, rufen
Sie die Ergebnisse nacheinander auf. Diese werden in der Elementeliste rot hervorgehoben und,
wenn Sie darauf doppelklicken, auf der Seite ausgewählt.
Registerkarte 'Blöcke'
Wenn Sie auf die Registerkarte Blöcke klicken, wird ein neuer Bereich mit den
folgenden zwei neuen Registerkarten angezeigt: Bibliothek und Benutzerdefiniert.
Seite 49 / 77
Ein Dropdownmenü auf der Registerkarte Bibliothek ermöglicht Ihnen das Auswählen von
Blöcken aus unterschiedlichen Vorlagen. Die Registerkarte Benutzerdefiniert ermöglicht Ihnen
das Speichern von Blöcken, die Sie erstellen. Weitere Informationen zu Blöcken finden Sie im
Abschnitt Verwenden von Blöcken.
Die Symbolleiste 'Eigenschaften'
Die Symbolleiste Eigenschaften gruppiert mehrere Registerkarten neu, die sich alle
auf das aktuell ausgewählte Element beziehen.
Seite 50 / 77
Das Reißzweckensymbol oben rechts ermöglicht Ihnen das Trennen der Symbolleiste
Eigenschaften und deren freie Bewegung im Fenster. Das Kreuzsymbol ermöglicht ein Schließen
der Symbolleiste. Wenn Sie die Symbolleiste schließen, wird eine einfache Titelleiste namens
Eigenschaften unten auf der Oberfläche platziert. Über diese können Sie die Symbolleiste
Eigenschaften wieder aufrufen.
Registerkarte 'Element'
Je nach ausgewähltem Element stehen Ihnen unterschiedliche Tools zum Ändern von Elementen
zur Verfügung, angefangen bei Tools zum Ändern der Farbe, bis hin zu Tools zum Einfügen von
Seiten.
Registerkarte 'Optionen'
Auf dieser Registerkarte können Sie das ausgewählte Element umbenennen. Für eine Grafik
können Sie einen alternativen Text eingeben, der von Suchmaschinen verwendet wird, um eine
fehlende Grafik zu ersetzen. Dieser Text wird auch Benutzern angezeigt, die Grafiken in ihrem
Browser deaktiviert haben. Sie können sogar das Verhalten von Elementen beim Laden der Seite
ändern – beispielsweise mit Einblendeffekten.
Registerkarte 'Aktionen'
Diese Registerkarte ermöglicht es Ihnen, Ihren Elementen ein interaktives Element
hinzuzufügen. Sie ermöglicht es Ihnen, Mausklicks und Bewegungen des Mauszeigers auf ein
Element oder von diesem weg zu verfolgen. Auf dieser Seite können Sie aus einer Vielzahl von
Elementen auswählen, die mit diesen Aktionen verknüpft werden sollen.
Schaltfläche 'Rollover'
Diese Schaltfläche bezieht sich nur auf den über das ausgewählte Element bewegten
Mauszeiger. Die Aktionen dieses Ereignisses können jedoch auf andere Elemente auf der Seite
übertragen werden. Nehmen wir beispielsweise an, Sie erstellen eine einfache Schaltfläche, die
angezeigt wird, sobald die Seite geladen wird. Diese Schaltfläche kann angezeigt werden, sobald
der Mauszeiger über ein bestimmtes Element auf der Seite bewegt wird. Sie können hierzu auch
ein Multimediaelement verwenden, das nur ein Mal abgespielt wird, sobald der Rollover
stattfindet.
Registerkarte 'Link'
Die Registerkarte Link lässt sich ganz einfach verwenden. Sie ermöglicht es Ihnen, auf Seiten im
Internet oder auf Seiten innerhalb Ihres Projekts zu verweisen. Darüber hinaus stehen weitere
Optionen zur Verfügung, beispielsweise die automatische Umleitung. Auch können Sie
festlegen, wo der Link geöffnet werden soll.
Seite 51 / 77
Registerkarte 'Position'
Diese Registerkarte enthält alle Informationen zur Größe eines Elements und zu dessen Position
auf der Seite. Auf dieser Registerkarte können Sie auch das Verhalten für die Optionen
Schwimmen und Umbrechen (siehe Abschnitt Schwimm- und Umbruchverhalten) festlegen.
Registerkarte 'Eigenschaften'
Diese letzte Registerkarte enthält alle Eigenschaften der anderen übergeordneten Elemente,
jedoch in Form einer Liste.
Containerelemente: Boxen und Panels
Web Creator Pro 6 führt zwei neue Elementtypen ein, bei denen es sich wie bei
einer Seite um Container handelt: Die Elemente Box und Panel.
Container wurden konzipiert, um benutzerdefinierte Elemente zu enthalten. Sie werden
verwendet wie eine Schachtel: Jedes hineingelegte Element wird zu einem untergeordneten
Element. Wenn Sie also den Container verschieben, verschieben Sie auch dessen Inhalt.
Diese Container ermöglichen Ihnen das einfache Erstellen von Vorlagen für Seiten, indem Sie
mehrere Container miteinander kombinieren. Sie können auch komplexe Layouts
zusammenstellen und den stimmigsten Look beibehalten.
Unterschiede zwischen Panels und Boxen
Der Hauptunterschied zwischen Boxen und Panels besteht darin, dass Panels nur eine
Organisationsrolle erfüllen, während Boxen auch zu Präsentationszwecken verwendet werden.
Im Vergleich zum Panel ist eine Box sehr viel anpassungsfähiger.
Wenn Sie eine nicht sichtbare Box nur für Organisationszwecke benötigen, würden Sie statt
einer Box ein Panel verwenden.
Wenn der Container jedoch auch ansprechend gestaltet sein soll (Form, Farbe, Rahmen), ist eine
Box geeigneter als ein Panel. Den Anpassungsoptionen für eine Box wenden wir uns etwas
später noch zu.
Als Nächstes zeigen wir Ihnen, dass beide Objekte nahezu identisch funktionieren.
Erstellen eines Layouts mit Containern
Sie können diese Element in Abschnitt Layout der Symbolleiste Elemente unter Panel und Box
finden.
Seite 52 / 77
Ein Klick auf ein Element verschiebt es in die Mitte der Seite. Boxen werden blau angezeigt.
Panels werden transparent mit einem gepunkteten Rahmen angezeigt (der Rahmen ist im
Browser nicht sichtbar).
Hinzufügen von Elementen zu einem Container
Hinzufügen eines Elements zu einem Container
Ein Element kann nicht direkt in einem Container erstellt werden.
Beginnen Sie, indem Sie einen Container erstellen. Rufen Sie hierzu den Abschnitt Layout in der
Symbolleiste Elemente auf. Wählen Sie ein Panel oder eine Box aus. Das Panel bzw. die Box wird
mittig auf der Seite angezeigt.
Erstellen Sie jetzt ein Element. Wählen Sie dazu eine Grafik aus, indem Sie auf das Symbol im
Abschnitt Allgemein der Symbolleiste Elemente klicken. Dieses wird ebenfalls mittig auf der
Seite angezeigt.
Wenn Sie das Panel auswählen und versuchen, dieses zu verschieben, folgt die Grafik dem Panel
nicht. Der Grund hierfür liegt darin, dass Elemente standardmäßig unabhängig von anderen
Elementen erstellt werden. Diese Funktion verhindert das versehentliche Hinzufügen von
Elementen zu Containern in der Mitte der Seite.
Führen Sie folgende Schritte aus: Wählen Sie das Element aus, und positionieren Sie es oben im
Panel. Sobald sich das gesamte Element innerhalb der Abgrenzungen des Panels befindet, wird
der Rahmen des Panels lila angezeigt. Dies zeigt an, dass das Panel das übergeordnete Element
des darin platzierten Elements geworden ist. Sie können das Element jetzt freigeben. Wenn Sie
jetzt erneut versuchen, das Panel zu verschieben, wird das Element gemeinsam mit diesem
verschoben.
Eine andere Möglichkeit, ein Element in einen Container zu platzieren, besteht darin, einen
Rechtsklick auf das Element auszuführen und das Kontextmenü zu öffnen. Sobald das Menü
geöffnet ist, wählen Sie einfach Zum übergeordneten Element hinzufügen und den Namen des
Containers aus.
Seite 53 / 77
Das Element wird sofort oben links im Container positioniert.
Hinzufügen mehrerer Elemente zu einem Container
Zum Hinzufügen mehrerer Elemente zu einem Container steht eine Reihe von Möglichkeiten zur
Verfügung.
Seite 54 / 77
Sobald der Container erstellt wurde, können Sie mehrere Elemente am einfachsten hinzufügen,
indem Sie die hinzuzufügenden Elemente auswählen und das Kontextmenü mit einem
Rechtsklick öffnen. Sobald das Menü geöffnet ist, wählen Sie Zum übergeordneten Element
hinzufügen aus. Anschließend können Sie den gewünschten Container auswählen. Die Elemente
werden oben links im Container positioniert.
Eine andere Möglichkeit besteht im Ziehen und Ablegen der ausgewählten Elemente in die
gewünschten Container. Wenn der Rahmen des übergeordneten Elements lila angezeigt wird,
bedeutet dies, dass die Elemente dem Container erfolgreich hinzugefügt wurden.
Sie können auch jedes Element einzeln ziehen und übergeben. Dies dauert dann entsprechend
länger.
Wählen Sie den Container aus, indem Sie darauf klicken oder ihn aus der Elementeliste
auswählen. Wenn Sie ihn verschieben, beachten Sie, dass die Elemente darin ebenfalls
verschoben werden. Sollte dies nicht der Fall sein, wurden die nicht verschobenen Elemente
entweder nicht zum Ziehen ausgewählt oder sind kein Bestandteil des Containers. Klicken Sie
einfach auf Rückgängig, und versuchen Sie es erneut.
Wenn Sie die gemeinsam mit anderen Komponenten in Web Creator Pro 6 bereitgestellten
Container verwenden, können Sie sehr einfach mehrere Seiten oder Projekte zusammenstellen,
die auf derselben Vorlage basieren. Hierzu steht eine neue Funktion zur Verfügung: Der Block.
Bei Blöcken handelt es sich ebenfalls um organisatorische Komponenten. Blöcke werden
verwendet, um Container und deren untergeordnete Elemente für eine spätere Verwendung zu
kopieren. Auf diese Art können Sie mehrere Container kopieren und diese als Blöcke auf eine
andere Seite verschieben. Weitere Informationen hierzu finden Sie im Abschnitt Verwenden von
Blöcken.
Box- und Paneleigenschaften
Wie bereits erläutert, besteht der Hauptunterschied zwischen Boxen und Panels in deren
Anzeige.
Auf der Registerkarte Element auf der Symbolleiste Eigenschaften können Sie verschiedene
Eigenschaften anpassen.
Panels verfügen nur über geringe Anpassungsoptionen. Sie können lediglich die Farbtransparenz
und die Leuchtdichte ändern, indem Sie auf das Feld neben Farbe klicken.
Seite 55 / 77
Boxen sind hingegen schon bei ihrer Erstellung umfassend anpassbar. Sie verfügen über
abgerundete Ecken, einen farbigen Rahmen, einen Schlagschatten und eine Hintergrundfarbe.
Panels sind zu Anfang transparent. Ihnen kann nur eine Hintergrundfarbe zugewiesen werden.
Boxen können auch eine Kopfzeile und eine Fußzeile erhalten, jeweils mit eigener Farbe oder
Transparenz. Diese Funktionalität ermöglicht Ihnen das Einfügen von Text oder das Anzeigen
von darunter liegenden Elementen.
Seite 56 / 77
Im Folgenden eine Reihe von Beispielen zu abgerundeten Ecken, Kopfzeilen, Fußzeilen,
Rahmenbreiten, Verläufen und Transparenzen.
Seite 57 / 77
Ausrichtungs- und Positionierungstools
Die Ausrichtung, Positionierung und Änderung der Größe von Elementen ist in Web Creator Pro
6 ganz einfach.
1) Auf der Registerkarte Tools des Menübands steht ein vollständig anpassbares Rastertool
zur Verfügung.
2) Bei Vorgängen der Positionierung oder Größenänderung werden Hilfen angezeigt.
3) Auf der Registerkarte Format steht eine Vielzahl von Optionen zur Verfügung.
Raster
Alle Einstellungen stehen auf der Registerkarte Tools zur Verfügung.
Von dieser aus können Sie die Funktionsweise des Rasters umfassend anpassen: Sie können es
als sichtbar oder als nicht sichtbar festlegen, als magnetisch oder nicht magnetisch. Sie können
die Farbe des Ausrichtungsrasters mit dem Farbauswahltool ändern. Auch den Abstand des
Rasters können Sie anpassen (sowohl Höhe als auch Breite).
Seite 58 / 77
Positionierungshilfen
Sobald Sie ein Element verschieben, zeigt Web Creator Pro 6 Positionierungshilfen
an, anhand derer Sie das ausgewählte Element in Relation zu anderen Elementen auf der Seite
ausrichten können. Diese Funktion kann in vielen Fällen sehr nützlich sein, in denen es auf einer
Seite mit vielen Elementen auf eine perfekte Ausrichtung ankommt.
Diese Positionierungshilfen werden auch aktiviert, wenn Sie die Größe ändern.
Im Folgenden ein Beispiel eines Elements, das verschoben wird.
... Und nun ein Beispiel eines Elements, dessen Größe geändert wird.
Funktionen der Registerkarte 'Format'
Web Creator Pro 6 ermöglicht das einfache Ausrichten vieler Elemente in Relation
zu einem übergeordneten Element oder in Relation zueinander: Nach links, nach rechts, nach
oben, nach unten, in die Mitte und zentriert.
Seite 59 / 77
Der erste Abschnitt der Registerkarte Format wird verwendet, um eines oder mehrere Elemente
nicht in Relation zueinander, sondern in Relation zu dem Container zu positionieren, in dem sie
enthalten sind (Seite, Panel, Box).
Das folgende Beispiel zeigt die Ausrichtung eines Elements in einer Box, das zuerst mit der
Option Horizontal, dann mit der Option Vertikal und schließlich mit einer Kombination beider
Optionen namens Zentriert bearbeitet wurde.
Der Rest der Registerkarte Format betrifft die relative Positionierung von Elementen
zueinander. Im Folgenden eine schematische Übersicht über die Funktionsweisen der Optionen
zur Ausrichtung und Größenänderung anhand eines Beispiels mit drei Boxen.
Seite 60 / 77
Wenn Sie mehrere Elemente auswählen, wird eines mit grünen Punkten angezeigt, die anderen
mit hellblauen Punkten. Die grünen Punkte dienen als Referenzpunkte für einige der
Ausrichtungsfunktionen.
Sollte das Ausrichten einer Gruppe von Elementen nicht zum gewünschten Ergebnis führen,
führen Sie folgende Schritte aus: Brechen Sie die Ausrichtung ab. Wählen Sie die zum Ausrichten
der Elemente anzuwendende Funktion aus, und klicken Sie auf das Element, das als
Referenzpunkt dienen soll. Dieses wird jetzt als Referenzpunkt ausgewählt, und Sie können die
Ausrichtung anwenden.
Sie werden das referenzierte Element instinktiv rasch finden.
Schwimm- und Umbruchverhalten
Wenn Sie das Schwimm- und Umbruchverhalten implementieren, können die
Elemente im Container (Seite, Panel oder Box) automatisch neu positioniert werden. Dieses
Konzept sollte nicht abschrecken. Es ist einfacher als es auf den ersten Blick erscheint und wird
Ihnen sehr nützlich sein.
Seite 61 / 77
Diese Funktion kann im besten Fall dazu führen, dass Sie Ihr Layout manuell nicht bearbeiten
müssen. Sie unterstützt die Größenänderung von Seiten und macht das Erstellen mobiler
Websites zu einem Kinderspiel. Sie müssen diese Funktionen nicht verwenden, wir empfehlen
jedoch nachdrücklich, dass Sie sich die Vorteile, die diese bieten, nicht entgehen lassen.
Diese Einstellungen stehen Ihnen auf der Registerkarte Position in der Symbolleiste
Eigenschaften unter dem Abschnitt Verhalten zur Verfügung.
Schwimmen
Ein Element mit dem Verhalten Schwimmen macht genau das: Es bewegt sich, als würde es auf
Wasser schwimmen.
Das Element verhält sich wie Schaum im Aquarium. Es schwimmt im Container automatisch
nach oben (Seite, Panel, Box).
Je nachdem, ob es nach links oder nach rechts schwimmt, wird das Element versuchen, diese
Position zu erreichen. Wenn ein Element mit dem Schwimmverhalten erkannt wird, wenn Ihr
neu platziertes Element ganz nach oben gelangt, wird Ihr neues Element daneben platziert.
Dafür muss jedoch ausreichend Platz vorhanden sein. Wenn nicht ausreichend Platz für ein
schwimmendes Element vorhanden ist, wird es nach Möglichkeit direkt darunter positioniert.
Wenn Sie als Schwimmverhalten Ohne auswählen, kann das Element manuell platziert werden
und bleibt auf seiner Position.
Wenn Sie diese Einstellung aktivieren, können Elemente auf einer Seite automatisch neu
positioniert werden, wenn Sie das Layout der Seite oder die Ausrichtung der Seite ändern oder
wenn Sie ein neues Element einfügen.
Wichtig: Das Schwimmverhalten verwaltet die Positionierung von Elementen in ihrem
unmittelbaren Container. D. h. die Elemente schwimmen in Relation zu den anderen Elementen
in ihrem Container.
Schwimmvorgänge können so umfangreich wie erforderlich geschachtelt werden. Das bedeutet,
dass Sie das Schwimmverhalten auf alle Elemente in einer Box anwenden können und das
Schwimmverhalten auf die Box anwenden können, die diese Elemente enthält. Die Elemente in
der Box schwimmen in Relation zueinander innerhalb der Box, und die Box schwimmt in
Relation zu anderen Containern auf der Seite.
Seite 62 / 77
Positionierungseinschränkungen
Elemente mit dem Schwimmattribut werden entsprechend dem oben im Container verfügbaren
Platz positioniert. Wenn das Element zu groß ist, wird nicht seine Größe verändert, sondern es
wird an eine passende Position verschoben.
Wenn also ein Element neben einem anderen platziert wird, sollte es an seiner Position
einrasten. Gelingt dies nicht, wird es die nächste Reihe verschoben. Es wird dann danach
ausgerichtet, welches Schwimmverhalten (links oder rechts) ausgewählt wurde. Das
schwimmende Objekt wird anschließend neben dem ersten Element positioniert. Auf der
folgenden Abbildung sehen Sie drei Schaltflächen mit den aktivierten Optionen Schwimmen und
Links mit einer Breite proportional zum Container. So sind die Schaltflächen perfekt
ausgerichtet.
Seite 63 / 77
Die Breite des Panels der mittleren Abbildung wurde reduziert. Dadurch ist das Panel zu klein,
um alle drei Schaltflächen nebeneinander aufzunehmen. Die dritte Schaltfläche wird daher
automatisch in die nächste Reihe verschoben.
Im dritten Panel wurde die Größe der dritten Schaltfläche angepasst. Diese ist nun breiter und
passt daher nicht mehr in die erste Reihe und wird ebenfalls in die nächste Reihe verschoben.
Auf der folgenden Abbildung werden die Schaltflächen in absteigender Reihenfolge angeordnet.
Seite 64 / 77
Die Breite des Panels der mittleren Abbildung wurde wieder reduziert, was dazu führt, dass die
vierte Schaltfläche in die nächste Reihe verschoben wird. Eine Schaltfläche mit den aktivierten
Optionen Schwimmen und Links muss in die nächste Reihe ausweichen und wird an der Ecke
der zweiten Schaltfläche angeordnet.
Das letzte Panel zeigt, wie sich die Schaltflächen verhalten, wenn das Panel erneut verkleinert
wird. Die vierte Schaltfläche wird direkt unter der zweiten platziert und berührt die Ecke der
ersten Schaltfläche.
In der folgenden Abbildung wurde das Panel nochmals verkleinert.
Seite 65 / 77
Nun ist auch die dritte Schaltfläche, die sich bisher in der ersten Reihe befunden hatte, von dem
Änderungsvorgang betroffen. Sie kann ihre Position nicht mehr halten und wird unter die zweite
Schaltfläche verschoben, wo sie sich bis zur Ecke der ersten Schaltfläche bewegt. Die vierte
Schaltfläche kann nicht mehr neben der dritten Schaltfläche platziert werden und wird daher
unter die dritte Schaltfläche bis an den Rand des Panels verschoben.
Beachten Sie die leere Fläche zwischen den Schaltflächen. Es scheint, dass die vierte Schaltfläche
zu groß ist, um in den Freiraum unter die erste Schaltfläche zu passen. Aber dies ist nicht der
Fall.
Es ist vielmehr so, dass ein Element, das so weit nach oben geschwommen ist wie möglich, sich
an dem Element davor ausrichtet. Das Element vor der vierten Schaltfläche ist die dritte
Schaltfläche. Daher tendiert die vierte Schaltfläche immer dazu, rechts von der dritten
Schaltfläche zu sein. Wenn dies nicht möglich ist, wird die Schaltfläche in der nächsten Reihe
positioniert.
Wenn wir nun die Größe der vierten Schaltfläche so weit reduzieren würden, dass diese
theoretisch in den Freiraum unter der ersten Schaltfläche passen müsste, würde sie dennoch
nicht in diesen Freiraum schwimmen.
Wenn Sie die Größe der vierten Schaltfläche nun jedoch so weit reduzieren, dass diese in den
Freiraum rechts von der dritten Schaltfläche passt, wird sie dorthin verschoben.
Seite 66 / 77
In den drei folgenden Beispielen ist die Reihenfolge unabhängig von der Höhe oder Breite der
Elemente vor der vierten und fünften Schaltfläche gleich: Jedes Element versucht, sich rechts
oder unterhalb vom vorangehenden Element zu positionieren.
Optimale Nutzung des Schwimmverhaltens
Wenn wir die zuvor gemachten Erläuterungen zu Ende denken, wird es offensichtlich, dass wir
Elemente mit derselben Abmessung benötigen, wenn wir das Schwimmverhalten optimal
nutzen möchten. Wenn gleichförmige Elemente verschoben werden, ordnen sie sich immer
wieder einheitlich im Container an, ohne dass dabei Lücken entstehen.
Es könnte verlockend sein, die Lücken durch Elemente ohne aktiviertes Schwimmverhalten zu
schließen.
Diese Elemente könnten aber nicht automatisch verschoben werden und würden daher im
weiteren Verlauf zu neuen Lücken führen.
Seite 67 / 77
Hinzufügen eines schwimmenden Elements
Sobald Sie ein Element mit aktiviertem Schwimmverhalten erstellt oder über einer Gruppe von
Elementen positioniert haben, platziert das neu eingefügte Element sich dort im Vordergrund,
wo es abgelegt wurde (stellen Sie sicher, dass Sie das Element dem Container erfolgreich
hinzugefügt haben, indem Sie es an die Position ziehen und ablegen oder indem Sie das
Kontextmenü öffnen und Zum übergeordneten Element hinzufügen > <Name des
übergeordneten Elements> auswählen).
Wenn Sie das Schwimmverhalten für dieses neue Element deaktivieren, wird es sich
automatisch an der einzig verfügbaren Position als letztes Element in der Gruppe entweder links
oder rechts vom vorangehenden Element platzieren. Wenn dort kein Platz ist, wird es darunter
platziert. Sie können die Position dieses Elements anschließend folgendermaßen auswählen.
Verschieben schwimmender Elemente
Wie Sie sehen konnten, spielt die Reihenfolge der schwimmenden Elemente eine große Rolle,
wenn Sie ein neues schwimmendes Element hinzufügen. Klicken Sie auf ein Element, und ziehen
Sie es an eine andere Position. Sobald der Mauszeiger die Ecken der anderen Elemente auf der
Seite erreicht, wird eine vertikale blaue Linie angezeigt. Diese zeigt Ihnen an, wo das Element
sich platzieren würde, sollten Sie es jetzt ablegen. Wenn sich die Leiste rechts befindet, wird das
Element dahinter platziert. Wenn sich die Leiste links befindet, wird es davor platziert.
Beachten Sie, dass das Hinzufügen eines Elements in einen mit anderen schwimmenden
Elementen gefüllten Container zu einem ziemlichen Dominoeffekt für das Layout des Containers
führen kann.
Seite 68 / 77
Einsatzmöglichkeiten für das Schwimmverhalten
Das Schwimmverhalten kann hauptsächlich in zwei Fällen eingesetzt werden:
1) Um Elemente desselben Typs zu präsentieren. Ein gutes Beispiel hierfür ist eine Liste von
Produkten. Sie können eine einzelne Box verwenden und diese mit Panels füllen, die ein
Bild oder eine Beschreibung enthalten. Auf diese Art können Sie z. B. eine Liste mit
prominenten Persönlichkeiten oder Kochrezepten erstellen. Wenn Sie diese Liste ändern
müssen, müssen Sie nur ein Panel entfernen oder hinzufügen. Das Layout bleibt
erhalten.
Nehmen wir im Folgenden beispielsweise eine Galerie von Komponisten. Das Layout
bleibt auch dann bestehen, wenn die Abmessungen der übergeordneten Container
geändert
werden.
Seite 69 / 77
Diese Seite enthält zwei Logos mit einer Grafik und einem Menü. Der Hauptteil der Seite
enthält vier Panels mit derselben Breite, aber einander ergänzenden Höhen. Dabei
handelt es sich eigentlich um exakt bemaßte Blöcke.
Seite 70 / 77
Blöcke sind ein wichtiges Konzept in Web Creator Pro 6, das im Abschnitt Verwenden
von Blöcken erläutert wird.
Das Umbruchverhalten
Das Umbruchverhalten wird gemeinsam mit dem Schwimmverhalten eingesetzt. Dieses
Verhalten sorgt dafür, dass ein schwimmendes Element nicht neben ein anderes schwimmendes
Element positioniert, sondern stattdessen immer in die nächste Reihe verschoben wird. Selbst in
Fällen, in denen das schwimmende Element ausreichend Platz zur Verfügung hätte, um sich
neben ein anderes Element zu positionieren (unabhängig davon, ob das Schwimmverhalten nun
Seite 71 / 77
nach links oder nach rechts festgelegt wurde), positioniert es sich immer unter andere
Elemente. Dieses Verhalten ermöglicht es Ihnen, Elemente zu stapeln. Es ist, als würde sich
hinter jedem Element ein Zeilenumbruch befinden. Sie können dabei auswählen, an welcher
Seite das Element ausgerichtet wird.
Wenn Ihre Elemente aus irgendeinem Grund, beispielsweise aus Platzmangel, nur gestapelt
werden können, stellt dieses Attribut sicher, dass sie dabei immer in einer vorhersagbaren
Weise ausgerichtet werden.
Diese Funktion ist besonders nützlich für Mobilgeräte, die ihre Ausrichtung ändern können. Die
vertikale Ausrichtung wird geringer, was dazu führt, dass die Elemente gestapelt werden. Wenn
Sie jedoch den Querformatsmodus aktivieren, würde dies für gewöhnlich dazu führen, dass die
Elemente nebeneinander aufgereiht werden.
Verwenden von Gruppen
Gruppen werden schon recht lange in Web Creator verwendet. Möglicherweise
laufen diese bald aufgrund der Einführung der Container aus. Gruppen sind ein symbolisches
Kollektiv von Elementen, das verwendet werden kann, um mehrere Elemente gemeinsam zu
verwalten und zu ändern. Wenn Sie eine Gruppe von Elementen nicht versehentlich ändern
möchten, müssen Sie eine Z-Ordnungshierarchie zwischen den Elementen erstellen. Mit der
Einführung der Container sind die Elemente bereits entsprechend ihrer Position auf der Seite
gruppiert.
Sie können eine Gruppe definieren, indem Sie mehrere Elemente auswählen und das
Kontextmenü mit einem Rechtsklick öffnen. Sie können nun Zu Gruppe hinzufügen auswählen
und entweder eine neue Gruppe erstellen oder eine vorhandene Gruppe hinzufügen.
Klicken Sie zum Zugriff auf die Eigenschaften einer Gruppe auf Hierarchische Ansicht der
Seitenelemente. Diese Option befindet sich ganz oben in der Elementeliste. Ändern Sie diese
Option in Elementgruppen und ihre Inhalte anzeigen.
Seite 72 / 77
Seite 73 / 77
Verwenden Sie das Plus- (+) oder Minuszeichen (-), um die Liste der Elemente zu erweitern oder
zu reduzieren. Sie können Gruppen und Elemente auch sperren, indem Sie das Schlosssymbol
verwenden.
Auf der Registerkarte Element können Sie die Gruppe umbenennen und deren Sichtbarkeit im
Navigator ändern. Sie können auch Elemente hinzufügen oder entfernen.
Wenn Sie ein Element aus der Gruppe auswählen, können Sie direkt auf dessen Eigenschaften,
Aktionen usw. zugreifen.
Verwenden von Blöcken
Einführung in Blöcke
Blöcke sind die natürliche Weiterentwicklung der Gruppen in Web Creator. Ein
Block ist ein Organisationstool, das es Ihnen ermöglicht, eine Reihe von Elementen zu speichern,
um diese zu einem späteren Zeitpunkt auf einer anderen Seite oder in einem anderen Projekt
wiederverwenden zu können.
Erstellen eines Blocks
Obwohl dies nicht erforderlich ist, empfehlen wir doch nachdrücklich, einen Block auf der Basis
eines Containers zu erstellen, um die Neupositionierung des Blocks zu einem späteren Zeitpunkt
zu erleichtern. Wenn Elemente in einem Block von einem Container (beispielsweise von einem
Panel oder von einer Box) aufgenommen werden, können Sie außerdem das Schwimmverhalten
auf den Container anwenden, was die automatische Neupositionierung des Blocks auf Ihrer
Seite ermöglicht.
Wenden wir uns einem Beispiel zu. Erstellen Sie ein Panel auf Ihrer Seite, und weisen Sie diesem
das Schwimmattribut zu. Verwenden Sie hierzu die Symbolleiste Eigenschaften. Befüllen Sie
dieses Panel anschließend mit einigen Elementen Ihrer Wahl, beispielsweise mit einer Grafik,
einem Text und einem sozialen Lesezeichen.
Seite 74 / 77
Sobald Ihr Ergebnis in etwa so wie auf der vorstehenden Abbildung ausschaut, können Sie alles
für die zukünftige Verwendung als Block speichern.
Wählen Sie hierzu die Box oder das Panel aus, die bzw. das alle Elemente enthält, indem Sie auf
einen Bereich klicken, der frei von Elementen ist, auf jeden Rahmen oder auf den jeweiligen
Namen in der Elementeliste. Öffnen Sie über die Elementeliste die Registerkarte Blöcke. Wählen
Sie als Nächstes die Registerkarte Benutzerdefiniert aus, und klicken Sie auf das Plussymbol (+).
Der Block wird sofort im Fenstertitel Element <Nummer> angezeigt. Die Nummer wird
entsprechend einer fortlaufenden Nummerierung generiert, die die Reihenfolge der Erstellung
anzeigt.
Das war es schon. Sie können die Box umbenennen, indem Sie einen Doppelklick auf deren
Namen ausführen.
Wenn Sie jetzt eine in einem Block gespeicherte Kopfzeile erstellen möchten, können Sie die Box
auf jede beliebige Seite ziehen. Sie müssen sie also nicht mehr jedes Mal neu erstellen.
Wenn Sie Ihren Block für eine andere Website nur leicht ändern, wird Ihnen das Erstellen eines
derartigen Blocks viel Zeit einsparen. Außerdem trägt es dazu bei, Layoutfehler zu vermeiden.
Seite 75 / 77
Wiederverwenden eines Blocks
Wenn Sie Ihre Seite oder sogar das gesamte Projekt ändern und anschließend zum Bereich mit
den benutzerdefinierten Blöcken in der Elementeliste zurückkehren, werden dort alle Blöcke
angezeigt, die Sie zuvor erstellt haben. Wenn Sie auf die Schaltfläche Zur Seite hinzufügen
klicken, während ein Block ausgewählt ist, wird der gesamte Block auf die Seite übertragen. Die
Elemente und deren Eigenschaften werden dabei beibehalten.
Vorsichtsmaßnahmen beim Verwenden von Blöcken
Wenn kein Containerelement ausgewählt ist, wird ein neuer Block immer unabhängig von
anderen Elementen eingefügt. Dies ist eine nützliche Funktion, wenn Sie größere Blöcke
erstellen, um das Layout für die Seite festzulegen.
Jedoch möchten Sie einer Seite mit bereits festgelegtem Layout sicherlich auch noch kleinere
Blöcke hinzufügen. Hierzu können Sie einen Block erstellen, der das Layout der Seite festlegt,
und das Seitenlayout anschließend mit kleineren Blöcken füllen, die den Inhalt der Seite
unterteilen.
Um Zeit zu sparen, sollten Sie vorab den Container auswählen, der den einzufügenden Block
enthalten soll. Andernfalls wird der Block bei aktiviertem Schwimmverhalten einfach in einen
freien Bereich oder bei deaktiviertem Schwimmverhalten in die Mitte der Seite platziert.
Zusammenfassung: Wenn ein einfaches oder kein Element ausgewählt ist, wird der Block
unabhängig von anderen Faktoren auf der Seite eingefügt.
Wenn ein Container (z. B. ein Panel oder eine Box) ausgewählt ist, wird der Block innerhalb des
Containers als untergeordnetes Element angezeigt.
Ideale Blockgröße
Die in Web Creator Pro 6 bereitgestellten Vorlagen basieren auf einem Mehrfachen von
240 Pixel an Breite. Die Blöcke haben demnach eine Breite von 240, 480, 720 oder 960 Pixel. Die
Höhe folgt demselben Prinzip. Dies ermöglicht 16 unterschiedliche Blockabmessungen.
Webseiten haben durchschnittlich eine Breite von 960 Pixel. Daher ist diese Breite die
Standardseitengröße in Web Creator Pro 6. Diese ermöglicht Ihnen das Hinzufügen von
höchstens vier Blöcken in einer Reihe. Das ist mehr als genug, um eine Vielzahl von Elementen
aufzunehmen. Sie können natürlich auch schmalere Blöcke erstellen, wenn Sie dies wünschen.
Wie in den Abschnitten zu Containern und zum Schwimmen erläutert wurde, sollten Sie
bedenken, dass die Breite all Ihrer Container in einer Reihe der Breite Ihrer Seite entsprechen
sollte. Auch die Höhe der Blöcke sollte dieselbe oder proportional (entsprechend einem
Mehrfachen) weniger sein.
Seite 76 / 77
Leuchtdichte und Transparenz
Zusätzlich zur Farbe, die für die meisten Elemente angepasst werden kann,
ermöglicht Web Creator Pro 6 es Ihnen, die Transparenz und Leuchtdichte nicht nur für Panels
und Boxen zu verwalten, sondern auch für Texte, Schaltflächen usw. Dadurch erhalten Sie die
Möglichkeit, andere Elemente auf der Seite (z. B. Grafiken) mit Effekten zu überlagern, ohne
dass Sie diese Elemente dafür direkt ändern müssen. Dies ermöglicht es Ihnen, durch das
Ändern nur weniger Elemente websiteübergreifende Änderungen herbeizuführen.
Verwenden Sie die Registerkarte Element in der Symbolleiste Eigenschaften für ein
ausgewähltes Element. Wählen Sie nun das Symbol aus, das wie die Farbpalette eines Malers
aussieht. Im unteren Teil des angezeigten Fensters können Sie die Leuchtdichte und
Transparenz der ausgewählten Farbe ändern.
Verwenden Sie unterschiedliche Kombinationen, um deren Auswirkungen auf ein Element zu
testen. Diese Vorgehensweise empfiehlt sich insbesondere in Situationen, in denen Elemente
schichtweise übereinander angeordnet sind.
Seite 77 / 77

Einführung in Web Creator Pro 6

Transcrição

Documentos relacionados

Firewall ZoneLabs

Pdf zusammenfgen online

Wirtschaftswoche Betrugsverdacht Caviar-Creator-Chef

Ferienhaus ”SIGRIDS HUS”, Strandvolden 3, Balka, 3730 Nexø

Hinweise für Autoren

Kostenlos: Winrip und WinDVD Creator 2 platinum (Wert

Tenor 1. Die Klage wird abgewiesen. 2. Jede Partei trägt - EUR-Lex

Handbuch DVM-Configurator - WS

`Container`

CDex 1 - WAV-Dateien nach MP3-Dateien - Christian Rogge