|
4. Kostenlose Erstellung einer Homepage |
|
Artikel -
HTML - Grundlagen und Praxis
|
Zur eigenen Homepage in wenigen Schritten 4 Umgang mit dem Editor und Erstellung der Homepage Nachdem sie den Editor installiert haben, können sie ihn unter Start/Programme/FreeHTML 6.1 starten. Danach wird sich ein Fenster mit Werbung über den Editor und den Kaufpreis der Vollversion öffnen, dieses kann nach 5 Sekunden mit Start Program geschlossen werden und das eigendlich Programm wird gestartet.  | 4.1 Überschrift und Layout |  | Bei "Page Title" tippen sie den Titel ihrer Seite ein, dieser wird im Browserfenster angezeig. Anschliessend klicken sie auf "Choose Page Theme". Es wird sich ein neues Fenster öffnen, in welchem sie ein Layout aussuchen können. Sie können dies auch nachträglich noch bearbeiten. | |
| Um nun noch eine Sichtbare Überschrift auf der Seite zu haben, klicken sie in der Leiste links das Seitenelement Heading an und ziehen es zwischen Page Details und Image. Im Textfeld geben sie nun den Titel ein, der auf der Seite erscheinen soll. Mit einem Klick auf "Aa" können sie Schriftart und Schriftgrösse ändern. | |
|  |
4.2 Bild einfügen Bestimmt wollen sie auch Bilder einfügen. Für meine Taucherhomepage hab ich noch ein paar Urlaubsbilder und eine Taucherausrüstung im JPG-Format gefunden. Um das Bild einzufügen, klicken sie auf Image in der Leiste zwischen Heading und Link. Falls sie mehr als ein Bild einfügen wollen, so holen sie sich ein neues Element links aus der Elementleiste und setzten es am gewünschten Ort ab.
| | | Gehen sie auf Browse (Schaltfläche welche umkreist ist) und wählen das einzufügende Bild. Bei Height und Width können sie noch die Grösse des Bildes ändern, falls es ihnen zu gross ist, sie sollten aber nicht ein zu kleines Bild grösser machen, da dies dann pixelig wird, also die Auflösung schlecht ist. Bei Align können sie die Ausrichtung des Bildes bestimmen. Bei Image Hint (Der sogenante alt - Tag) können sie ein kleine Beshreibung des Bildes schreiben, diese wird dann angezeigt, wenn das Bild nicht geladen werden kann, oder der Benutzer mit der Maus drüberfährt. Bei Make image a link können sie noch einen Link hinzufügen, beispielsweise auf die Unterseite, wenn man dann auf das Bild klick, so landet man auf der angegebenen Seite.
Tipp: Unter C:\Programme\CoffeeCup Software\FREE HTML 6.0\Upload\Images finden sie weitere zahlreiche Grafiken, welche sie frei verwenden dürfen. | | |  |
4.3 Text schreiben Auf der Startseite sollte auch stehen, was den Surfer erwartet. Denn es ist ärgerlich für den Besucher, wenn er nicht innerhalb kürzester Zeit weiss, ob er sich auf der richtigen Webseite befindet. | Klicken sie auf das Seitenelement Paragraph und schreiben sie ins Textfeld eine nette Begrüssung. Wie zuvor bei der Überschrift lässt sich auch hier über die Schaltfläche "Aa" Schriftart und Schriftgrösse ändern. Auch gilt hier, wenn sie mehrere Texte schreiben wollen, ziehen sie einfach ein neues Seitenelement Paragraph in die Leiste und plazieren es am gewünschten Ort. | | |  |
4.4 Trennlinie | | Damit der Text optisch von den Links getrennt wird, setzen wir eine horizontale Trennlinie. Dazu nehmen sie sich aus der linken Seitenelementleiste das Seitenelement Line und setzen es unter das Seitenelement Paragraph. Sie können nun die Länge der Linie Prozentual angeben und auch die Dicke, unten sehen sie jeweils das Ergebniss in der Vorschau. | | |  |
4.5 Links einfügen Die Startseite ist beinahe fertig! Da eine ordentliche Homepage aus mehrern Seiten (HTML-Dateien) besteht, fehlen uns noch die Links auf diese Unterseiten. Wir verwenden das Seitenelement Link. Unter Link-Adress tragen sie den Namen einer Unterseite, welche sie bei ihrem Schema, Punkt 2.1, gewählt haben. Bei Link Text schreiben sie, was hinter dem Link für eine Page liegt.
Sie können auch eine E-Mail Adresse eingeben, für die Kontaktaufnahme der Besucher, wählen sie dann einfach Make link an email address. Fügen sie nun für jede weitere vorgesehene Seite ein solches Linkelement ein. Halten sie sich dabei stehts an die zuvor definierten Namen der einzelnen Seiten. Beim Abspeichern müssen sie dann ebenfalls diese Namen verwenden. |  |
4.6 Betrachten und Speichern der Homepage So nun haben sie es fast geschaft, sie sind sicher schon neugierig, wie den die Seite die sie selbst geschaffen haben aussieht. Nun dies können sie mit einem einfachen Klick auf View Page rechts in der Leiste vornehmen. Wenn sie nun oben rechts auf View Page klicken, so sehen sie die Homepage im Browser. Sie haben jetzt imme rnoch die Möglichlkeit, das Layout ihrer Seite zu verändern. Um die Homepage zu speichern, klicken sie auf rechts in der Leiste auf Save Page und geben sie den vom Schema her definierten Namen ein (ohne .html). Ihre Homepage finden sie nun unter C:\Programme\CoffeeCup Software\FREE HTML 6.0\Upload dort sind auch noch andere Beispiele enthalten, diese können sie getrost löschen oder in einen Ordner verschieben. |
|