Die Original-Homepagevorlage hat drei Varianten
Das Original besteht nicht aus einer, sondern sogar aus 3 Homepagevorlagen. Durch Klick auf ein Bild öffnen Sie die jeweilige Variante der Homepagevorlagen. So können Sie direkt Vorlage und fertige Website vergleichen.
Mit dem folgenden Link öffnen Sie die fertige Website: http://www.Instant-Homepage.de
Wir entscheiden uns für Variante 1. Zuerst müssen wir die Menüpunkte anpassen.
In dieser Vorlage hat es uns der Designer leicht gemacht: Die Menüeinträge und URLs der Buttons lassen sich über eine Textdatei festlegen. Das heißt, wir müssen nicht einmal Macromedia Flash bemühen, ein simpler Texteditor genügt. Leider gibt es das recht selten, die meisten Homepagevorlagen mit Flash-Elementen können nur mit der Software Macromedia Flash bearbeitet werden.
Menü der Vorlage im Original:
Textdatei des Flashmenüs in der Original-Vorlage:
name=Company Name&slogan=company slogan goes here&label1=NAVIGATION&button1=Home&button2=Our Company
& button 3=Solutions&button4=Portfolio&button5=Downloads&button6=Contacts&button7=HOME&button8=CONTACTS&
rep=replay&url1=#&url2=#&url3=#&url4=#&url5=#&url6=#&url7=#&url8=#&enddata=1 Textdatei des Flashmenüs nachher:
name=Instant Homepage&slogan=O n l i n e i n 7 T a g e n !&label1=NAVIGATION&button1=Startseite&button2=Was wir tun?
&button3=Ihre Fragen...&button4=Ein Beispiel&button5=Unsere Preise&button6=Web-Vorlagen&button7=START&button8=KONTAKT&
rep=replay&url1=index.htm&url2=homepage-erstellen.htm&url3=faq.htm&url4=beispiel.htm&url5=preise.htm&url6=homepagevorlagen.htm&ul=#&url8=kontakt.htm&enddata=1
Menü der Vorlage nach unserer Anpassung:
Die Zeile mit dem Login-Formular brauchen wir nicht.
Links sehen Sie das Original, rechts das Ergebnis unserer Änderung. Die Bilder darunter zeigen Ihnen wie wir´s gemacht haben.  
Zunächst löschen wir die Anmeldezeile ersatzlos. Dazu arbeiten wir in Macromedia Dreamweaver. Das ist unser bevorzugter Web-Editior.
Sie können Homepgevorlagen aber natürlich mit jedem beliebigen HTML-Editor bearbeiten, zum Beispiel GoLive, Frontpage uvm.
Vorher: In der Mitte des Bildes unter der großen grauen Fläche sehen Sie die Zeile mit dem überflüssigen Anmeldeformular.
Nachher: Es entsteht eine leere Zeile, die Sie in der Mitte des nachstehenden Bildes erkennen können.
Wir verringern diese leere Zeile in der Höhe und fügen den Satz "Neu: Ihre Homepage schnell und preiswert" ein.
So haben wir ein überflüssiges Anmeldefeld durch eine simple Textzeile ersetzt. Die Menüpunkte am unteren Rand brauchen wir vorläufig auch nicht.
Weg damit.
Vorher: Die Buttons "Home", "About Us" usw. werden wir gleich löschen.
Zwischendrin: Jetzt sind leere, graue Zellen entstanden.
Um die grau gewordenen Zellen zu füllen, erstellen wir in Photoshop eine 1 Pixel breite Grafik. Wir schneiden Sie kurzerhand aus einem der Buttons aus. Sie wird als Hintergrund-Kachel in die leeren Zellen eingefügt.
Nachher
Die 1-Pixel-Grafik wird in der Menüzeile eingefügt und "gekachelt", das heißt: so oft nebeneinandergesetzt bis die ganze Zeile gefüllt ist.
Etwas später haben wir in Dreamweaver dann doch neue Links eingefügt, zum Beispiel "Impressum". Dabei haben wir reine Textlinks verwendet, während die Originalvorlage ja Graphiken für die Buttons verwendet hatte. Dieser Teil des Umbaus wäre nicht nötig gewesen, aber er bringt uns den Vorteil, das wir beim Umbau noch nicht entscheiden mußten, welche Links wir verwenden. Besonders auf Websites, die Sie häufiger aktualisieren und ändern, kann es sich lohnen, die graphischen Buttons der Homepagevorlagen durch leichter änderbare Textlinks zu ersetzen.
Sie sehen das Ergebnis auf der fertigen Website. http://www.Instant-Homepage.de
Die "READ MORE"-Knöpfe werden eingedeutscht.
Hier öffnen wir die Vorlage in Photoshop und ersetzen den englischen Text durch den deutschen Text. Die Schrift liegt in der Photoshop-Vorlage noch als Textebene vor, d.h. wir lösen die Aufgabe durch einfaches Überschreiben des englischen Textes.
Die Bearbeitung der Vorlage ist abgeschlossen, jetzt kommen die Inhalte.
Damit ist die Hauptseite, die spätere Index.htm, fertig. Nun machen wir davon mehrere Kopien für die Unterseiten der Homepage und fügen auf allen Seiten die gewünschten Texte ein.
Die Texte haben wir in Word vorbereitet. Mit kopieren und einfügen kommen Sie nun in die einzelnen Seiten der Homepage. Leider sind unsere Texte meist länger als die Texte der Vorlage und das schafft Unordnung. Deshalb müssen wir beim Einfügen der Texte jede Seite einzeln "aufräumen".
Dieser Schritt macht am meisten Arbeit. Wir ersparen Ihnen die Erklärung, zeigen Ihnen aber beispielhaft die entstandene Unordnung mit den roten Pfeilen an. Hauptproblem sind Doppelt auftauchende Bilder und Bilder bzw. Texte und Buttons, die die Rahmenlinien schneiden.
Hier ist die Vorlage nicht so komfortabel wie wir es uns gewünscht hätten, aber letztendlich kostet der Umbau auf jeder Seite nur Minuten. 
Nachdem wir dieses Wirrwarr in Ordnung gebracht haben müssen die Seiten zum Teil noch mit Hyperlinks verlinkt werden, so dass auch was passiert, wenn Sie klicken. (Im Flash-Header hatten wir die Links schon in die Textdatei eingetragen)
Homepagevorlagen: schnell und billig zur neuen Website.
Unsere neue Homepage ist fertig. Insgesamt hat es knapp einen Arbeitstag gedauert alle Änderungen durchzuführen, die Texte zu schreiben und einzufügen. Unsere neue Homepage hat 10 Seiten und einen attraktiven Flash-Header.
Wie lange hätten wir wohl gebraucht, wenn wir das ganze Design mit dem animierten Flash-Header am oberen Rand selbst entworfen hätten??? Ich weiß es ehrlich gesagt nicht, aber etliche Tage wären es gewesen. Wir sind mittlerweile dazu übergegangen die meisten unserer neuen Homepages mit Homepagevorlagen zu erstellen. |
