Webseiten erstellen mit CHEETAH
Die wichtigsten Gestaltungselemente im Überblick (1)
Builderall „Cheetah“ ist für das „schnelle Webseitendesign“ ausgelegt. Es stellt deshalb nicht nur „native“ Elemente wie beispielsweise jeweils ein Element für „Linien“, ein Element, um Bilder einzufügen und ein Element zur Gestaltung einer Schaltfläche (Button) zur Verfügung, sondern oftmals gleich mehrere, vorkonfigurierte Varianten davon. Außerdem werden auch Verbund-Elemente wie komplette -Formulare, diverse Kontaktformulare, Blog-Bestandteile oder Bildergalerien zum drag’n drop angeboten. Und man kann davon ausgehen, dass mit (fast) jedem neuen Release des Sitebuilders die Anzahl derartiger vorkonfigurierter Elemente weiter ansteigen wird. Und, was das eigentlich revolutionäre ist, Sie können auch eigene Verbundelemente (bis hin zum komplett ausgestatteten Banner) erstellen und in einer eigenen Elementebibliothek dauerhaft speichern.
Boxen als Gestaltungselement und Elemente-Container
Der Elementtyp "Box" des „Cheetah“ Sitebuilders dient sowohl als natives Gestaltungselement als auch als Container für andere Elemente. Das bedeutet, wenn man andere Elemente (Text, Buttons, Bilder etc.) innerhalb oder überschneidend mit einer Box anordnet, dann bilden sie dergestalt eine Einheit, dass sie sich mit der Box als Ganzes neu positionieren lassen und auch gelöscht werden, sobald man die Box - d. h. ihren Container - löscht. Auch lassen sich funktionell gestaltete Boxen sehr gut als individuelle Vorlagen speichern und damit für andere Webseiten verfügbar machen.
Der umfangreiche Satz an Eigenschaften einer Box lässt vielfältige Gestaltungsmöglichkeiten zu:
Sie können u. a. die Größe einer Box pixelgenau einstellen, eine Box beliebig einfärben (auch Farbverläufe sind möglich), sie mit einem Bild ausstatten, einen Rahmen mit und ohne Schatten hinzufügen, die Ecken der Box mit einstellbaren Radien abrunden und auch Boxen mit diversen Parallaxen- und Animationseffekten ausstatten. Wir empfehlen, die einzelnen Möglichkeiten, die sich damit ergeben, einmal selbst auszuprobieren.
Wenn Sie sich das Kopfmenü einer Box anschauen, dann finden Sie darin die Funktion „Pin“. Wie der Name schon andeutet, können Sie damit eine Box samt ihrem Inhalt irgendwo auf dem Bildschirm „anpinnen“, d. h. sie bleibt dann beim Scrollen der Webseite fest an dieser einmal festgelegten Position (der Bezugsrahmen ist dabei immer der auf dem Bildschirm sichtbare Teil der Webseite).
Hinweis: Die „stick“-Funktion steht in der mobilen Ansicht der Webseite nicht zur Verfügung!
Klicken Sie auf die Pin-Funktion im Kopfmenü, dann öffnet sich folgender kleiner Einstelldialog, über den Sie die Position mit einem Klick in das entsprechende Kästchen festlegen können:
Wenn Sie jedoch die Position der „sticky Box“ manuell festlegen wollen, dann müssen Sie hier stattdessen die Schaltfläche „Manual Stick“ anklicken. Am besten, Sie probieren das gleich einmal selbst aus. Die Verwendung von „Sticky Boxen“ ist übrigens immer dann angebracht, wenn Sie beispielsweise Werbung auf einer Webseite anzeigen lassen wollen, die beim Scrollen der Seite immer auf der Seite an der gleichen Bildschirmposition sichtbar bleibt.
Boxen als Elemente-Container
Boxen sind in erster Linie dazu da, um verschiedene Elemente zu einem neuen Objekt zusammenzufassen (d. h. sie dienen als Elemente-Container). Dazu muss man lediglich verschiedene Elemente auf einer Box (die durchaus völlig "durchsichtig" sein kann - eine Vorlage dafür findet man im Box-Bereich des rechten Randmenüs) anordnen. Wenn man jetzt mit der Maus die Box verschiebt, dann erkennt man, dass alle auf der Box befindliche Elemente ihre relative Lage zur Box beibehalten und mit verschoben werden. Löscht man die Box, dann werden auch alle darauf liegenden Elemente mitgelöscht. Auf diese Weise lassen sich kinderleicht Compound-Objekte erstellen, die sich auch als eigene Vorlagen speichern lassen (viele Elemente in der Elementeauswahl von „Cheetah“ sind übrigens solche Compound-Objekte).
Das folgende Bild zeigt eine einfache „Call to Action“ - Vorlage auf der Grundlage einer völlig durchsichtigen Box:
Hinweis: Die Zentrierfunktion im Kopfmenü der meisten Elemente zentriert das entsprechende Element immer relativ zur rechten und linken Begrenzung seines Containers (also entweder zum Banner oder zur Box).
Weiterhin ist es noch wichtig zu wissen, dass man über die Eigenschaft „Layer“ die z-Position in Bezug auf andere, überlappende Boxen festlegen kann. Auch eine Kopie (Kopfmenü „Element klonen“) einer Box besteht nicht nur aus der Box selbst, sondern aus der Box mit allen darauf angeordneten Elementen. Auch sollten Sie unbedingt einmal die vielfältigen Animationseffekte ausprobieren (Element-Eigenschaft „Animation“), die Ihrer Webseite ohne viel Aufwand einen gewissen „Kick“ gibt. Zum Testen müssen Sie aber jeweils in den Preview-Modus im Cheetah-Editor wechseln.
Tipp: Wenn Sie sich angewöhnen, logisch zusammengehörige Elemente immer auf (durchsichtige) Boxen zu legen, so können sie diese leichter mit der Box als Ganzes verschieben und brauchen sie damit nicht immer einzeln neu zu positionieren.