Fußball-Fans gehen ins Stadion, Musikfans besuchen Konzerte, und Spiele-Fans basteln Webseiten zu ihren Lieblingstiteln. Wir zeigen Ihnen, wie auch Sie eine eigene Fanseite erstellen können.
Im Dreamweaver fügen wir später die Buttons in der Navigationsleiste nacheinander als so genannte Rollover-Bilder ein. Dabei geben wir als Originalbild den normalen Button an, als Rollover-Bild den mit dem 3D-Effekt. Das Ergebnis: Wenn der Benutzer mit dem Mauszeiger über die Buttons in der Navigationsleiste fährt, wird der jeweils aktive Button durch den 3D-Effekt hervorgehoben.
Format entscheidet
Jetzt gestalten wir den oberen, statischen Bereich, der die Überschrift enthalten soll. Das mitgelieferte Logo ist im PSD-Format und damit für das Internet untauglich. Also öffnen wir die Datei im Paint Shop Pro und speichern sie zunächst im GIF-Format ab. Dabei ändern wir die Eigenschaften über den Punkt »Optionen« im Speichern-Dialog so, dass der Hintergrund transparent wird, also später nur die Schrift zu sehen ist. Anschließend passen wir die Größe an und fügen das Bild ein.
Der obere Teil wirkt aber irgendwie noch sehr leer, also peppen wir ihn mit einigen Grafiken auf. Dazu laden wir uns zwei Oblivion-Hintergrundbilder herunter, wieder von der offiziellen Website (unter »Downloads« -- »Wallpaper«. Im Paint Shop schneiden wir die beiden Figuren aus und spiegeln eine davon -- wir wollen eine links und eine rechts des Logos platzieren. Jetzt passen wir noch die Bildgröße der Grafiken an die des Logos an. Auch die beiden Figuren sollen ohne Hintergrund dargestellt werden, daher speichern wir sie im GIF-Format ab und machen den schwarzen Hintergrund dabei transparent. Dann bauen wir die fertigen Bilder ein.
Seiten füllen
Damit sind die Vorbereitungen abgeschlossen und wir widmen uns den eigentlichen Inhalten. Wir beginnen mit der Startseite und schreiben einen Begrüßungstext, und zwar direkt in den Hauptframe in Dreamweaver. Anschließend verknüpfen wir den Button »Home« mit dem Mainframe. Danach speichern wir Kopien dieses Mainframes für jede Seite, die wir noch machen müssen, also »bilder.html«, »videos.html«, und so weiter. Diese dient dann als Basis für die jeweiligen Unterseiten, den Text löschen wir jeweils einfach und füllen die Rubrik danach mit den eigentlichen Inhalten.
Wir fangen mit der leichtesten davon an, den Links. Hier fügen wir unter den jeweiligen Unterpunkten zweispaltige Tabellen ein: Auf der linken Seite tragen wir den Namen der Zielseite ein und verknüpfen den Eintrag entsprechend mit der Zieladresse. Rechts davon erklärt eine kurze Beschreibung dem Besucher, was ihn auf der Zielseite erwartet. Wichtig: Da wir wollen, dass die verlinkten Seite in einem neuen Browserfenster angezeigt werden, wählen wir bei Ziel den Eintrag »_blank«.
Bilder einbinden
Als nächstes widmen wir uns der Seite mit den Bildern. Screenshots erstellen Sie mit einfach zu bedienenden Grab-Programmen wie Fraps, moderne Spiele haben aber auch oft bereits eine eingebaute Screenshot-Funktion. Als erstes bearbeiten wir unsere Bilder im Paint Shop. Einerseits verkleinern wir unsere Screenshots von 1.280 mal 1.024 auf 800 mal 640, da viele Benutzer nur eine Auflösung von 1.024x768 Bildpunkten verwenden -- und bei denen soll das Bild ja auch vernünftig angezeigt werden. Außerdem erstellen wir einen so genannten Thumbnail (Daumennagel) von jedem Bild: Das sind stark verkleinerte Versionen der anzuzeigenden Grafiken, auf denen der Benutzer aber schon erkennt, was die vergrößerte Version zeigen wird.
