Der schnelle Weg zur eigenen Website und zum eigenen Blog
„Rapid Design“ einer ersten WebsiteKommen wir jetzt zu einer ersten kleinen Beispielwebseite, die quasi „blitzschnell“mit „Cheetah“ entwickelt werden soll (ein Webdesigner, der schon etwasmit dem „Cheetah“ Sitebuilder vertraut ist und auch ein paar Vorbereitungsarbeitenerledigt hat, sollte dafür kaum mehr als eine halbe Stunde benötigen– deshalb „Rapid Design“).Das Ziel der Übung soll sein, eine kleine Landingpage zum Thema "Cuba-Zigarren" zu entwickeln, welche aus einem Header, einem Content-Band undeinem Footer mit Kontaktformular besteht. Um uns die Arbeit zu vereinfachen,bauen wir die Inhalts-Struktur aus vorgefertigten Banner-Templates auf, die wiranschließend anpassen. Natürlich hätte man auch (was der häufigere Fall seindürfte) mit völlig leeren Bändern beginnen können.Was die erwähnten „Vorbereitungsarbeiten“ betrifft, so bestehen Sie hier inerster Linie aus einer Vorauswahl von lizenzfreien Bildern und eventuell in derBereitstellung von Textbausteinen, die Verwendung finden sollen. Und natürlichsollte man sich schon gewisse Vorstellungen über den Aufbau und dieFunktionsweise der Website gemacht haben (beispielsweise in Form einer einfachenSkizze).In diesem Beispiel soll die Website lediglich aus einer Homepage und einer separatenImpressum-Seite bestehen, die im Seitenfooter verlinkt ist.Legen Sie im „Cheetah“ Sitebuilder eine neue Website mit dem Namen „Cuba-Zigarren“ an und öffnen Sie anschließend in der Seitenansicht die Seite „Home“im Editor. Über alle Einstellungen, die über die Standardeinstellungen hinausgehen,kümmern wir uns später.85
Bannerstruktur der Homepage zusammenstellenDie Homepage soll aus drei Bannern bestehen: dem Header, einem 1st Fold-Banner und einem Footer. Wir wählen dazu aus den Banner-Vorlagen zuerstden Banner „Express Header“ (Kategorie „Header“), dann den 1st Fold – Banner„1st Fold – 08“ und dem Footer „Express Footer“. Das Ergebnis sieht dannim Editor so aus:Anpassung der Bannerinhalte an die AufgabenstellungJetzt können wir beginnen, unsere Webseite anhand der in den Editor geladenenTemplate-Banner zu gestalten. Hier macht es sich bezahlt, wenn man bereitsim Vorfeld einige Vorbereitungen getroffen hat. Das betrifft u. a. die Bereitstellungder einzubauenden Bilder in einem separaten Ordner zusammenmit ein paar vorformulierten Texten, die unformatiert in einer einfachen Textdateivorliegen sollten. Letztere kann man dann mit einem Editor oder mit86
- Seite 48 und 49: ohne weitere Änderungen „brauchb
- Seite 50 und 51: In diesem Modus können Sie - wie S
- Seite 52 und 53: Weiterhin finden Sie bei fast allen
- Seite 54 und 55: das Randmenü einstellen (probieren
- Seite 56 und 57: fügen und an genau die Stelle posi
- Seite 58 und 59: Neben dem eigentlichen Text können
- Seite 60 und 61: te Kontaktformulare nach Ihren Wün
- Seite 62 und 63: Damit ist das Kontaktformular erst
- Seite 64 und 65: derungen am Header oder Footer vorn
- Seite 66 und 67: Wir brauchen hier also nichts weite
- Seite 68 und 69: Übrigens, wenn Sie die Vorlage nic
- Seite 70 und 71: Wenn Sie auf die beschriebene Weise
- Seite 72 und 73: und Sie brauchen sich nicht darum z
- Seite 74 und 75: Außerdem können Sie hier noch ein
- Seite 76 und 77: Webseiten bauen mit „Cheetah“Na
- Seite 78 und 79: Arbeitsschritt HTML- und CSS- Code
- Seite 80 und 81: Webseiten werden in „Cheetah“ a
- Seite 82 und 83: weitere Elemente einzufügen. Wenn
- Seite 84 und 85: Natürlich ist die auf diese Weise
- Seite 86 und 87: SidebarZusätzliche Informationen i
- Seite 88 und 89: Den „Seitenhintergrund“ an sich
- Seite 90 und 91: Unabhängig von der Transparenz kö
- Seite 92 und 93: Jetzt brauchen Sie nur noch eines d
- Seite 94 und 95: zentriert. Das kann das Banner sein
- Seite 96 und 97: Wie man eigene Elemente- und Banner
- Seite 100 und 101: WordPad öffnen und ganz oder stüc
- Seite 102 und 103: Nun sollten Sie im Eigenschaftenber
- Seite 104 und 105: Damit ist das „Content-Banner“
- Seite 106 und 107: Auf Weiterleitungen und den Einsatz
- Seite 108 und 109: Drei-Punkte-Menü die Seiteneinstel
- Seite 110 und 111: Anpassung der mobilen Version„Che
- Seite 112 und 113: Letzte Arbeiten und Veröffentlichu
- Seite 114 und 115: ÜberschriftenstrukturSowohl für d
- Seite 116 und 117: Weiterhin ist in Hinsicht auf SEO w
- Seite 118 und 119: Nachdem Sie sich Gedanken gemacht h
- Seite 120 und 121: TIPP: Sie können die Sie interessi
- Seite 122 und 123: selbst erklärender Dialog, in dem
- Seite 124 und 125: Ein detaillierter Blick auf BannerD
- Seite 126 und 127: neue Elemente oder auch für mehr T
- Seite 128 und 129: ParallaxeneffektAllein schon mit di
- Seite 130 und 131: Banner als Linkziele (Anker)Banner
- Seite 132 und 133: Die wichtigsten Gestaltungselemente
- Seite 134 und 135: Wenn Sie jedoch die Position der
- Seite 136 und 137: Schaltflächen (Buttons)„Buttons
- Seite 138 und 139: Auf der linken Seite wählen Sie di
- Seite 140 und 141: Allgemeines zum Thema „Bildern au
- Seite 142 und 143: Wenn das geschehen ist, müssen Sie
- Seite 144 und 145: sei Ihnen überlassen. In solch ein
- Seite 146 und 147: Wie integriert man eine Bildergaler
„Rapid Design“ einer ersten Website
Kommen wir jetzt zu einer ersten kleinen Beispielwebseite, die quasi „blitzschnell“
mit „Cheetah“ entwickelt werden soll (ein Webdesigner, der schon etwas
mit dem „Cheetah“ Sitebuilder vertraut ist und auch ein paar Vorbereitungsarbeiten
erledigt hat, sollte dafür kaum mehr als eine halbe Stunde benötigen
– deshalb „Rapid Design“).
Das Ziel der Übung soll sein, eine kleine Landingpage zum Thema "Cuba-
Zigarren" zu entwickeln, welche aus einem Header, einem Content-Band und
einem Footer mit Kontaktformular besteht. Um uns die Arbeit zu vereinfachen,
bauen wir die Inhalts-Struktur aus vorgefertigten Banner-Templates auf, die wir
anschließend anpassen. Natürlich hätte man auch (was der häufigere Fall sein
dürfte) mit völlig leeren Bändern beginnen können.
Was die erwähnten „Vorbereitungsarbeiten“ betrifft, so bestehen Sie hier in
erster Linie aus einer Vorauswahl von lizenzfreien Bildern und eventuell in der
Bereitstellung von Textbausteinen, die Verwendung finden sollen. Und natürlich
sollte man sich schon gewisse Vorstellungen über den Aufbau und die
Funktionsweise der Website gemacht haben (beispielsweise in Form einer einfachen
Skizze).
In diesem Beispiel soll die Website lediglich aus einer Homepage und einer separaten
Impressum-Seite bestehen, die im Seitenfooter verlinkt ist.
Legen Sie im „Cheetah“ Sitebuilder eine neue Website mit dem Namen „Cuba-
Zigarren“ an und öffnen Sie anschließend in der Seitenansicht die Seite „Home“
im Editor. Über alle Einstellungen, die über die Standardeinstellungen hinausgehen,
kümmern wir uns später.
85